/**
 * Skin advisor - Landing page
**/
#questionsContent {display:none;}
#noJS p 
{  
	font-size: 12px;
	margin: 15px 5px;
}
#skin-advisor-step1, #skin-advisor-step2
{
    color:#3b3b3b;
    background:transparent url(../../images/skin-advisor/background-skin-advisor.jpg) no-repeat scroll 0 0;
    height:617px;
    margin:15px 0 0 34px;
    padding:0 0 15px 10px;
    width:925px;
}
#skin-advisor-step1 #left-content, #skin-advisor-step2 #left-content
{
    width:932px;
    height:617px;
}
#skin-advisor-step1 #left-content #title, #skin-advisor-step2 #left-content #title
{
    padding:20px 0 0 0;
    width:495px;
}
#skin-advisor-step1 #left-content #title h1, #skin-advisor-step2 #left-content #title h1, #noJS h1
{
    background:transparent url(../../images/skin-advisor/skin-advisor-title.jpg) no-repeat scroll 0 0;
    height:45px;
    margin:0 0 6px;
    width:405px;
}
#skin-advisor-step1 #left-content #title p, #skin-advisor-step2 #left-content #title p
{
    font-size:15px;
    margin:0 0 0 4px;
    line-height:21px;
}
#skin-advisor-step1 #left-content ul, #skin-advisor-step2 #left-content ul
{
    padding:13px 0 15px;
    width:518px;
    margin:0;
}
#skin-advisor-step1 #left-content ul li, #skin-advisor-step2 #left-content ul li
{
    list-style:none;
    border-top:1px solid #dfdfdf;
    clear:both;
    padding:13px 0 0 3px;
    margin:0;
}
li.seasons{display:none;}

#skin-advisor-step1 #left-content ul li h2, #skin-advisor-step2 #left-content ul li h2
{
    color:#5d5d5d;
    font:normal 19px Georgia;
    padding:0 0 6px;
    margin:0;
}
#skin-advisor-step1 #left-content ul li h2 span, #skin-advisor-step2 #left-content ul li h2 span
{
    font:italic normal 14px Arial;
}
#skin-advisor-step1 #left-content ul li label, #skin-advisor-step2 #left-content ul li label
{
    font:normal 15px Arial;
    margin:0 0 0 5px;
    float:left;
    height:19px;
}
#skin-advisor-step1 #left-content ul li ul
{
    overflow:hidden;
    padding:0 0 18px;
    margin:0;
    width:auto;
}
#skin-advisor-step1 #left-content ul li ul li, #skin-advisor-step2 #left-content ul li ul li
{
    overflow:hidden;
    border:none;
    clear:none;
    float:left;
    margin:0 32px 0 4px;
    padding:0; 
}
#skin-advisor-step1 #left-content ul li ul li input, #skin-advisor-step2 #left-content ul li ul li input
{
    float:left;
    height:19px;
}

label.r_off, label.c_off {
	background:url(../../images/skin-advisor/radio.gif) no-repeat;
}

label.r_on, label.c_on {
	background:url(../../images/skin-advisor/radio_on.gif) no-repeat;
}

#skin-advisor-step1 #left-content label.label_radio, 
#skin-advisor-step1 #left-content label.label_check,
#skin-advisor-step2 #left-content label.label_radio, 
#skin-advisor-step2 #left-content label.label_check{
	float:left;
	padding:3px 0 4px 27px;
	line-height:24px;
}

label.label_radio input, label.label_check input {
	left:-9000px;
	position:absolute;
	z-index:1;
}
#skin-advisor-step1 #left-content ul li.solutions
{
    padding:13px 0 2px 3px;
    width:480px;
}
#skin-advisor-step1 #left-content ul li.skinType{
    width:454px;
}
#skin-advisor-step1 #left-content ul li.seasons{
    width:489px;
}
#skin-advisor-step1 #left-content ul li.seasons h2
{
    padding:0 0 10px;
    line-height:20px;
}
#skin-advisor-step1 #left-content ul li.seasons ul, #skin-advisor-step2 #left-content ul li.seasons ul
{
    margin:0;
    padding:0;
}
#skin-advisor-step1 #left-content ul li.seasons ul li, #skin-advisor-step2 #left-content ul li.seasons ul li
{
    padding:0 32px 7px 4px;
    clear:both;
    width:350px;
    margin:0;
}
* html #skin-advisor-step1 #left-content ul li.seasons ul li, * html #skin-advisor-step2 #left-content ul li.seasons ul li
{
	padding:0 32px 1px 4px;
}
/* Form Progress */
#skin-advisor-step1 #left-content #form-progress
{    
    height:50px;
    padding:0;
    margin:0 0 0 -17px;
    width:932px;
    position:absolute;
    bottom:15px;
}
#skin-advisor-step1 #left-content #form-progress a, #skin-advisor-step2 #left-content #form-progress a, #form-progress-1-2
{
    background:transparent url(../../images/buttons/next-btn.gif) no-repeat scroll 0 0;
    float:left;
    font-size:0;
    text-indent:-9999px;
    width:282px;
    height:50px;
}
#form-progress-1-2 {
	background:transparent url(../../images/skin-advisor/page1-2.png) no-repeat scroll right center;
	width: 650px;
}
#skin-advisor-step1 #left-content #form-progress a:hover, #skin-advisor-step2 #left-content #form-progress a:hover
{
    background:transparent url(../../images/buttons/next-btn.gif) no-repeat scroll 0 -50px;
}
/* What Is Dry? */
#skin-advisor-step1 #what-is-dry
{
    background:transparent url(../../images/skin-advisor/what-is-dry.png) no-repeat scroll 0 0;
    float:left;
    height:100px;
    padding:216px 25px 0;
    position:absolute;
    right:78px;
    top:145px;
    width:260px;
}   
#skin-advisor-step1 #what-is-dry p, #skin-advisor-step2 #skin-allergen-guide p
{
    color:#5d5d5d;
    font:normal 13px/20px Arial;
    float: left;
}
#skin-advisor-step1 #what-is-dry a, #skin-advisor-step2 #skin-allergen-guide a
{
    color:#5d5d5d;
    background:transparent url(../../images/global/grey-arrow.gif) no-repeat scroll right center;
    font:bold 13px Arial;
    text-decoration:none;
    padding:0 10px 0 0;  
}  
#skin-advisor-step1 #what-is-dry a:hover, #skin-advisor-step2 #skin-allergen-guide a:hover
{
    text-decoration:underline;
}

/**
 * Skin Advisor Step 2
**/
#skin-advisor-step2 #left-content ul
{
    margin:20px 0 24px;
    padding:0;
    line-height:0;
    overflow:hidden;
}
#skin-advisor-step2 #left-content ul li
{
    margin:0;
    line-height:0;
}
#skin-advisor-step2 #left-content ul li h2
{
    font:normal 20px/27px Georgia;
    padding:0 0 10px;
    margin:0;
}
#skin-advisor-step2 #left-content ul li ul
{
    width:231px;
    float:left;
    margin:0;
}
#skin-advisor-step2 #left-content ul li ul li
{
    height:auto;
    margin:0;
    overflow:hidden;
    padding:0 32px 5px 3px;
    width:195px;
}
#skin-advisor-step2 #left-content ul li ul li.last
{
    margin:0 32px 0 4px;
}
#skin-advisor-step2 #left-content ul li label
{
    height:auto;
    width:130px;
}
#skin-advisor-step2 #left-content #form-progress
{
    background:transparent url(../../images/skin-advisor/page2-2.png) no-repeat scroll right center;
    height:50px;
    margin:0 0 0 -17px;
    width:932px;
    /*position:absolute;*/
    bottom:15px;
}
#skin-advisor-step2 #left-content #form-progress a
{
    background:transparent url(../../images/buttons/submit-my-profile.gif) no-repeat scroll 0 0;
    float:left;
    margin:0 150px 0 0;
}
#skin-advisor-step2 #left-content #form-progress a:hover
{
    background:transparent url(../../images/buttons/submit-my-profile.gif) no-repeat scroll 0 -51px;
}
#skin-advisor-step2 #left-content #form-progress a.back
{
    background:transparent url(../../images/buttons/btn-skin-advisor-back.png) no-repeat scroll 0 0;
    height:20px;
    width:61px;
    margin:16px 0 0;
}
#skin-advisor-step2 #left-content #form-progress a.back:hover
{
    background:transparent url(../../images/buttons/btn-skin-advisor-back.png) no-repeat scroll 0 -20px;
}
/* Skin Allergen Guide */
#skin-advisor-step2 #skin-allergen-guide
{
    background:transparent url(../../images/skin-advisor/skin-allergen-guide.png) no-repeat scroll 0 0;
    height:100px;
    padding:216px 25px 0;
    position:absolute;
    right:78px;
    top:145px;
    width:260px;
}