@charset "utf-8";
@import url("nav.css");
/* CSS Document */
body {
  margin: 0px;
  padding: 0px;
  font-family: 'open_sansregular';
  background: #FFF;

}
#container {
  width: 100%;
  margin: 0 auto;
  padding: 0px;
  background: #FFF;
}

.top_header {
  width: 99%;
  padding: 2em 1em;
  display: block;
  height: 60px;
 box-sizing: border-box;
	margin:0px auto;
}
.top_social {
  width: 20%;
  display: inline-block;
  float: left;
}
.top_social_icon {
  display: inline-block;
}
.top_social_icon img {
  margin: 0 5px;
  display: inline-block;
}
.righttop_contactinfo {
  width: 35%;
  display: inline-block;
  float: right;
  vertical-align: top;
  font-family: 'open_sansregular';
}
#b3form {width:50%; margin:0 auto; text-align: center;}
.top_header_whitebox {
  display: inline-block;
  width: 55%;
  height: 50px;
  float: left;
  text-align: center;
  background: #FFF;
  padding: 12px 0 0px;
  border: 1px solid #000;
  box-sizing: border-box;
  margin-right: 5px;
  text-transform: uppercase;
}
.top_header_blackbox {
  display: inline-block;
  text-transform: uppercase;
  width: 40%;
  background: #000;
  height: 50px;
  box-sizing: border-box;
  padding: 5px 0px;
  float: left;
  text-align: center;
  color: #FFF;
}
.logo {
  margin: 50px auto 25px;
  width: 70%;
  display: block;
  text-align: center;
	border-bottom: solid #000 1px; 
}
.logo img {
  text-align: center;
  margin: 0 auto;
	padding-bottom:2.5em;
}
.video {
  width: 100%;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a1820e+0,d0ba64+49,e8d787+100 */
background: #2a1529; /* Old browsers */

}
.main_quote {
  width: 100%;
  display: block;
	text-align: center;
	padding:3em 0px;
	box-sizing: border-box;
	text-transform: uppercase
}
.headline_quote {font-size:4em;  font-family: 'Rufina Regular'; padding-bottom:-5px; margin-top:1em;}
.headline_bottom {font-size:4em; }
.navigation {width:100%; display:block; margin-bottom:1em; position: relative; z-index: 100;}
.three_catagories {display:block; width:100%; padding:2em 0px; box-sizing: border-box; text-align: center;}
.three_boxes {width:30%; display: inline-block; }
.three_boxes img {width:100%;}
.threeboxes_title {font-size:2em; padding-top:1em; box-sizing: border-box; text-transform: uppercase;}
.best_results {background-image: url("../jpg/brown_background.jpg"); background-repeat:repeat-y; width:100%; display:block; padding:2m 0px; text-align: center; margin-top:3em;}
.best_results_pic {width:40%; display:inline-block; margin:4em; }
.best_results_pic img {width:100%; }
.best_results_info {width:40%; display:inline-block;vertical-align: top; margin:2em 0em; } 
.best_results_info_paragraph {margin:2em 0em;  text-align: left; font-size:1.5em; width:100%}
.best_results_headline {font-size:3em; font-family: 'Rufina Regular'; padding-bottom:-5px; color:#000; text-align: left; margin-top:2em;}
.best_results_button a {width:200px; text-align:center; padding:5px; margin-top:2em; color:#FFF; display:block; background-color:#000; border-radius:5px;}

.our_experts {display:inline-block; width:100%; margin:2em 0em; padding:0px 2em;  background-color:#FFF; text-align:center; box-sizing:border-box;}
.expert_circle {width:30%; display:inline-block; padding:0em 1em; text-align: center; margin-top:3em; }
.expert_circle img {width:70%;}
.expert_info {width:70%; text-align: center; margin:0 auto; font-size:2em;}
.expert_header {font-size:4em; font-family: 'Rufina Regular'; text-transform: uppercase; padding-bottom:-5px; color:#000; text-align: center; margin-bottom:.5em;}
.expert_name {margin-top:1em; text-transform:uppercase; font-weight: 400; font-size:2em; }

.our_two_catagories {background:#FFF; width:100%; text-align: center; margin:4em auto 5em; }
.catagory_box {width:25%; margin:0 auto; text-align: center; display: inline-block;margin:0px 2em;}
.catagory_box img {width:100%;}

.our_products {background-color:#e6d5cd; padding:2em 0em; text-align:center; box-sizing:border-box;}
.ourproducts_header {font-size:4em; font-family: 'Rufina Regular'; text-transform: uppercase; padding-bottom:-5px; color:#000; text-align: center; margin-bottom:.5em;}
.ourproducts_info {width:70%; text-align: center; margin:0 auto; font-size:2em;}
.ourproducts_button {margin:2em auto; text-align: center; width:100%}
.ourproducts_button a {width:300px; text-align:center; padding:5px; margin:2em auto 0em; color:#FFF; display:block; background-color:#000; border-radius:5px; text-transform:uppercase; font-size:1.5em;}


.homepage_instagram  {backgroun:#FFF; text-align:center; margin:4em auto;   }
.homepage_instagram_header {font-size:4em; font-family: 'Rufina Regular'; text-transform: uppercase; padding-bottom:-5px; color:#000; text-align: center; margin-bottom:.5em;}
.homepage_instagram_photos {text-align: center;}
.homepage_instagram_photos img {width:100%;}

.homepage_footer {background:#000; padding:3em 3em; text-align: center; color:#FFF; box-sizing: border-box; width:100%}
.homepage_footer_logo {text-align: center; margin-bottom:2em;}
.homepage_footer_box {width:20%; display: inline-block; vertical-align: text-top;}
.homepage_footer_box ul {list-style-type: none; margin:0px; padding:0px;}
.homepage_footer_box a {color:#FFF;}
.footer_header {font-size:2em; font-family: 'Rufina Regular'; text-transform: uppercase; padding-bottom:-5px; text-align: center; margin-bottom:.5em;align:top; vertical-align: top;}
.footer_copyright {background:#e6d5cd !important;  box-sizing: border-box; width:100%; display:block; height:35px; padding-top:5px;}
.footer_copyright_left {display:inline-block; float:left; background:#e6d5cd; padding:5px;width:40%}
.footer_copyright_right {display:inline-block; float:right; background:#e6d5cd; padding:5px; width:30%; text-align: right;}
.footer_button {margin:2em auto; text-align: center; width:100%}
.footer_button a {width:150px; text-align:center; padding:5px; margin:2em auto 0em; color:#000; display:block; background-color:#FFF; border-radius:5px; text-transform:uppercase; font-size:1em;}

#videoDiv {width: 100%; height:515px; overflow:hidden;  position: relative; z-index:0;}
#video1 { margin: auto; display: block; position:relative; width:100%; overflow:hidden;}
#videoMessage { position: absolute; top: 0; left: 0;
display: flex;
flex-direction: column; 
justify-content: center; 
align-items: center; i
width: 100%;
height: 100%;}
.top_header_whitebox a {color:#000;}
.top_header_blackbox a {color:#FFF;}

#videoMessage *{padding:0.4em; margin:0}
#videoMessage {text-shadow: 2px 2px 2px #000000; color:white;z-index:99 }
#videoMessage h1{font-size: 2em;color:#ffffff;text-align:center;}
#videoMessage h2{font-size: 1.5em;color:#ffffff;text-align:center;}
#videoMessage h3{font-size: 1.2em;color:#ffffff;text-align:center;}
.videoClick {text-align:center}
.videoClick a{color:white;background-color:rgba(241, 241, 241, 0.25);font-size: 1.7em;cursor:pointer;cursor:hand}

.internal_page_body {width:100%;display:block;  box-sizing:border-box; padding:2em 5em;}
.internal_page_info_header {width:100%; height:200px; display:inline-block; text-align: center; font-size:4em; color:#FFF; text-align: center; padding:1em 0em 0em; box-sizing:border-box; background-image: url("../jpg/page_background.jpg");}
.left_page_nav {width:20%; display:inline-block; float:left; text-align:left; box-sizing:border-box; background-color:#fbfbfb; padding:1em;}
.right_page_info {width:75%; display:inline-block; float:right; }
.center_page_info {width:90%; display:inline-block; text-align: center; margin:0 auto;  }
.internalpage_footer {width:100%; display:inline-block; color:#FFF; background-image: url("../jpg/page_background.jpg");
 padding:1em; margin-top:3em; text-align: center; text-align: center; font-size:2em;box-sizing:border-box;} 
.left_page_nav ul {  list-style-type: none; margin:0px; padding:0px;}
.left_page_nav ul li {display:block; padding:1em; border-bottom:1px solid #dddddd; text-transform:uppercase;}
.left_page_nav ul li a {color:#000;}
.left_page_nav a {color:#000;}
.left_page_nav ul li a:hover {color:#000; display: block;}
.left_page_nav ul li:hover {display:block; background-color:#2a1529; color:#fff !important;}
.left_page_nav p  {color:#000; text-transform:uppercase; font-size:1.5em; font-weight:bold; border-bottom:3px solid #dddddd }
.medical_box {margin:1em 0px 3em;}
.medical_box header {font-size:2em; text-transform:uppercase; margin:0em 0px 1em; padding:1em; border: 1px solid #D4AF37;}
.medical_box ul {margin-left:2em;}
.subheader {margin:1em 0px; font-weight: bold;}
.product {margin-top:1em; width:65%; float:right; display:inline-block;}
.service_pic {float:left; width: 20%; display:inline-block;}
.service_info { width:70%; display:inline-block;}
.service_info p {margin-top:0em;}
.peel_box {width:22%; display:inline-block;  text-align: center; padding:1em; box-sizing: border-box; vertical-align: text-top; margin:2em 1em; border:1px solid #aaaaaa; height:300px;  }

.b3header {width:100%; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a1820e+0,d0ba64+49,e8d787+100 */
background: #a1820e; /* Old browsers */
background: -moz-linear-gradient(left,  #a1820e 0%, #d0ba64 49%, #e8d787 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #a1820e 0%,#d0ba64 49%,#e8d787 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #a1820e 0%,#d0ba64 49%,#e8d787 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a1820e', endColorstr='#e8d787',GradientType=1 ); /* IE6-9 */ color:#000; font-weight:bold; font-size:4em; padding:.5em 0 .5em; text-align: center; text-transform: uppercase;}
.b3toppage {width:60%; text-align:center; font-size:1.5em; margin:1em auto;}
.header2 {font-size:3em; font-weight:bold; margin:1em 0px; }
.b3box {width:24%; display: inline-block; text-align:center; border:1px solid #717171; padding:1em; box-sizing: border-box; margin:2em 1em; vertical-align: text-top;  padding:2em 10px; height:550px;}
.b3box_header {font-size:2em; font-weight:bold; color:#D4AF37; margin:1em 0px;}
.b3container {margin:0 auto; width:100%; display:block; text-align: center;}
.b3_button {margin:2em auto; text-align: center; width:100%}
.b3_button a {width:150px; text-align:center; padding:5px; margin:2em auto 0em; color:#FFFF; display:block; background-color:#000; border-radius:5px; text-transform:uppercase; font-size:1em;}
.b3_button hover {width:300px; text-align:center; padding:1em; margin:2em 0em; color:#000; display:block; background-color:#D4AF37; border-radius:3px; text-transform:uppercase; font-size:1em;}


.contactbox {width:24%; display: inline-block; text-align:center; border:1px solid #717171; padding:1em; box-sizing: border-box; margin:2em 1em; vertical-align: text-top;  padding:2em 10px; height:550px;}
.contactbox_header {font-size:2em; font-weight:bold; color:#D4AF37; margin:1em 0px;}
.contactcontainer {margin:0 auto; width:100%; display:block; text-align: center;}
.contact_button {margin:2em auto; text-align: center; width:100%}
.contact_button a {width:150px; text-align:center; padding:5px; margin:2em auto 0em; color:#FFFF; display:block; background-color:#000; border-radius:5px; text-transform:uppercase; font-size:1em;}
.contact_button hover {width:300px; text-align:center; padding:1em; margin:2em 0em; color:#000; display:block; background-color:#D4AF37; border-radius:3px; text-transform:uppercase; font-size:1em;}

.internal_page_body_meetme {width:100%;display:block;  box-sizing:border-box; padding:2em 5em; text-align: center;}
.meetmebio {width:80%; display:inline-block; margin:2em auto;}
.meetme_pic {float:left; width:25%; display:inline-block; margin:0 auto; text-align:center; }
.meetme_pic img {width:100%;}
.meetme_info {width:75%; display:inline-block; padding:0px 3em 2em; text-align:left;  box-sizing:border-box; float:right}
.meet_title {font-size:2em; margin:0em 0px 1em; font-weight:bold;}
.meetme_button {margin:2em auto; text-align: left; width:100%}
.meetme_button a {width:300px; text-align:center; padding:1em; margin:2em 0em; color:#FFFF; display:block; background-color:#000; border-radius:3px; text-transform:uppercase; font-size:1em;}
.meetme_button a:hover {width:300px; text-align:center; padding:1em; margin:2em 0em; color:#000; display:block; background-color:#D4AF37; border-radius:3px; text-transform:uppercase; font-size:1em;}
.erin_lucie {width:80%; text-align: center; margin:0 auto; font-size:1.25em;}
.meetme_erin {text-align: center; margin:2em 0px;}
.meetme_signature {font-size:2em; margin-bottom:2em; }
.meetme_boxes {width:40%; display: inline-block; text-align:center; border:1px solid #717171; padding:1em; box-sizing: border-box; margin:2em 1em; vertical-align: text-top;  padding:2em 0px; height:650px; padding:2em}
.meetmebox_container {margin:0 auto; display:block; text-align: center; width:100%; margin-top:2em; font-size:1.25em;}
.form_container {text-align: center; width:60%; margin:0 auto; display:block; margin-top:10px;}

.contact_container {width:100%; display:block; margin:0 auto; }
.contact_box {width:45%; display:inline-block; margin:0 2em; vertical-align: text-top;}
section {width:45%; display:inline-block; margin:0 2em; vertical-align: text-top;}	
section .contact_box {width:100%}
.iframecontainer {
  position: relative;
  overflow: hidden;
  width: 100%;
  /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.video-wrapper {
	width: 600px;
	max-width: 100%;
}
.video_welcome {width:45%;  position:relative; display:inline-block; float:left;}
.video_message_erin {width:35%;  position:relative; display:inline-block; text-align: left;  font-size:1.5em; vertical-align: top;}
.welcome_header {font-size:2em; font-family: 'Rufina Regular'; text-transform:uppercase; margin-bottom:.5em;}
.follow_button a {width:200px; text-align:center; padding:5px; margin:2em auto; color:#FFF; display:block; background-color:#000; border-radius:5px; text-transform:uppercase;}
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.contentimage_container > a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2em;
}

.contentimage_container > a > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 2px 16px var(--shadow);
}

.contentimage_container {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  grid-auto-rows: 120px;
  grid-auto-flow: dense;
}

.horizontal {
  grid-column: span 2;
}

.vertical {
  grid-row: span 2;
}

.big {
  grid-column: span 2;
  grid-row: span 2;
}