/*================================
 Biofreese
 biofreeze.css
 
 Last Updated By: Ryan Perry
 Last Updated: 05/24/2013
================================*/


/*================================
 Reset
================================*/
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
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, b, 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;}
/* HTML5 display-role reset for older browsers */
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;}



/*================================
 Structure
================================*/
body {font-size:100%; line-height:1.5; color:#111; font-family:Helvetica, Arial, sans-serif; background:url('../images/body-bg.jpg') repeat-x 0 0 #fff;}

div#container {width:970px; margin:0 auto; background:#fff; padding-bottom:30px}

div#debug {position:fixed; bottom:0; left:0; width:100%; text-indent:50px; background-color:#333; height:30px; z-index:90000; color:#fff; line-height:30px; border-top:1px solid #000; background-image:-o-linear-gradient(90deg , rgb(51,51,51) 0%, rgb(86,86,86) 100%); background-image:-moz-linear-gradient(90deg , rgb(51,51,51) 0%, rgb(86,86,86) 100%); background-image:-webkit-linear-gradient(90deg , rgb(51,51,51) 0%, rgb(86,86,86) 100%); background-image:-ms-linear-gradient(90deg , rgb(51,51,51) 0%, rgb(86,86,86) 100%); background-image:linear-gradient(90deg , rgb(51,51,51) 0%, rgb(86,86,86) 100%);} 

a {text-decoration:none;}
a:hover, a:active {text-decoration:underline;}


@media screen and (max-width:970px) {
div#container {width:100%;}	
}



/*================================
 Site Header
================================*/
header.site-header {width:100%; display:inline-block; vertical-align:top; position:relative; padding-top:35px; padding-bottom:4px; background:transparent url('../images/header-bg.jpg') no-repeat right bottom;}

header.site-header a.logo {display:block; cursor:pointer; text-indent:-99999em;}

nav.site {font-family:Arial, Helvetica, sans-serif;}
nav.site > ul > li > ul {display:none;}

div.header-search > label {font-size:0.688em; color:#333; font-weight:bold;}
input.header-search-input {font-family:inherit; -webkit-appearance:none;}


@media screen and (max-width:650px) {
header.site-header {padding-bottom:10px; padding-top:45px; margin-bottom:10px; background:transparent url('../images/mobile_content-divider.png') no-repeat 0 bottom;}	

header.site-header a.logo {width:190px; height:38px; margin-left:2px; background:transparent url('../images/sprites_mobile.png') no-repeat 0 0;}
	
nav.site {display:none; background:#006f51; position:absolute; top:30px; width:100%; height:auto; z-index:500;}
nav.site > ul > li {border-bottom:1px solid #bfdbd3; line-height:normal;}
nav.site > ul > li:last-child {border-bottom:none;}
nav.site > ul > li > a {color:#fff; display:block; text-transform:uppercase; padding:5px 3.125%; font-size:1.250em; font-weight:bold;}
nav.site > ul > li > a:hover, nav.site > ul > li > a:active {text-decoration:none;}

div.header-top {width:100%; height:30px; background:#9a9a9a; position:absolute; top:0; left:0;}
div.header-search {float:right; margin-top:4px; margin-right:3px;}
div.header-search > label {font-size:0.875em; color:#fff; font-weight:bold; font-family:Arial, Helvetica, sans-serif; float:left; margin-right:4px;}	
input.header-search-input {float:left; display:block; border:none; padding:0; margin-right:4px; line-height:22px; height:22px; padding:0 5px; width:155px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;}
input.header-search-button {float:left; display:block; width:20px; height:21px; text-indent:-99999em; cursor:pointer; border:none; font-size:0; line-height:0; background:transparent url('../images/sprites_mobile.png') no-repeat -31px -40px;}

a#nav-toggle {display:block; width:30px; height:22px; text-indent:-99999em; cursor:pointer; position:absolute; top:4px; left:2px; background:transparent url('../images/sprites_mobile.png') no-repeat 0 -40px;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:650px), only screen and (-moz-min-device-pixel-ratio: 2) and (max-width:650px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:650px), only screen and (min-device-pixel-ratio: 2) and (max-width:650px), only screen and (min-resolution: 2dppx) and (max-width:650px) {
header.site-header {background-size:224px 2px; background-image:url('../images/mobile_content-divider@2x.png');}
header.site-header a.logo {background-size:190px 38px; background:transparent url('../images/mobile_biofreeze-logo@2x.png') no-repeat 0 0;}
input.header-search-button {background-size:20px 21px; background:transparent url('../images/header-search@2x.png') no-repeat 0 0;}
a#nav-toggle {background-size:30px 22px; background:transparent url('../images/nav-toggle@2x.png') no-repeat 0 0;}
}

@media screen and (min-width:651px) and (max-width:850px) {
header.site-header {padding-bottom:15px; background:transparent url('../images/tablet_header-bg.png') no-repeat right bottom;}
header.site-header a.logo {width:237px; height:47px; margin-bottom:15px; margin-left:2px; background:transparent url('../images/tablet_biofreeze-logo.png') no-repeat 0 0;}

nav.site {width:93.619791666667%; margin-left:4.8828125%;}
nav.site > ul {display:inline-block; vertical-align:top; width:100%;}
nav.site > ul > li {float:left; text-transform:uppercase; margin:0 2.5% 0 0; position:relative;}
nav.site > ul > li > a {display:block; height:11px; color:#f47920; font-size:0.875em; font-weight:bold;}
nav.site > ul > li:last-child {margin-right:0;}

nav.site > ul > li ul {left:-99999em; position:absolute; background:#d4dada; border-left:1px solid #313131; z-index:100; width:auto; padding:5px; top:0;}
nav.site > ul > li > ul {top:25px;}
nav.site > ul > li > ul > li {font-size:0.688em; text-transform:none; position:relative;}
nav.site > ul > li > ul > li  a {color:#385B4F; display:block; white-space:nowrap; padding:2px 45px 2px 15px;}

nav.site a.parent {background:transparent url('../images/main-nav_arrow.png') no-repeat 90% center;}
nav.site li:hover > a.parent, nav.site li:active > a.parent {background-image:url('../images/main-nav_arrow-hover.png');}

nav.site > ul > li > ul > li a:hover, nav.site > ul > li > ul > li a:active {color:#D98043;}

nav.site > ul > li > ul > li > ul {display:none; position:absolute; background:#d4dada;}

nav.site > ul > li:hover > ul, nav.site > ul > li:active > ul {display:block; left:auto;}

nav.site > ul > li > ul > li:hover > ul {left:100%; display:block;}

div.header-search {position:absolute; top:9px; right:20px;}
input.header-search-input {border:1px solid #d3d3d3; padding:0 5px; line-height:18px; height:18px; width:142px;}

a#nav-toggle {display:none;}
}

@media screen and (min-width:651px) and (max-width:700px) {
nav.site {margin-left:3.75%;}
nav.site > ul > li {margin-right:1.75%;}	
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width:651px) and (max-width:850px) , only screen and (-moz-min-device-pixel-ratio: 2) and (min-width:651px) and (max-width:850px) , only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width:651px) and (max-width:850px), only screen and (min-device-pixel-ratio: 2) and (min-width:651px) and (max-width:850px) , only screen and (min-resolution: 2dppx) and (min-width:651px) and (max-width:850px)  {
header.site-header {background-size: 515px 3px; background-image:url('../images/tablet_header-bg@2x.png');}
header.site-header a.logo {background-size:237px 47px; background:transparent url('../images/tablet_biofreeze-logo@2x.png') no-repeat 0 0;}
}

@media screen and (min-width:851px) {
header.site-header {position:relative; z-index:500;}
header.site-header a.logo {width:290px; height:58px; margin-right:8px; float:left; background:transparent url('../images/sprites_desktop.png') no-repeat 0 0;}	

nav.site {float:left; margin-top:35px; width:64%;}
nav.site > ul {display:inline-block; vertical-align:top; width:100%;}
nav.site > ul > li {float:left; text-transform:uppercase; margin:0 2.474226804124% 0 0; height:25px; position:relative;}
nav.site > ul > li > a {display:block; height:25px; cursor:pointer; text-indent:-99999em; background:transparent url('../images/sprites_desktop.png') no-repeat 0 0;}

nav.site > ul > li:first-child > a {width:61px; background-position:-204px -60px;}
nav.site > ul > li:nth-child(2) > a {width:59px; background-position:0 -87px;}
nav.site > ul > li:nth-child(3) > a {width:63px; background-position:-75px -60px;}
nav.site > ul > li:nth-child(4) > a {width:32px; background-position:0 -157px;}
nav.site > ul > li:nth-child(5) > a {width:62px; background-position:-140px -60px;}
nav.site > ul > li:nth-child(6) > a {width:56px; background-position:-61px -87px;}
nav.site > ul > li:last-child > a {width:73px; background-position:0 -60px;}

nav.site > ul > li ul {left:-99999em; position:absolute; background:#d4dada; border-left:1px solid #313131; z-index:100; width:auto; padding:5px 0; top:0;}
nav.site > ul > li > ul {top:25px;}
nav.site > ul > li > ul > li {font-size:0.688em; text-transform:none; position:relative;}
nav.site > ul > li > ul > li  a {color:#385B4F; display:block; white-space:nowrap; padding:2px 45px 2px 15px;}

nav.site a.parent {background:transparent url('../images/main-nav_arrow.png') no-repeat 90% center;}
nav.site li:hover > a.parent, nav.site li:active > a.parent {background-image:url('../images/main-nav_arrow-hover.png');}

nav.site > ul > li > ul > li a:hover, nav.site > ul > li > ul > li a:active {color:#D98043;}

nav.site > ul > li > ul > li > ul {display:none; position:absolute; background:#d4dada;}

nav.site > ul > li:hover > ul, nav.site > ul > li:active > ul {display:block; left:auto;}

nav.site > ul > li > ul > li:hover > ul {left:100%; display:block;}
nav.site > ul > li > ul >  li> ul > li:hover > ul {left:100%; display:block;}

div.header-search {position:absolute; top:9px; right:20px;}
input.header-search-input {border:1px solid #d3d3d3; padding:0 5px; line-height:18px; height:18px; width:142px;}

a#nav-toggle {display:none;}
}

.lt-ie9 nav.site > ul > li:first-child > a {width:61px; background-position:-204px -60px;}
.lt-ie9 nav.site > ul > li:nth-child(2) > a {width:59px; background-position:0 -87px;}
.lt-ie9 nav.site > ul > li:nth-child(3) > a {width:63px; background-position:-75px -60px;}
.lt-ie9 nav.site > ul > li:nth-child(4) > a {width:32px; background-position:0 -157px;}
.lt-ie9 nav.site > ul > li:nth-child(5) > a {width:62px; background-position:-140px -60px;}
.lt-ie9 nav.site > ul > li:nth-child(6) > a {width:56px; background-position:-61px -87px;}
.lt-ie9 nav.site > ul > li:last-child > a {width:73px; background-position:0 -60px;}



/*================================
 Content
================================*/
section#main {padding-top:15px; display:inline-block; width:100%; vertical-align:top;}

section#content {padding-top:35px}
h1 {font-size:3.438em; line-height:normal; font-weight:bold; color:#046e50; margin:0 0 25px 0; text-transform:uppercase; letter-spacing:-1.5px;}
h2 {color:#007836; font-weight:bold; font-size:1.250em;}
article p {color:#9a9a9a;}
article em {color:#f47920; font-style:normal;}
p {margin:0 0 20px 0;}

div.social-sharing span.vhidden {display:block; text-indent:-99999em;}

ul.form {}
ul.form > li {display:inline-block; width:100%; vertical-align:top; margin-bottom:15px;}
ul.form label {color:#9a9a9a; display:block; font-weight:bold;}
ul.form .text {padding:0; display:block; border:none; background:url('../images/input-bg.png') repeat-x 0 0 #fff; border:1px solid #acacac; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; font-family:inherit;}
ul.form select {background-image:url('../images/input-bg.png'); background-repeat:repeat-x; background-position:0 0; border:1px solid #acacac; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;}
ul.form .error {border:1px solid #ef7778; background:url('../images/error-bg.png') repeat-x 0 0 #fff;}
ul.form p.error {border:inherit; background:inherit;}

ul.form span.checkbox {width:100%; display:inline-block; vertical-align:top;}
ul.form span.checkbox input {float:left; margin-right:5px;}
ul.form span.checkbox label {float:left; width:90%; font-weight:normal;}

div.content-divider {width:100%; height:3px;}

div.form-section p {color:#9a9a9a; clear:both; font-weight:bold;}
div.form-section p.error {color:#e62e2f;}

a.orange-button, div.orange-button {display:inline-block; line-height:83px; height:83px; text-align:center; margin:0 0 20px 0; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; background-color:#f47b20; background-image:-webkit-linear-gradient(bottom, #f47920, #ffc21d); background-image:-moz-linear-gradient(bottom, #f47920, #ffc21d); background-image:-o-linear-gradient(bottom, #f47920, #ffc21d); background-image:-ms-linear-gradient(bottom, #f47920, #ffc21d); background-image:linear-gradient(to top, #f47920, #ffc21d);}
a.orange-button > span, div.orange-button span {display:block; color:#fff; text-transform:uppercase; font-size:2em; font-weight:bold; line-height:83px; padding:0 15px; background:transparent url('../images/get-sample-overlay.png') no-repeat 0 0;}

a.orange-button:hover, a.orange-button:active, div.orange-button {text-decoration:none; background-color:#ffc21d; background-image:-webkit-linear-gradient(top, #f47920, #ffc21d); background-image:-moz-linear-gradient(top, #f47920, #ffc21d); background-image:-o-linear-gradient(top, #f47920, #ffc21d); background-image:-ms-linear-gradient(top, #f47920, #ffc21d); background-image:linear-gradient(to bottom, #f47920, #ffc21d);}


@media screen and (max-width:650px) {
section#main {margin-bottom:10px;}	
h1 {font-size:1.375em; margin-bottom:20px; width:48%;}
section#content {width:100%; position:relative; padding-top:0;}
aside {display:none;}
article {width:93.75%; margin-left:auto; margin-right:auto;}
article p {font-size:0.875em;}

img.small-sample-image {position:relative; float:right; margin:-60px -3.125% 3px 0; display:block; max-width:100%; height:auto;}

div.content-divider-reverse {background:transparent url('../images/mobile_h1-divider.png') no-repeat right 0; width:103.125%; height:3px; position:relative; margin:0 -3.125% 10px 0; clear:both;}
div.content-divider {background:transparent url('../images/mobile_content-divider.png') no-repeat 0 0;}
div.content-divider.top-divider {display:none;}

div.form-section {width:93.75%; margin-left:auto; margin-right:auto;}
div.form-section:last-child {padding-top:15px;}
div.form-section p {font-size:0.688em;}

div.social-sharing {display:none;}

ul.form > li {margin-bottom:12px;}
ul.form label {font-size:0.938em;}
ul.form .text {width:96.333333333333%; line-height:22px; height:22px; padding:0 1.666666666667%;}
ul.form select {width:100%;}

ul.form span.checkbox label {font-size:0.813em;}

a.orange-button, div.orange-button {width:100%; height:65px; line-height:65px;}
a.orange-button > span, div.orange-button > span {line-height:65px; height:65px; font-size:1.563em;}

.thanks {padding-top:20px;}
.thanks p.note {font-weight:normal; text-align:left;}
.thanks a.orange-button > span {font-size:1em;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:650px), only screen and (-moz-min-device-pixel-ratio: 2) and (max-width:650px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:650px), only screen and (min-device-pixel-ratio: 2) and (max-width:650px), only screen and (min-resolution: 2dppx) and (max-width:650px) {
div.content-divider-reverse {background-size:224px 2px; background-image:url('../images/mobile_h1-divider@2x.png');} 
div.content-divider {background-size:224px 2px; background-image:url('../images/mobile_content-divider@2x.png');}
}


@media screen and (min-width:651px) and (max-width:800px) {
section#main {margin-bottom:45px;}
h1 {font-size:2.813em;}
section#content {float:left; width:62.239583333333%;}
aside {width:36.588541666667%; float:right; color:#555;}

aside > h2 {width:92.696629213483%;}
aside > p {width:92.696629213483%;}

img.small-sample-image {display:none;}
img.sample-image-top {margin-left:-5.154639175258%; position:relative; display:block; width:100%; height:auto;}
img.sample-image-bottom {display:block; float:right; width:100%; height:auto;}

article {padding:0 0 0 7.845188284519%; width:75.732217573222%;}
article p {font-size:1em;}

div.content-divider {background:transparent url('../images/content-divider.png') no-repeat 0 0;}

div.form-section {padding:15px 0 0 7.845188284519%; width:75.732217573222%;}
div.form-section p {font-size:0.750em;}
p.note {text-align:right;}

div.social-sharing {width:110.416666666667%; position:relative; margin-right:10.416666666667%; height:34px;}
div.social-sharing ul {display:inline-block;}
div.social-sharing li {float:left;}
div.social-sharing li.twitter {width:90px;}
div.social-sharing li.pinterest {width:80px;}

ul.form li > label {float:left; width:33.149171270718%; margin-right:2.762430939227%; font-size:0.938em;}
ul.form .text {float:left; width:57.458563535912%; line-height:22px; height:22px; padding:0 2.762430939227%; font-size:0.938em;}
ul.form select {width:64%;}

a.orange-button, div.orange-button {float:right; line-height:65px; height:65px;}
a.orange-button > span, div.orange-button > span {font-size:1.250em; line-height:65px; height:65px;}

div.form-about ul.form  li > label {float:none; width:100%; margin-right:0;}
div.form-about ul.form select {width:100%;}

.thanks {padding-top:20px;}
.thanks a.orange-button {height:55px; line-height:55px;}
.thanks a.orange-button > span {font-size:1em; line-height:55px; height:55px;}
.thanks p.note {font-size:1em; font-weight:normal; text-align:left;}
}

@media screen and (min-width:801px) and (max-width:970px) {
section#main {margin-bottom:45px;}	
section#content {float:left; width:62.164948453608%;}
aside {float:right; width:36.701030927835%; position:relative; color:#555;}	

h1 {width:100%; line-height:normal;}

aside > h2 {width:92.696629213483%;}
aside > p {width:92.696629213483%;}

img.small-sample-image {display:none;}
img.sample-image-top {margin-left:-5.154639175258%; position:relative; display:block; width:100%; height:auto;}
img.sample-image-bottom {display:block; float:right; width:100%; height:auto;}

article {wiidth:49.484536082474%; padding:0 8.041237113402% 0 4.639175257732%;}
article p {font-size:1.250em; font-weight:bold;}

div.content-divider {background:transparent url('../images/content-divider.png') no-repeat 0 0;}

div.form-section {/*padding:25px 16.583747927032% 0 7.462686567164%;*/ padding:25px 0 0 7.462686567164%; width:75.953565505804%;}
div.form-section p {font-size:0.750em;}
p.note {text-align:right;}

div.social-sharing {width:110.416666666667%; position:relative; margin-right:10.416666666667%; height:34px;}
div.social-sharing ul {display:inline-block;}
div.social-sharing li {float:left;}
div.social-sharing li.pinterest {width:90px;}

ul.form li {}
ul.form li > label {float:left; width:33.842794759825%; margin-right:2.183406113537%; font-size:0.938em;}
ul.form .text {width:58.951965065502%; padding:0 2.183406113537%; line-height:28px; height:28px; font-size:0.938em;}
ul.form select {width:63.755458515284%}

a.orange-button, div.orange-button {float:right;}

div.form-about ul.form  li > label {float:none; width:100%; margin-right:0;}
div.form-about ul.form select {width:100%;}

ul.form span.checkbox label {font-size:0.750em;}

.thanks {padding-top:20px;}
.thanks .orange-button > span {font-size:1.250em;}
.thanks p.note {font-size:1em; font-weight:normal; text-align:left;}
}

@media screen and (min-width:971px) {
section#main {margin-bottom:45px;}
section#content {float:left; width:603px;}
aside {float:right; width:356px; position:relative; color:#555;}

h1 {width:456px; line-height:normal;}

aside > h2 {width:330px;}
aside > p {width:330px;}	

img.small-sample-image {display:none;}
img.sample-image-top {margin-left:-50px; position:relative; display:block;}
img.sample-image-bottom {display:block; float:right; width:100%; height:auto;}

article {width:480px; padding:0 78px 0 45px;}
article p {font-size:1.250em; font-weight:bold;}

div.content-divider {background:transparent url('../images/content-divider.png') no-repeat 0 0;}

div.form-section { padding:25px 0 0 45px; width:458px;}
div.form-section p {font-size:0.750em;}
p.note {text-align:right;}

div.social-sharing {width:110.416666666667%; position:relative; margin-right:10.416666666667%; height:34px;}
div.social-sharing ul {display:inline-block;}
div.social-sharing li {float:left;}
div.social-sharing li.pinterest {width:90px;}

ul.form li {}
ul.form li > label {width:155px; margin-right:10px; float:left;}
ul.form .text {width:270px; line-height:28px; height:28px; padding:0 10px;}
ul.form select {width:292px;}

a.orange-button, div.orange-button {float:right;}

div.form-about ul.form li > label {float:none; width:100%; margin-right:0;}
div.form-about ul.form select {width:100%;}

ul.form span.checkbox label {font-size:0.750em;}

.thanks {padding-top:20px;}
.thanks .orange-button > span {font-size:1.563em;}
.thanks p.note {font-size:1em; font-weight:normal; text-align:left;}
}



/*================================
 Site Footer
================================*/
footer.site-footer {width:100%; display:inline-block; vertical-align:top; font-family:Arial, Helvetica, sans-serif;}

nav.footer-nav ul {display:inline-block; width:100%;}
nav.footer-nav li {float:left; border-left:1px solid #6c6c6c; line-height:1.2;}
nav.footer-nav li:first-child {border-left:none; padding-left:0;}
nav.footer-nav li:last-child {margin-right:0;}
nav.footer-nav a {color:#111;}


@media screen and (max-width:600px) {
footer.site-footer p {width:93.75%; margin-left:auto; margin-right:auto; font-size:0.750em;} 	
nav.footer-nav {width:93.75%; margin-left:auto; margin-right:auto; font-size:0.875em;}
nav.footer-nav li {border-left:1px solid #111; margin-right:2.333333333333%; padding-left:2.333333333333%; margin-bottom:8px;}
}

@media screen and (min-width:601px) and (max-width:800px) {
footer.site-footer {width:87.389659520807%; padding:0 4.8828125%;}	

footer.site-footer p {font-size:0.750em;}

nav.footer-nav {font-size:0.875em;}
nav.footer-nav li {border-left:1px solid #111; margin-right:1.010101010101%; padding-left:1.010101010101%; margin-bottom:8px;}
}

@media screen and (min-width:801px) {
footer.site-footer {font-size:0.688em; padding:0 2.061855670103%; width:95.876288659794%;}	

p.footer-legal {width:62.903225806452%; margin-bottom:10px;}
p.footer-copyright {float:left;}

nav.footer-nav {float:right;}

nav.footer-nav li {margin-right:4px; padding-left:4px;}
}