@charset "utf-8";

/*---------------------------------------------------------------------------------------------------------------------------*/
/* 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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td{
margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus{ outline:0; }
body{ line-height:1; color:black; background:white; }
ol, ul{ list-style:none; }
table{ border-collapse:separate; border-spacing:0; }
caption, th, td{ text-align:left; font-weight:normal; }
blockquote:before, blockquote:after, q:before, q:after{	content: ""; }
blockquote, q{ quotes: "" ""; }

/*---------------------------------------------------------------------------------------------------------------------------*/
/* tags */
/*---------------------------------------------------------------------------------------------------------------------------*/
body{ color:#8b5708; font:normal .8em/1.5em Arial, Helvetica, Verdana, sans-serif; background:#241000 url(../images/bg.gif) repeat-x; }
strong{ font-weight:bold; }
a{ color:#8d5e19; text-decoration:none; }
h1{ padding:0 0 15px 0; font:2.9em/1em Georgia, "Times New Roman", Times, serif; color:#552700; }
h2{ padding:0 0 5px 0; font:3em/1em Arial, Helvetica, sans-serif; color:#af751f; text-transform:uppercase; }
h3{ padding:0 0 30px 0; font:2.5em/1em Georgia, "Times New Roman", Times, serif; color:#552700; }
h4{ padding:0 0 8px 0; font:1.6em/1em Georgia, "Times New Roman", Times, serif; color:#552700; }
h5{ padding:0 0 8px 0; font:1.3em/1em Georgia, "Times New Roman", Times, serif; color:#552700; }
sup{ position:relative; top:-5px; font-size:.8em; }
sup.sq{ position:relative; top:-12px; }
sup.sq-sm{ position:relative; font-size:.7em; top:-6px; }

/*---------------------------------------------------------------------------------------------------------------------------*/
/* shared classes */
/*---------------------------------------------------------------------------------------------------------------------------*/
.clear{ clear:both; line-height:0; }
.underline{ text-decoration:underline; }
.underline:hover{ text-decoration:none; }
/*---------------------------------------------------------------------------------------------------------------------------*/
/* wrappers */
/*---------------------------------------------------------------------------------------------------------------------------*/
.wrapper{ position:relative; margin:0 auto; width:950px; }
/*.wrapper .top-lang{ float:right; padding:2px 6px; font-size:.8em; color:#fde7b5; text-transform:uppercase; }
.inner-wrapper{ clear:both; position:relative; width:950px; }*/

/*---------------------------------------------------------------------------------------------------------------------------*/
/* header */
/*---------------------------------------------------------------------------------------------------------------------------*/
.header{ position:relative; z-index:1; height:108px; background:#532500 url(../images/bg-header.gif) top right no-repeat; }
.header .logo{ float:left; margin:20px 0 0 24px; width:149px; height:77px; background:url(../images/logo-header.gif) no-repeat; text-indent:-9999px; }
/*#landing .header .right-graphic,
#facts .header .right-graphic{ display:block; position:absolute; right:-20px; top:12px; z-index:2; width:218px; height:191px; background:url(../images/header-flower.png); }*/
#landing .header .right-graphic,
#facts .header .right-graphic{ display:block; position:absolute; right:20px; top:0px; z-index:2; width:134px; height:117px; background:url(../images/header-flower.png); }
#general .header .right-graphic,
#spf .header .right-graphic,
#sport .header .right-graphic,
#kids .header .right-graphic,
#after .header .right-graphic
{ display:block; position:absolute; right:0; top:0px; z-index:2; width:242px; height:120px; background:url(../images/header-girl.png); }

/*---------------------------------------------------------------------------------------------------------------------------*/
/* navigation */
/*---------------------------------------------------------------------------------------------------------------------------*/
.nav-wrapper{ float:left; height:60px; background:#fde7b5; border-bottom:1px solid #efd396; }
.nav-wrapper ul{ width:950px; height:33px; background:url(../images/bg-nav.gif) repeat-y; }
.nav-wrapper ul li{ float:left; display:inline; }
.nav-wrapper ul li:first-child{ padding-left:12px; }
.nav-wrapper ul li a{ display:block; float:left; height:33px; font-size:.9em; font-weight:bold; color:#fde7b5; text-transform:uppercase; }
.nav-wrapper ul li a:hover{ color:#572700; cursor:pointer; }
.nav-wrapper ul li .nav-tab-l{ float:left; display:block; width:12px; height:33px; }
.nav-wrapper ul li .nav-tab-m{ display:block; float:left; padding-top:10px; height:23px; }
.nav-wrapper ul li .nav-tab-r{ float:left; display:block; width:12px; height:33px; }
#general a.nav-general,
#spf a.nav-spf,
#sport a.nav-sport,
#kids a.nav-kids,
#after a.nav-after,
#facts a.nav-facts,
#contest a.nav-contest{ color:#572700; }
#general a.nav-general .nav-tab-l,
#spf a.nav-spf .nav-tab-l,
#sport a.nav-sport .nav-tab-l,
#kids a.nav-kids .nav-tab-l,
#after a.nav-after .nav-tab-l,
#facts a.nav-facts .nav-tab-l,
#contest a.nav-contest .nav-tab-l{ float:left; display:block; width:12px; height:33px; background:url(../images/nav-tab-l.png); }
#general a.nav-general .nav-tab-m,
#spf a.nav-spf .nav-tab-m,
#sport a.nav-sport .nav-tab-m,
#kids a.nav-kids .nav-tab-m,
#after a.nav-after .nav-tab-m,
#facts a.nav-facts .nav-tab-m,
#contest a.nav-contest .nav-tab-m{ display:block; float:left; padding-top:10px; height:23px; background:red; background:url(../images/nav-tab-m.png); }
#general a.nav-general .nav-tab-r,
#spf a.nav-spf .nav-tab-r,
#sport a.nav-sport .nav-tab-r,
#kids a.nav-kids .nav-tab-r,
#after a.nav-after .nav-tab-r,
#facts a.nav-facts .nav-tab-r,
#contest a.nav-contest .nav-tab-r{ float:left; display:block; width:12px; height:33px; background:url(../images/nav-tab-r.png); }
.nav-wrapper ul li.french-wrapper{ position:relative; width:238px; height:33px; }
.nav-wrapper ul li a.nav-french{ position:absolute; right:24px; top:10px; height:23px; text-transform:capitalize; }


/*---------------------------------------------------------------------------------------------------------------------------*/
/* bottom boxes */
/*---------------------------------------------------------------------------------------------------------------------------*/

.lower-boxes{ clear:both; width:950px; height:112px; background:#FFF0CD url(../images/bg-footer-boxes.gif) repeat-x; }
.lower-boxes .box1, .lower-boxes .box3{ float:left; padding:15px 10px 15px 15px; width:290px; height:82px; /*width:315px; height:112px;*/ overflow:hidden; }
.lower-boxes .box2{ float:left; padding:15px 0 15px 15px; width:305px; height:82px; /*width:319px; height:112px;*/ overflow:hidden; }
.lower-boxes .box1, .lower-boxes .box2{ background:url(../images/footer-divider.gif) top right no-repeat; }
.lower-boxes .box-thumb{ float:left; margin:0 8px 0 0; }
.lower-boxes p{ margin:0 0 8px 0; padding-right:10px; font-size:.9em; line-height:1.4em; color:#552700; }
.lower-boxes p.contest{ font-size:1.3em; }
.lower-boxes a{ color:#EA4C10; font-size:1em; line-height:1em; font-weight:bold; }


/*---------------------------------------------------------------------------------------------------------------------------*/
/* footer */
/*---------------------------------------------------------------------------------------------------------------------------*/
.footer{ clear:both; padding:0 0 20px 0; color:#8d5e19; font-size:.8em; line-height:1em; font-weight:bold;  }
.footer .strip{ clear:both; width:950px; height:30px; background:#DAA732 url(../images/bg-footer-strip.gif) repeat-y; }
.footer-nav{ clear:both; float:left; margin:12px 0 0 0; }
.footer-nav li{ float:left; margin:0 10px 0 0; }
.footer .copyright{ float:right; margin:12px 0 0 0; }
.footer .flag{ position:relative; top:-2px; }

/*---------------------------------------------------------------------------------------------------------------------------*/
/* shared between pages */
/*---------------------------------------------------------------------------------------------------------------------------*/
.content-area{ padding:0 0 20px 0; background:#ffdd8f; }
.content-area .col1{ float:left; padding:24px 40px 0 55px; width:667px; }
.content-area .col1 p{ padding:0 0 0 0; }
.content-area .col2{ float:right; padding:30px 23px 0 0; width:165px; }
.content-area .full-width{ float:left; padding:24px 23px 0 55px; width:872px; }
.product-container{ margin:45px 0 0 0; background:#ffdd8f; display:none; }
.product-container img{ float:left; margin:0 37px 0 0; }
.product-container ul{ float:left; padding:0 0 0 15px; list-style:disc outside; width:410px; }
.product-container p{ margin:0 0 8px 0; }
.product-container a{ color:#EA4C10; font-size:1em; line-height:1em; font-weight:bold; }
.product-thumb-container{ float:left; clear:both; margin:0 0 26px 0; width:165px; height:83px; line-height:1.3em; }
.product-thumb-container .thumb{ float:left; margin:0 20px 0 0; }
.gel{ position:relative; top:-40px; }


/*---------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------------------*/
/* page specific */
/*---------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------------------------------------*/
/* landing page */
/*---------------------------------------------------------------------------------------------------------------------------*/
#flash-landing{ float:left; clear:both; }
#flash-landing p{ width:950px; }

/*---------------------------------------------------------------------------------------------------------------------------*/
/* sun facts */
/*---------------------------------------------------------------------------------------------------------------------------*/
#facts .content-area{ padding:0 0 20px 30px; min-height:462px; color:#fff1d0; font-size:1.1em; background:#3f1c00 url(../images/bg-sun-facts.jpg) no-repeat; }
#facts h1{ float:left; padding:40px 0 20px 0; color:#fff1d0; }
#facts .content-area p, #facts .content-area ul, #facts .content-area ul li{ float:left; clear:both; padding:0 0 20px 0; line-height:1.4em; width:650px; }
#facts .content-area p, #facts .content-area ul{ font-size:.9em; }
#facts .content-area ul{ list-style:none inside; width:420px; }
#facts .girl-sitting{ display:block; width:383px; height:380px; position:absolute; bottom:200px; right:6px; background:url(../images/bg-girl-sitting.png) no-repeat; }
#facts table{ float:left; clear:both; margin:0 0 20px 0; width:475px; font-size:.8em; font-weight:bold; line-height:1.2em; }
#facts table caption{ display:none; }
#facts table tr{ height:33px; vertical-align:middle; }
#facts table tr td{ vertical-align:middle; }
#facts table thead{ color:#fff; background:#3e1f0d url(../images/bg-table-header.gif) repeat-x; }
#facts table thead tr th{ vertical-align:middle; font-weight:bold; }
#facts table thead tr th.rec-spf{ text-align:center; }
#facts table .skin-com{ text-align:center; }
#facts table .rec-spf{ width:130px; text-align:center; }
#facts .row1{ color:#783e1c; background:#ffde97; }
#facts .row2{ color:#783e1c; background:#ffd05f; }
#facts .row3{ color:#783e1c; background:#f3b82b; }
#facts .row4{ color:#fff; background:#b3761b; }
#facts p.chart-legal{ width:447px; font-size:.8em; line-height:1.1em; }


/*---------------------------------------------------------------------------------------------------------------------------*/
/* contact-us */
/*---------------------------------------------------------------------------------------------------------------------------*/
#contact-us iframe{ margin:24px 0 0 50px; }


/*---------------------------------------------------------------------------------------------------------------------------*/
/* press */
/*---------------------------------------------------------------------------------------------------------------------------*/
#press .content-area{ padding:0 0 20px 30px; min-height:462px; color:#8B5708; font-size:1em; background:#FFDD8F; /*background:#3f1c00 url(../images/bg-sun-facts.jpg) no-repeat;*/ }
#press a{ font-weight:bold; }
#press h1{ float:left; clear:both; padding:40px 0 20px 0; width:900px; font-size:2.1em; color:#552700;/* color:#fff1d0;*/ }
#press h2{ float:left; clear:both; padding:0 0 20px 0; width:900px; font-size:1.7em; color:#552700; text-transform:none; }
#press h3{ float:left; clear:both; padding:0 0 6px 0; width:900px; font-size:1.2em; font-weight:bold; color:#8B5708; }
#press .content-area p, #press .content-area ul, #press .content-area ul li{ float:left; clear:both; padding:0 20px 20px 0; width:900px; line-height:1.4em; }
#press .content-area ul{ clear:both; float:left; margin:8px 0 8px 20px; list-style:outside disc; }
#press sup{ position:relative; top:-8px; font-size:.6em; }


/*---------------------------------------------------------------------------------------------------------------------------*/
/* contest */
/*---------------------------------------------------------------------------------------------------------------------------*/
#contest .content-area{ background:#FFDD8F url(../images/bg-shopping-lady.jpg) 640px 170px no-repeat; }
#contest .content-area h1 sup{ position:relative; top:-16px; font-size:.3em; }
#contest .content-area p, #contest .content-area ul{ float:left; clear:both; padding:0 20px 20px 0;  line-height:1.4em; }
#contest .content-area ul li{ float:left; clear:both; margin:0 0 8px 0; width:774px; height:auto; }
#contest .content-area fieldset{ clear:both; float:left; }
#contest .content-area .astriks{ color:#EA4C10; }
/* default label */
#contest label{ float:left; padding:3px 4px 1px 0; width:125px; font-size:.9em; }
/* default text field and text area */
#contest input, #contest textarea{ float:left; padding:1px 2px; margin:0 8px 0 0; width:270px; height:18px; font:normal .9em/1.5em Arial, Helvetica, sans-serif; border:1px solid #552700; }
/* default select field */
#contest select{ float:left; margin:0 6px 0 0; height:22px; font:normal .9em/1em Arial, Helvetica, sans-serif; border:1px solid #552700; }
/* labels */
#contest label.lbl-sm{ width:100px; }
#contest label.lbl-age{ margin-left:170px; }
/* select fields */
#contest .sel-prov{ width:180px; }
#contest .sel-age, #contest .sel-lang{ width:120px; }
#contest span.age{ font-size:.8em; }
/* opt in */
#contest .chk{ margin:4px 8px 0 0; width:12px; height:12px; border:0; }
#contest .chk-lbl{ position:relative; width:530px; }
/* buttons/loader */
#contest .controls{ position:relative; }
#contest .controls .loader{ display:none; position:absolute; top:2px; left:90px; }
#contest .button{ float:left; padding:4px 10px; margin:0 20px 0 0; height:auto; color:#EA4C10; cursor:pointer; border:1px solid #552700; }
#contest .btn-submit{ margin-left:129px; }
/* validation */
#contest input.error, #contest textarea.error, #contest select.error{ background:#FDE7B5; border:1px solid #EA4C10; font-weight:bold; }
#contest .error-wrapper{ display:none; clear:both; margin:0 87px 0 50px; padding:10px; color:#EA4C10; width:646px; background:#FDE7B5; border:1px solid #552700;  }
#contest .error-wrapper span{ float:left; clear:both; margin:0 0 20px 0; width:640px; }
#contest .error-wrapper label.error, #contest .error-wrapper p{ clear:both; float:left; width:640px; text-align:left; }
#contest .thankyou-wrapper{ display:none; clear:both; float:left; width:900px; }
#contest .thankyou-wrapper{ display:none; clear:both; float:left; }
/* legal */
#contest p.legal{ width:510px; }
#contest p.legal-sm{ padding-bottom:3px; width:510px; font-size:.8em; }
#contest p.legal-sm sup{ top:-2px; }