/* Reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	-webkit-margin-after: 0px;
	-webkit-margin-before: 0px;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
strong, b { font-weight: bold; }
i { font-style: italic; }
* { -webkit-margin-before: 0; -webkit-margin-after: 0; }
.clear { clear: both; }
textarea, label, input, select { cursor: pointer; }
img { width: auto; height: auto; max-width: 100%; }
sup { vertical-align: super; font-size: smaller; }

/* Content */
body { width:100%; height:100%; padding:0; font: 12px/1.4 'Open sans', 'Arial', sans-serif; background: #828888; color: #FFF; zoom: 1; }
#promo-main { width: 980px; margin: auto; text-align: center;  max-width: 100%; }
#promo-main > div { box-sizing: border-box; }
#promo-main [type="text"], #promo-main select { background: #c8c8c8; width: 100%; max-width: 100%; margin: 0 0 15px; height: 35px; padding: 0 15px; font-size: 14pt; color: #3b3f3a; font-weight: 400; border: 1px solid #e7d0c8; box-sizing: border-box; border: 0; }
#promo-main select, #two > div > p:last-of-type { margin-bottom: 0; }
#promo-main [type="submit"] { color: #FFF; font-weight: 400; transition: all 0.4s; letter-spacing: 1px; margin: 29px auto 0; display: block; font-size: 11pt; border: 0; background: #673733; line-height: 1; padding: 10px 19px; }
#promo-main [type="submit"]:hover { background: #950000; }
::-webkit-input-placeholder { color: #3b3f3a; }
:-moz-placeholder { color: #3b3f3a; opacity: 1; }
::-moz-placeholder { color: #3b3f3a; opacity: 1; }
:-ms-input-placeholder { color: #3b3f3a; }
#promo-main h1 { letter-spacing: 1px; font: 900 17pt/1.2 'Open Sans', 'Arial', sans-serif; margin: 0; max-width: 100%; display: block; color: #fff; }
#promo-main h2 { font: 900 13pt/1 'Open Sans', 'Arial', sans-serif; margin: 0; letter-spacing: 0; }

#one { background: url( '../images/bg/bg-first.jpg' ) no-repeat; height: 1000px; }
#logo-holder { padding: 49px 47px 80px 0; text-align: right; }
#one > div:last-of-type { width: 416px; padding: 0 58px 0 0; margin: 0 0 0 auto; box-sizing: border-box; max-width: 90%; text-align: center; color: #FFF; }
#one p { font-size: 20.7pt; margin: 0 0 21px; font-weight: 300; line-height: 1.3; }
#one b { font-size: 42pt; line-height: 1; margin: 0 3px 0 0; }
#promotion { font-size: 0; margin: 30px auto 28px; }
#promotion div { display: inline-block; vertical-align: top; width: 161px; border-right: 4px solid #FFF; text-align: left; }
#promotion div:last-of-type { width: 149px; font-weight: 900; font-size: 24pt; text-align: right; padding: 12px 0; border: 0; }
#promotion b { font-size: 40pt; font-weight: 900; line-height: 38px; display: block; color: #f5f08a; margin: 0 0 7px; }
#promotion span { font-size: 19pt; line-height: 1; }
#one form { width: 323px; margin: 0 5px 0 auto; max-width: 100%; }

#two { background: #e7e7e8; color: #594a42; position: relative; }
#two > div { width: 805px; max-width: 90%; margin: auto; padding: 25px 0 40px; }
#two h2 { color: #5d1712; }
#two h2:before, #two h2:after { content: ' '; position: absolute; top: 32px; left: 0; width: 270px; height: 5px; background: #5d1712; }
#two h2:after { right: 0; left: unset; }
#treatments { font-size: 0; margin: 25px 0 13px; }
[class^="treatment-"] { display: inline-block; vertical-align: top; background: url( '../images/bg/bg-hexagon.png' ) top center no-repeat; height: 152px; margin: 0 20px; position: relative; width: 202px; max-width: 100%; text-align: center; font-weight: 600; font-size: 10.5pt; color: #5d1712; padding: 65px 0; box-sizing: border-box; }
.treatment-1 { margin-left: 0; }
.treatment-2 { padding: 58px 0; }
.treatment-3 { margin-right: 0; }
#two > div > p { font-size: 11.9pt; line-height: 1.6; margin: 0 0 24px; }
#two > div > p:first-of-type { text-align: justify; }

#three { background: url( '../images/bg/bg-third.jpg' ) no-repeat; height: 572px; text-align: left; }
#three > div { width: 521px; max-width: 90%; padding: 60px 58px 50px 0; margin: 0 0 0 auto; box-sizing: border-box; }
#three h2 { color: #f5f08a; font-size: 15.5pt; }
#steps { margin: 35px 0 0; }
[class^="step-"] { background: url( '../images/bg/bg-step1.png' ) no-repeat; height: 144px; padding: 15px 0 0 196px; box-sizing: border-box; font-size: 13.2pt; text-align: justify; }
.step-2 { background-image: url( '../images/bg/bg-step2.png' ); }
.step-3 { background-image: url( '../images/bg/bg-step3.png' ); height: 131px; margin: 0; }
[class^="step-"] b { display: block; font-weight: 900; font-size: 11pt; line-height: 1; margin: 0 0 5px; color: #fff200; }

#four { background: url( '../images/bg/bg-fourth.jpg' ) no-repeat; height: 450px; text-align: left; }
#four > div { width: 625px; max-width: 90%; padding: 30px 74px 70px 0; margin: 0 0 0 auto; box-sizing: border-box; }
#four h2 { color: #663633; font-size: 16pt; }
#benefits { font-size: 0; margin: 20px 0 5px; }
#benefits div { display: inline-block; vertical-align: top; background: url( '../images/bg/bg-circle.png' ) no-repeat; width: 125px; height: 125px; color: #FFF; position: relative; text-align: center; margin: 0 7px 9px; }
#benefits p { font-size: 9.8pt; padding: 40px 20px; line-height: 1.5; }
#benefits .benefit-3 p, #benefits .benefit-6 p, #benefits .benefit-7 p { padding-top: 30px; }
#benefits .benefit-1 { margin-left: 0 }
#benefits .benefit-7 { margin-right: 0 }
#four > div > p b { font-size: 10.3pt; font-weight: 900; display: block; }
#four > div > p { font-size: 11pt; color: #663633; }

#five { background: url( '../images/bg/bg-fifth.jpg' ) no-repeat center center/cover; }
#five > div { width: 790px; max-width: 90%; padding: 35px 0 30px; margin: auto; }
#five > div:after { content: ' '; display: block; clear: both; }
#five h2 { margin: 0 0 10px; font-size: 16pt; }
#five img { float: left; }
#five img:last-of-type { float: right; }

#six { background: #e2e2e2; padding: 50px 20px 31px; color: #000; }
#six > p { font-size: 13pt; margin: 0px 0 35px; }
#six form { max-width: 625px; margin: auto; }
#six [type="text"], #six select { max-width: 322px; }
#six form p { color: #77828e; text-align: left; font-size: 8.8pt; }
#six a { text-decoration: none; color: #6a3031; border-width: 3px; }
#six form div { text-align: left; margin: 30px 0 15px; }
#six form div > label:not( .label ) { font-size: 13pt; display: inline-block; vertical-align: middle; }
.label { font-size: 13pt; display: block; margin: 0 0 11px; }
#six [type="radio"] { display: none; }
#six form label:not( .label ) { padding: 0 35px 0 16px; position: relative; }
#six form label:not( .label ):last-of-type { padding: 0 0 0 16px; }
#six form label:not( .label ):before { margin: -3px 4px 0 0; content: ' '; background: #eef0f3; text-align: center; line-height: 10px; font-size: 14pt; display: block; position: absolute; left: 0; top: 8px; width: 10px; height: 10px; border: 1px solid #653231; border-radius: 7px; }
#six [type="radio"]:checked + label:before { content: '\2022'; }
#six select { margin: 0; }
#six [type="submit"] { margin: 25px auto 0; padding: 10px 39px; }

/* Footer */
#address-block, #copyright { width: 92%; padding: 10px 4%; }
#address-block { background: #673733; }
#list { font: 13.6px/1.5em 'Open sans', 'Arial', sans-serif; text-align: center; color: #FFF; }
#list a { font-weight: bold; text-decoration: none; color: #FFF; }
#address-block hr { margin: 4px 0; background: #FFF; height: 1px; border: 0; }
#address-block li { display: inline-block; vertical-align: middle; text-transform: uppercase; margin: 0 6%; font: 8pt 'Open Sans', 'Arial', sans-serif; letter-spacing: 8px; color: #FFF; }
#address-block li.bullet { margin: 0; }
#address-block li:first-child { margin-left: 0; }
#address-block li:last-child { margin-right: 0; }

/* Last line footer */
#copyright { background: #FFF; font-size: 7pt; padding-top: 3px; position: relative; }
#copy { text-align: left; width: 670px; color: #000; }
#facebook-share { position: absolute; top: 0; right: 0; width: 260px; background: #d3d3d5; padding: 5px 0 5px 6px; font-size: 7.6pt; color: #000; text-align: left; cursor: pointer; font-weight: bold; font-family: 'Open Sans', 'Arial', sans-serif; }
#facebook-share:hover { background: #FFF; }
#facebook-share img { display: inline-block; vertical-align: middle; padding-right: 3px; }

@media (max-width: 900px) {
	#promo-main h2 { text-align: center; }

	#one { background: #988b78; height: auto; }
	#one #logo-holder { text-align: center; padding: 40px 20px 0; }
	#one > div:last-of-type { padding: 20px 0 60px; margin: auto; }
	#one form { margin: auto; }
	
	#two > div, #three > div, #four > div { padding: 40px 0; margin: auto; text-align: center; }
	[class^="treatment-"] { margin: 0 14px 20px; }

	#three { background: #3a3f39; height: auto; }

	#four { background: #e7e7e7; height: auto; }

	#prmo-main #five img { float: none; margin: 30px auto 0; display: block; }
	
	#six { padding: 40px 20px; }
	
	#facebook-share { display: block; margin: 5px auto 0 auto; position: static; width: 247px; }
	#copy { width: 100%; text-align: center; }
}

@media (max-width: 707px) {
	#one p { font-size: 13pt; }
}

@media (max-width: 580px) {
	#promotion { margin: 20px auto; }
	#promotion div, #promotion span { display: block; border: 0; text-align: center; margin: auto; }
	#promotion div:last-of-type { text-align: center; padding: 0; }

	[class^="step-"] { padding: 20px 0; background: 0; text-align: center; height: auto; }
	[class^="step-"] br { content: ' '; display: block; clear: both; }
	
	#facebook-share { float: none; margin: 10px auto; }
}

@media (max-width: 460px) {
	#address-block li { display: block; margin: 5px 0; }
	#address-block li.bullet { display: none; }
}