
@media only screen { /* Define mobile styles */
	[class*="column"] + [class*="column"]:last-child {
		float: left !important;
	}
	.container{padding:0px 20px;}
	.content-container{margin:0px; padding:0;}
	.form-box{
		/*box-shadow: 0px 2px 10px 2px #ccc;*/
		clear: both;
		margin-bottom: 30px;
		background: #ffffff;

	}
	.form-box-container{
        padding:15px;

	}
     .consumer-control.consumer-registration .captcha-box #recaptcha_group {  /*WHR-135*/
        margin-bottom:0px !important;
        padding-bottom:0px !important;
    }

    .consumer-control.consumer-registration .content-container .form-box #div_thankyou {  /*WHR-134*/
        margin-bottom:0px !important;
    }

	.red-text{color:#d92032;}
	.first-box .form-box p, .first-box .form-box  li{
		font-family:Omnes;
		font-size:14px;
		color:#666666;
	}
    .consumer-control.consumer-registration .first-box .form-box-container {  /*WHR-133*/
        padding: 0px 25px 25px 0px;
    }  

	.form-box p, .form-box li{
		font-family:Omnes;
		font-size:14px;
		color:#666666;
	}
    .form-box p.font16, .form-box li.font16{
		
		font-size:16px;
		
	}
    
    .form-box p .red-text, .form-box li .red-text{
		font-family:Omnes;
		font-size:12px;
		
	}
    .form-box p .red-text {
        font-family: Omnes;
        font-size: 24px;
        font-weight: bold;
        color: #666;
    }
    .form-box p .red-text.font14, .form-box li .red-text.font14{
		
		font-size:14px;
		
	}
    .form-box p .red-text.first, .form-box li .red-text.first{
		
		font-size:14px;
		
	}

    .form-box p .red-text.font16, .form-box li .red-text.font16{
		
		font-size:16px;
		
	}
    .form-box h2.seo-join-h2 .red-text{
		font-family:Omnes;
		font-size:12px;
		
	}
    .form-box h2.seo-join-h2.marbot0{
        margin-bottom:0;
    }



	.join-huggies-content{
		margin-top:75px;
	}
	.join-huggies-content h1{
		font-family: "Omnes",Arial,sans-serif;
		font-size: 12px;
		font-weight: normal;
		font-style: normal;
		color: #333;
		text-align: left;
		font-size: 36px;
		/* padding-top: 50px;
		margin-top:32px; */
		margin-bottom:22px;
		font-weight: 100;
		font-style: normal;
		color: #666;
	}
	
	.side-box{
		padding:20px 30px 10px 30px;
		border:none;
		margin-bottom:30px;
		position:relative;
	}
	.side-box p{text-align:center; padding:0px 10px; margin:10px 0px;} 
	.side-box .red-title{
		position:relative;
		width:100%;
		left:0;
		top:4px;
	}
	.red-title p{
		padding:0 10px;
		width:70%;
		margin:0 auto;
		background-color:transparent;
		text-transform:uppercase;
		color:#666666 !important;
	}
	.side-box p, .side-box li{
		font-family: "Omnes",Arial,sans-serif;
		font-size: 13px;
		font-weight: normal;
		font-style: normal;
		color:#666666;
	}
    .side-box p.font12 {
        font-size:12px;
    }

	.side-box li{
		float:left;
		width:50%;
		list-style:none;
	}
	.side-box .brand-box{
		border:2px dashed transparent;
		margin:5px 0px;
		padding:25px 7px;
		border-left:none;
		border-right:none;
		overflow:hidden;
	}
	.brand-box ul{margin:0;}
	a.already-member-sign-in{color:#ef2e2f; text-decoration:underline; text-transform:uppercase;}
    a.terms-conditions{color:#666666; text-decoration:underline; text-transform:uppercase;}
	a.terms-conditions{text-transform:none;}
	
	ul.social-login{margin:0; padding:0; overflow:hidden;}
	ul.social-login li{
		width:100%;
		padding:0px 20px;
	}
	ul.social-login li{float:left; list-style:none;}
	a.social-login{
		background-color: #fff;
		background-repeat:no-repeat;
		background-position:10px 4px;
		border: 2px solid #999999;
		color: #666;
		text-transform:uppercase;
		text-align:center;
		width:100%;
		margin-bottom:10px;
	}
	a.social-login:hover{
		border-color:#2285a2;
		color:#2285a2;
		background-color:#fbfbfb;
	}
	a.facebook{background-image:url(/Content/img/social/reg-facebook.jpg);}
	a.twitter{background-image:url(/Content/img/social/reg-twitter.jpg);}
	a.gplus{background-image:url(/Content/img/social/reg-gplus.jpg);}
	a.yahoo{background-image:url(/Content/img/social/reg-yahoo.jpg);}
	
	.form-box h2.line-title{
		font-family: "Omnes",Arial,sans-serif;
		font-size: 12px;
		font-weight: normal;
		font-style: normal;
		color: #666666;
		background: url("/Content/img/line_bg_h2.png") repeat-x center;
		text-align: center;
		width: 100%;
		margin:20px 0px;
		font-weight: 300;
		font-style: normal;
	}
	.form-box h2.line-title span.title-details{background:#ffffff;}
	
	p.red-title-image{width:15%;}
	p.join-today{
		line-height:14px;
		margin:10px auto;
	}
	.plusfifty{
		width:70%;
		padding:10px 0px 15px 70px;
		margin:0 auto;
		background: url("/Content/img/plus500.png") no-repeat scroll left top / 52px auto; 
		text-transform:uppercase;
		color:#d92032;
	}
	
	.form-elements .columns{padding:0;}
	.form-elements label{font-size:14px; color:#666666; text-transform:uppercase;cursor:default;}
	.form-elements input[type="email"], .form-elements input[type="text"], .form-elements input[type="password"], .form-elements input[type="number"], .form-elements select, .form-elements textarea{
		height:32px;
		background-color:#eeeeee;
		border:0;
		border-radius:0px;
		box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.2);
		font-size:14px;	
		margin-top:5px;
        color:#666666;
        font-family:"Omnes",Arial,sans-serif;
	}
    .registration-page-bg .form-elements input[type="email"], .registration-page-bg .form-elements input[type="text"], .registration-page-bg .form-elements input[type="password"], .registration-page-bg  .form-elements input[type="number"], .registration-page-bg  .form-elements select, .registration-page-bg  .form-elements textarea{
		height:32px;
		background-color:#ffffff;
		border:0;
		border-radius:0px;
		box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0);
		font-size:14px;	
		margin-top:5px;
        color:#666666;
        font-family:"Omnes",Arial,sans-serif;
	}
        .registration-page-bg .form-elements input[type="email"]:hover, .registration-page-bg .form-elements input[type="text"]:hover, .registration-page-bg .form-elements input[type="password"]:hover, .registration-page-bg  .form-elements input[type="number"]:hover, .registration-page-bg  .form-elements select:hover, .registration-page-bg  .form-elements textarea:hover{
		border:2px solid #666 !important;
	}
   .registration-page-bg #consumer_postalcode_group input[type="text"]:hover {
       border:2px solid #666 !important;
    }
     .registration-page-bg .sg-survey-form .sg-question-options select {
         border:2px solid transparent;
    }
     .registration-page-bg .sg-survey-form .sg-question-options select:hover {
         border:2px solid #666 !important;
    }

    @media only screen and (max-width: 380px) {  /*WHR-134*/
        .tellfriend .form-elements input[type="email"], 
       .tellfriend .form-elements input[type="text"],  
        .tellfriend  .form-elements input[type="password"], 
        .tellfriend  .form-elements input[type="number"],  
         .tellfriend  .form-elements select, 
       .tellfriend    .form-elements textarea {
            margin-left: -15px;
        }
    }
 



	input[type="email"]:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus{
		box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.1);
	}
	.form-group{padding:7px 3rem; background-color:none;}
	.form-group-error{background-color:#f7d6d6;}
		.form-group-error input, .form-group-error select{border:2px solid #ff0033; margin-bottom:1px;}
		.form-group-error span.error{background-color:#f7d6d6; color:#ff0033; font-weight:300; font-style:normal; font-family:'Omnes'; margin-bottom:0;}
	.form-password{margin-bottom:0; padding-bottom:0px;}
		.form-password input{margin-bottom:0;}
	.form-group:last-child{margin-bottom:0; padding-bottom:0px;}
	
	ul.password-requirements {margin:0; padding:0;}
	ul.password-requirements li{list-style:none; margin-bottom:0px; display:block;}
		.password-check{padding:0px 0px 0px 25px;}
		.password-pass{
			background:url(/Content/img/password-requirements-pass.png) no-repeat center left;
			color:#96c91b;
		}
		.password-idle{background:url(/Content/img/password-requirements-idle.png) no-repeat center left;}
		.password-guide{color:#666666;}


    input[type="radio"] + label {
        font-size:12px;
    }
    .consumer-checkbox-wrap label {
        font-size:14px;
    }
    .consumer-radiobutton-label {
        font-size:14px;
    }

    .form-elements label .consumer-radiobutton-label {
        font-size:14px;
    }

    .password-guide {
        font-size:14px;
    }

    #yes-sign-me-up + label {
        font-size:4px;
    }
    #no-thanks + label {
        font-size:4px;
    }

	label.radio{
		overflow:hidden;
		margin-bottom:10px;
		padding-top:5px;
		text-transform:capitalize;
        font-size:14px;
	}	
	input[type="radio"], input[type="checkbox"]{
		display:none;
	}
	label > input[type="radio"] + .psuedo-radio{
		background:url(/Content/img/radio-inactive.png) no-repeat center left;
		width:25px;
		height:25px;
		float:left;
		margin-right:10px;
	}
	label > input[type="radio"]:checked + .psuedo-radio{
		background:url(/Content/img/radio-active.png) no-repeat center left;
	}
	label.checkbox-label{text-transform:none; font-size:12px; padding-left:45px; overflow:hidden;}
	label.checkbox-label:last-child{padding-bottom:20px;}
	label > input[type="checkbox"] + .psuedo-checkbox{
		position:absolute;
		/*top:25%;*/
        top:10px;
		left:0;
		background:url(/Content/img/checkbox-idle.png) no-repeat center left;
		width:25px;
		height:25px;
		float:left;
		margin-right:10px;
	}
	label > input[type="checkbox"]:checked + .psuedo-checkbox{
		background:url(/Content/img/checkbox-active.png) no-repeat center left;
	}
	
	p.reg-notes{font-size:11px; font-family:Arial, Helvetica, sans-serif; color:#999999;}
	
	a.add-another, a.sign-up{
		text-transform:uppercase;
		background-color:#dddddd;
		color:#666666;
		width:100%;
	}
	a.sign-up{
		color:#ffffff;
		background-color:#DA291C;
		margin-top:30px;
	}
	a.sign-up:hover{
		/*color:#d92032;*/
		background-color:#DA291C;
            background-image: -ms-linear-gradient(top, #E04B5A 0%, #DA291C 50%) !important;
    background: -webkit-gradient(linear, left top, left bottom, from(#E04B5A), to(#DA291C)) !important;
    background: -webkit-linear-gradient(#E04B5A, #DA291C) !important;
    background: -moz-linear-gradient(top, #E04B5A, #DA291C) !important;
    background: -ms-linear-gradient(#E04B5A, #DA291C) !important;
    background: -o-linear-gradient(#E04B5A, #DA291C) !important;
    background: linear-gradient(#E04B5A, #DA291C) !important;
    color: #ffffff !important;
    zoom: 1;
	}
	ul.error-list li{color:#ff0033; font-weight:300;}
    #divCancel a.sign-up:hover {
    color: #fff !important;
}
}



/* max-width 640px, mobile-only styles, use when QAing mobile issues */ 
/*@media only screen and (max-width: 40em) { } */


@media only screen and (min-width: 40.063em) {  /* min-width 641px, medium screens */
	.content-container{margin:0;}
	.join-huggies-content{
		margin-top:75px;
	}
	.side-bar{float:left !important;}
	ul.social-login li{padding:0px;}
	ul.social-login li:nth-child(odd){width:48%; margin-right:2%;}
	ul.social-login li:nth-child(even){width:50%;}
	
	.date-columns{float:left !important;}
	.date-columns > .columns{padding-left:7px; padding-right:7px;}
	.date-columns > .columns:first-child{padding-left:0;}
	.date-columns > .columns:last-child{padding-right:0;}
	.form-box{padding:2rem 0rem}
	.form-box-container{
		padding: 0rem 3rem;
	}
	a.add-another{
		margin-top:30px;
	}
    
	label.checkbox-label:last-child{padding-bottom:0px;}
} 



/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
/* @media only screen and (min-width: 40.063em) and (max-width: 64em) { } */


@media only screen and (min-width: 64.063em) { /* min-width 1025px, large screens */
	.side-bar{float:right !important;}
	.side-bar-mobile{
		position:absolute;
		top:0; right:0;
	}
	.side-bar-mobile-2{
		position:absolute;
		/*top:25%;*/
        right:0;
	}
	.content-container{margin:0 auto; padding:0;}
	.container{padding:0;}
	.join-huggies-content{
		margin-top:145px;
	}
	.join-huggies-content h1{
		font-size: 48px;
        margin-top: 85px;
        margin-bottom: 50px;
        color: #ef2e2f;
	}
	.form-box{padding:2rem 0rem}
	.form-box-container{
		padding: 0rem 3rem;
	}
	.captcha-area{margin-bottom:20px;}
    .form-elements-last {
        padding-bottom:0px;
} 
} 

/* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */
/* @media only screen and (min-width: 64.063em) and (max-width: 90em) { } */


@media only screen and (min-width: 90.063em) { /* min-width 1441px, xlarge screens */

} 

/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
/* @media only screen and (min-width: 90.063em) and (max-width: 120em) { } */


@media only screen and (min-width: 120.063em) { } /* min-width 1921px, xxlarge screens */


button.round, .button.round {
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    -o-border-radius: 25px;
    border-radius: 25px;

    /* firefox's individual border radius properties */
    -moz-border-radius-topleft:25px; /* top left corner */
    -moz-border-radius-topright:25px; /* top right corner */
    -moz-border-radius-bottomleft:25px; /* bottom left corner */
    -moz-border-radius-bottomright:25px; /* bottom right corner */
    -moz-border-radius:25px 25px 25px 25px;  /* shorthand topleft topright bottomright bottomleft */

    /* webkit's individual border radius properties */
    -webkit-border-top-left-radius:25px; /* top left corner */
    -webkit-border-top-right-radius:25px; /* top right corner */
    -webkit-border-bottom-left-radius:25px; /* bottom left corner */
    -webkit-border-bottom-right-radius:25px; /* bottom right corner */
    
    border-top-right-radius: 25px;
    border-top-left-radius: 25px;
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 25px;

    
    font-size:11px;
}

.consumer-input-wrap{
    margin-bottom:5px !important;
}

.consumer-communication-label {
    line-height:17px;
}

.consumer-communication-label.checkbox{ 
        vertical-align: middle; 
        display: table-cell; 
        min-height: 25px; 
    } 

label > input[type="checkbox"] + .psuedo-checkbox{ 
    top:0; 
    height: 100%; 
    min-height: 25px; 
}


.social-login {
    font-size:11px;
}
.font16{
    font-size:16px !important;
}

    @media only screen and (min-width: 40.063em) {
        .zip-medium-6{
            width:50% !important;
        }
    }

    label.errored {
color: #c60f13 !important;
text-transform: none !important;
       
         
    }
@media only screen and (max-width:40.063em) {
        .form-elements-last{padding-bottom:20px;}
}

    .form-elements .consumer-child .child-data .consumer-input-wrap{
        margin-bottom: 0px !important;
    }
    .font12{
        font-size:12px !important;
    }
    .font14{
        font-size:14px !important;
    }
    div.error{
        cursor:default !important;
    }
    .ssols_form abbr, #missingfields_tab abbr{
        display: none !important;
    }
    .text-upper{
        text-transform:uppercase;
    }
    label.error, label.errored,div.error,div.ui-message,label.ui-message,div.survey-gizmo-validation-message {
padding: 0 !important;
margin-top: 9px !important;
padding-bottom: 9px !important;
/* font-size: 0.75rem; */
font-size: 9pt !important;
font-weight: normal !important;
font-style: normal !important;
background: #c60f13;
color: red !important;
width: 100% !important;
text-align: left;
background-color: transparent !important;
text-transform: none !important;
}
    ul.error-list li label.error, ul.error-list li label.errored,ul.error-list li div.error,ul.error-list li div.ui-message,ul.error-list li label.ui-message, ul.error-list li div.survey-gizmo-validation-message{
color: #ff0033 !important;
font-size: 14px !important;
font-weight: 300 !important;
margin-top: 0px !important;
padding-bottom: 0px !important;
}
    .form-group-error .error-head {
color: #666666;
font-weight: 300;
font-style: normal;
font-family: 'Omnes';
text-transform: initial;
font-size: 14px;
margin-bottom: 20px !important;
}
    .join-huggies-content h1 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding-top: 50px !important;
    padding-bottom: 10px !important;  
}
h2.seo-join-h2{
    font-family: "Omnes",Arial,sans-serif;
    font-size: 16px;
    margin-top:0;
    margin-bottom:1.25rem;
    line-height:1.6;
}
@media only screen and (min-width: 320px) and (max-width:639px) {
    .join-huggies-content .join-huggies-title { /*WHR-134*/
        padding-bottom: 15px !important;
        padding-top: 15px !important;
    }
    	.registration-page-bg .join-huggies-content h1{/*Deffect no 62*/
        color: #ef2e2f;
	}
    .registration-page-bg .form-group.preferredRetailer {  /*Deffect no 62*/
        margin-bottom:0px; 
    }
        .registration-page-bg .form-group.preferredRetailer .sg-body {
        padding-bottom:0px;
        }
}
@media only screen and (min-width: 639px) and (max-width:1019px) {
    .join-huggies-content .join-huggies-title { /*WHR-134*/
        padding-bottom: 30px !important;
        padding-top: 30px !important;
    }
    .join-huggies-content h1 {      
        padding-top: 30px !important;
        padding-bottom: 30px !important;  
    }

}
  
.join-huggies-content .container {
    padding-left:15px !important;
}
#recaptcha_area{
    margin-left:-3px !important;
}
.sg-required-icon {
color: inherit !important;
font-weight: normal !important;
}
/*input[type="radio"], input[type="checkbox"]{
		 display: initial;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  position: absolute;
 z-index: -1000;
	}*/
select:focus {
  box-shadow: 0 0 2px 0 #0066FF;
  -webkit-box-shadow: 0 0 9px 0 #86AECC;
}

/* Recaptcha - Issue*/
@media screen and (max-width: 480px){
    #rc-imageselect, .g-recaptcha {
        transform: scale(0.77);
        -webkit-transform: scale(0.77);
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
    }
}

.first-box .form-box {
    background: transparent;
    padding-top: 0px !important;
    padding-bottom:0px !important;
    margin-bottom:30px !important;
}
a.consumer-addchild-link {
    text-transform: uppercase;
    background-color: transparent;
    color: #666666;
    width: 100%;
    border: 2px solid #666;
}