/* START--> New CSS Classes for Newly Desgined Join Page*/

html {
 font-family:sans-serif;
 -ms-text-size-adjust:100%;
 -webkit-text-size-adjust:100%
}

body
{
	background: #f8f8f8;
	margin: 0;
	font-family: 'Roboto', sans-serif;
}

body.has-gdpr .copyright
{
  margin-bottom: 5rem;
}

/*!
 *  Font Awesome 4.7.0 by @davegandy - //fontawesome.io - @fontawesome
 *  License - //fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */@font-face {
 font-family:'FontAwesome';
 src:url(//media.mercola.com/assets/fonts/fontawesome-webfont.eot);
 src:url(//media.mercola.com/assets/fonts/fontawesome-webfont.eot) format("embedded-opentype"),
 url(//media.mercola.com/assets/fonts/fontawesome-webfont.woff) format("woff"),
 url(//media.mercola.com/assets/fonts/fontawesome-webfont.ttf) format("truetype"),
 url(//media.mercola.com/assets/fonts/fontawesome-webfont.svg) format("svg");
 font-weight:normal;
 font-style:normal
}
.fa {display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;padding: 5px;}

.fah { padding: 0px;}

.gift .fa { font-size:20px; }
.fa-gift:before {
 content:""
}
.fa-check:before {
 content:""
}

.fa-angle-down:before {
 content:""
}

.hide-show .fa  {font-size:20px; padding-bottom: 0px; }
.fa .hide-show {font-size:20px;  top: -43px; z-index: 2;    position: relative; right: -18px;   text-align: center;}
.fa-eye:before {
 content:""
}

.hide-show a:focus{outline:none!important;}

.fa-eye-slash:before {
 content:""
}



p { font: normal 16px 'Roboto', sans-serif; }

.padding-5 {padding:5px;}
.padding-top-10 {padding-top:10px;}
.padding-top-20 {padding-top:10px;}
.padding-top-30 {padding-top:30px;}
.padding-bot-10 {padding-bottom:10px;}
.padding-bot-20 {padding-bottom:10px;}
.padding-bot-30 {padding-bottom:30px;}
.neg-margin-top-10 {margin-top: -10px;}
.neg-margin-top-20 {margin-top: -20px;}
.neg-margin-top-30 {margin-top: -30px;}
.neg-margin-bot-10 {margin-bottom: -10px;}
.neg-margin-bot-20 {margin-bottom: -20px;}
.neg-margin-bot-30 {margin-bottom: -30px;}

/* Main Login */
.main-content h5 { font-size:17px; font-weight:normal; text-align:center; line-height:2.35rem; margin-top:2.5rem;margin-bottom: 0px;height: 20px;}
.main-content h5 span { background-color:#fff; padding:0 15px; z-index:0; position:relative;top:-20px}
.main-content h5::before {border-bottom:1px solid #ddd; content:""; display:block; position:relative; margin-top:-16px; z-index:0}


/* forms */
.formElement{float: left;width:92%;}
.formElement:nth-child(3n){margin-right: 1%;}
.formElement input{border-radius: 5px;border: solid 1px #ccc;font-size: 1.4rem;color: #8c8c8c;font-family: Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;}

.formElement label{
	color: #555555;
	margin-left: .9rem;
	font-family: Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
}
.formElement label.active{
	position: absolute;
	font-size: 10px;
	margin-top: 3px;
	margin-left: 10px;
	color: #3784BB;
}


  
.formElement label.inactive{
	position: absolute;
	margin-top: .9rem;
	color: #444444;
}
.formElement label.transition{
	 -webkit-transition: all .2s linear;
      -moz-transition: all .2s linear;
        -o-transition: all .2s linear;
           transition: all .2s linear;
}


.formElement input:-webkit-autofill + label
{
	position: absolute;
	font-size: 10px;
	margin-top: 3px;
	margin-left: 10px;
	color: #3784BB;
}


.HeaderLog {background-color:#fff; border-bottom: 1px solid #ccc;}
.HeaderRight {float:right; margin-top: 15px; margin-right: 26px;}

div.tollfree{color:#2369b4; padding-left: 25px !important;font: normal 23px 'Roboto', sans-serif;text-align: right;padding-top: 8px;float: right;height: 40px;}
div.tollfree a { display: inline-block;background: url(//media.mercola.com/assets/images/icons.png) -56px -123px no-repeat;padding-left: 27px;color: #2369b4;height: 28px;}



.txtfielddiv .select-security {width:385px !important; }
.security-form {padding-top:0px !important;}

.select-responsive {
	display: block;
	font-size: 14px;
	font-family: sans-serif;
	color: #444;
	line-height: 1.3;
	max-width: 100%; 
	box-sizing: border-box;
	margin: 0;
	border: solid 1px #ccc;
	border-radius: 5px;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #fff 0%,#fff 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
	height: 50px;
}
.select-responsive::-ms-expand {
	display: none;
}
.select-responsive:hover {
	border-color: #888;
}
.select-responsive:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222; 
	outline: none;
}
.select-responsive option {
	font-weight:normal;
}

.LogHR {border-top: 1px solid #ababab;}
.FreeGift {font: bold 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif; padding: 10px 0px 10px 10px; color:#3d3d3d; margin-left: 10px;}
.PasswordResult {font: 500 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif; margin: 0px; z-index: 1; position:relative; top:-15px; left:40px;}
.hide-show a {font: normal 14px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif; color:#8c8c8c !important; text-decoration:none  !important; float:right;     top: -50px; z-index:2; position: relative;  margin: 0px 0px; padding: 5px 2px 2px 6px; right: -29px;     height: 38px; width: 34px; }
.pass-check {
    float: right;
    position: absolute !important;
    z-index: 3;
    top: 1.5rem;
    left: unset !important;
    right: -3.5rem;
  }



input, textarea, select {
  background: #ffffff;
  border: 1px solid #E5E5E5;
  color: #000;
  font-size: 14px;
  margin: 0em 10px 0.2em 0;
  padding: 0.7em 0.9em;
  font-family: Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
}

input:focus, textarea:focus {
  border: 1px solid #2569b3;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset;

}

input.checkbox 
{
    
 font: normal 14px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
 color: #3d3d3d;   
  
}



.MainLogBox
{
	font: normal 14px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
	vertical-align: middle;
	height: 100%;
	
}
.MainLogBox a
{
	color: #2369B4;
	text-decoration: none;
}
.MainLogBox a:hover
{
	color: Black;
	text-decoration: none;
}
/*
#LogTopArea
{
	width: 600px;
	margin: 0px auto;
	height: 60px;
	background: #F1F1F1;
}*/
#LogTopArea .LogTitle
{
	font: normal 30px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
	color: #000;
	text-align: left;
	margin: 30px 0 10px 30px;
	width: 540px;
	float: left;
}
#LogTopArea .LogMenu
{
	margin-top: 28px;
	width: 290px;
	float: right;
	text-align: right;
	margin-right: 18px;
}
/*
#JoinContentArea
{
	width: 600px;
	margin: 0px auto;
	background: #F1F1F1;
	clear: both;
	height: auto;
}
#JoinContentArea .LogoArea
{
	width: 250px;
	float: left;
	padding-left: 30px;
}
#JoinContentArea .LogoJoinArea
{
	width: 206px;
	float: left;
	padding-left: 10px;
}
#JoinContentArea .DescArea
{
	width: 275px;
	float: right;
	padding-right: 15px;
	padding-top:10px;
}
#JoinContentArea .FormArea
{
	width: 498px;
	float: left;
	background:#ffffff;
	border: 1px solid #EBEBEB;
	text-align: left;
	padding:0px 20px 10px 20px;
	margin:0 30px 30px 30px;
}
#JoinContentArea .FormAreaFullWidth
{
	text-align: left;
	padding-top: 20px;
	clear: left;
	padding-left: 40px;
}*/
.smallerText
{
	text-align: left;
	font: normal 12px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
}
.Log_hrLong
{
	background: url( 'images/Login_hr.jpg' ) repeat-x;
	height: 2px;
	width: auto;
	margin-bottom: 5px;
}
.JoinTitle
{
	font: bold 12px Verdana, Arial Narrow, Arial;
	padding: 5px 0;
	border-bottom:1px solid #cccccc;
	text-align: left;
	margin-top: 10px;
}
.TermsCondition
{	border-top:1px solid #ababab; 
 	padding:10px 50px;
 	margin-bottom:0;
 	font-size:14px;
 	color:#a0a0a0;
 	text-align: center;
}
.TermsConditionLogin {text-align:center; padding: 20px 0px 20px 0px;}
.TermsConditionLogin a{color: #2369B4; text-align:center; text-decoration:none;}

.subscribe-checkbox {font-size:14px; color:#3d3d3d; line-height:20px;}

.AlreadyAccnt
{
  border-top:1px solid #ababab; 
   font-size:16px; 
   text-align: center;
   font-weight: 500;
   font-family: Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
   padding: 20px 0px 0px 0px;
}



.TrusteImg 
{ 
	background: url( 'images/Truste.png' ) no-repeat;
	width: 149px;
	height: 47px;
}
.AvailBtn
{
	background: url( 'images/Availability_Btn.jpg' ) no-repeat;
	height: 30px;
	width: 166px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
}
.SmallTitle
{
	font: normal 12px Arial;
}
.JoinDropDown
{
	margin-top: 5px;
	margin-right: 3px;
}
.LeftWidth
{
	width: 279px;
}
.RightWidth
{
	width: 251px;
}
.Log_hr
{
	background: url( 'images/Login_hr.jpg' ) no-repeat;
	height: 2px;
	width: 260px;
	margin-bottom: 10px;
}
.ErrorMsg
{
	color: Red;

}
.LogBox
{
	background-color: Transparent;
	height: 34px;
	width: 240px;
	border: 0px;
	padding-left: 10px;
	font: normal 16px Arial;
}
.LogTextBox
{
	background: url( 'images/SignIn_txtbox.jpg' ) no-repeat;
	height: 34px;
	width: 260px;
	padding-top: 7px;
	margin-top: 3px;
}
.ContinueBtn
{
	background: url( 'images/btn-continue.gif' ) no-repeat;
	height: 41px;
	width: 144px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
}
.LogBtn, .SignUpBtn, .ChangeBtn, .RetrieveBtn, .CancelBtn, .ContinueBtn{
	-moz-user-select: none;
    background: #2369B4;
    border-radius: 8px;
    color: #FFFFFF !important;
    cursor: pointer;
    font: bold 16px 'Roboto', sans-serif;
    width: 100%;
    border: 0px;
    padding: 0.9em 0.9em !important;
	margin-bottom: 1rem;
}

.LogBtn:hover, .SignUpBtn:hover {
  background: #1F5EA2;
}

.CreateBtn{
	-moz-user-select: none;
    background: #fff;
    border-radius: 8px;
    color: #2369B4;
    cursor: pointer;
    font: normal 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
    border: 1px solid #2369B4;
    width: 99.5% !important;
    padding: 0.9em 0 !important;
    display: block;
    text-align: center;
    margin-bottom: .2em;
}

.CreateBtn:hover {
  color: #1B4675;
  border: 1px solid #1B4675;
}

.loginBtnheader { 
                  
    background-color: white;
    color: #2369B4;
    border: 1px solid #2369B4;
    border-radius: 5px;
    padding: 10px 20px;
    text-align: center;
    font-family: Roboto !important;
    font-size: 14px !important;
    text-decoration: none;
    display: inline-block;
    margin-left: 20px;
    float:right;
                  
                  }
.loginBtnheader a:link, a:visited
{
    background: #fff;
    color: #2369B4;
    cursor: pointer;
    font: normal 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
    text-decoration:none; 
}

.CreateBtn, .SignUpBtn, .RetrieveBtn {width: 100%;}
.LogBtn {width: 100%; margin:10px 0px 10px 0px;}
.ChangeBtn {width: 100%;margin-top: 15px;}
.CancelBtn {width: 100%; }
.ChangeBtnCancel{margin: 25px 0 10px 4px !important;float: left;}
.ChangeBtnCancel ~ .ChangeBtn {margin-top: 0px !important;}
.ContinueBtn {width:100%;}

.PopCloseBtn {
	float: right;
    margin-right: 20px;
    margin-top: 15px;
}

.clearLeft {clear: both;}

#LogFooterArea
{
	width: 600px;
	margin: 0px auto;
	clear: both;
}
#LogFooterArea .LogFooterImg
{
	width: 600px;
	margin: 0px auto;
	height: 31px;
	background: #F1F1F1;
}
#LogFooterArea .LeftPane
{
	font: normal 11px Arial;
	text-align: left;
	margin-top: 10px;
	width: 300px;
	float: left;
}
#LogFooterArea .LeftPane a
{
	color: Black;
	text-decoration: none;
}
#LogFooterArea .LeftPane a:hover
{
	color: #274eab;
	text-decoration: underline;
}
#LogFooterArea .RightPane
{
	margin-top: 10px;
	width: 200px;
	float: right;
	text-align: right;
}

#LogTopArea .LogMenu
{
	margin-top: 18px;
	width: 270px;
	float: right;
	text-align: right;
	margin-right: 18px;
}

#LogTopArea .LogMenu .Tab_selected
{
	width: 131px;
	height: 30px;
	font: bold 14px Arial Narrow, Arial;
	text-align: center;
	background: url( 'images/SignIn_tab.png' ) no-repeat;
	line-height: 30px;
}

#LogTopArea .LogMenu .Tab_Nselected
{
	width: 131px;
	height: 30px;
	font: bold 14px Arial Narrow, Arial;
	text-align: center;
	color: #999999;
	background: url( 'images/SignIn_tabover.png' ) no-repeat;
	line-height: 30px;
}

#LogTopArea .LogMenu .Tab_Nselected a
{
	color: #999999;
	text-decoration: none;
}
#LogTopArea .LogMenu .Tab_Nselected a:hover
{
	color: Black;
	text-decoration: underline;
}

.RightWidth{width: 258px;}
.TableForms {margin-left: 15px;}

/*START -> Join Popup after successful */
.disable-scroll {
    overflow-y: hidden;
    overflow-x: hidden;
}
        
.popup-overlay {
	display:none;
}

.popup-overlay.active{
    display:block !important;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.98);
    z-index: 9;
}


.popup-content {
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
    padding: 10px 16px;
}

.popup-content > img:first-of-type {
    width: 50%;
}

.popup-content h2 {
    font-family: 'Roboto';
    font-weight: 800;
    font-size: 34px;
    margin: 12px auto;
}

.popup-content p {
    font-family: 'Roboto';
    font-size: 22px;
    margin-top: 0;
    line-height: 1.3em;
}

.popup-content span.close {
    position: absolute;
    top: 0;
    right: 0;
    margin: 20px 60px;
    cursor: pointer;
}

.popup-content button.popup-btn {
    background-color: #2369B4;
    color: #FFF;
    border: none;
    padding: 16px 60px;
    font-size: 18px;
    cursor: pointer;
    font-family: 'Roboto';
    font-weight: 800;
}

.popup-content button.popup-btn:hover {
    background-color: #125196;
}

@media only screen and (max-width: 640px) {
    .popup-content span.close { margin: 10px !important; }  
}

@media only screen and (max-width: 480px) {
    .popup-content h2 { font-size: 28px; }
    .popup-content p { font-size: 20px; }
}

/* END -> Join Popup after successful */
/* END--> New CSS Classes for Newly Desgined Join Page*/

.SigninError
{
	height: 20px;
	font-size: 11px;
	color: Red;
	font-family: Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;
}
.cssPanelErrorMessage
{
	border: 1px solid black;
	background-color: #FFFF99;
	padding: 3px;
}

.validationFailure { color: Red; padding-left: 5px; font-family: Roboto, Helvetica; font-size: 12px; vertical-align: bottom;}
#tl00_pnlUpdate1 {padding:10px;}
.validationSummary2 {margin: 0px auto; max-width: 450px; width: 90%; color: Red;}
.leftTD { text-align: left; vertical-align: top; width: 55%; float:left;}
.leftTDpass { text-align: left; vertical-align: top; width: 55%; float:left; }
.rightTD {text-align: left; width: 45%; float: right;}
.rightTDpass {text-align: left; width: 45%; float: right;  padding-top: 5px;}
.xsmallerText
{
	font-size: 13px;  padding-left: 5px;
}
#ctl00_ContentPlaceHolder1_upDisplayName {float: left;}
#ctl00_ContentPlaceHolder1_IsAvalible {color: #2369b4 !important;padding-left: 5px;font-size: 12px;display: inline-block;padding-top: 0px;font-family: Roboto, Helvetica;}
#ctl00_ContentPlaceHolder1_IsAvalible_Suggest {padding-left:4px !important; font-size: 14px;  }
#ctl00_ContentPlaceHolder1_IsAvalible_Suggest a{padding-left:0 !important; color:#226cab !important;font-size: 12px;text-decoration: underline;}


.gray {color:#8c8c8c;}
.green {color:#36d489;}
.blue {color:#226cab;}
.red {color:#cc0000;}

.style1
{
    height: 24px;
}
.countryBorder
{
	border: 1px solid #66FF33;
}
/******************
incomplete profile
*******************/
/*
        BODY
        {
            margin: 0px;
        }
        A.Link:Link
        {
            color: #2E52CD;
            font-size: 14px;
            font-weight: bold;
        }
        A.Link:Active
        {
            color: #2E52CD;
            font-size: 14px;
            font-weight: bold;
        }
        A.Link:Visited
        {
            color: #2E52CD;
            font-size: 14px;
            font-weight: bold;
        }
        A.Link:HOVER
        {
            text-decoration: underline;
            color: maroon;
            font-size: 14px;
            font-weight: bold;
        }
*/
        .PopHeading
        {
            width: 550px;
            height: 350px;
            text-align: left;
            font:12px Verdana,Arial;
        }
        #overlayProfile
        {
            position: relative;
            background: #F1F1F1;
           
            z-index: 102;
            padding: 0;
            margin:0 auto;
        }
        #overlaybaseProfile
        {
            z-index: 101;
            background-color: #ffffff;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        .tdContentsProfile
        {
            padding-top: 50px;
        }
        .styleProfile
        {
            padding:0px 30px 30px 30px;        
        }
        .stlyeProfileInner
        {
        	padding: 10px 20px 20px 20px;
        	background: #ffffff;
        	border:1px solid #EBEBEB;
        }
        .styleProfileTitle 
        {
        	padding:30px 0 10px 30px;
        }
        
        .styleProfileTitle .main
        {
        	font: bold 16px Arial, Verdana;
			color: #7C7C7C;
			text-align: left;
			text-transform: uppercase;
			text-shadow: 0 1px 0 #FFFFFF;
        }
        
        
        /**** logout styles ****/
#signIn_holder { background:#eef3fa; margin:18px; padding:0; }
.signInBoxContent_m { background:#d5eafc url('images/signInBoxContent_m.jpg') 0 0 repeat-x; width:100%; }
.signInBoxContent_l { background: url('images/signInBoxContent_m.jpg') 0 0 no-repeat;}
.signInBoxContent_r { background: url('images/signInBoxContent_m.jpg') 100% 0 no-repeat; padding:10px 30px 0 15px; border-right:2px solid #aed2ff; border-left:2px solid #aed2ff; }

.signInBoxContent_b2 { background:url('images/logout_b.gif') 0 0 repeat-x; height:15px; width:100%; }
.signInBoxContent_bl2 { background:url('images/logout_bl.gif') 0 0 no-repeat; height:15px;}
.signInBoxContent_br2 { background:url('images/logout_br.gif') 100% 0 no-repeat; height:15px; }

#progressBackgroundFilter
{
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow: hidden;
    padding: 0;
    margin: 0;
    z-index: 1000;
    background-color:#ffffff;
    /* for IE */
    filter:alpha(opacity=60);
    /* CSS3 standard */
    opacity:0.6;
    
}
#processMessage
{
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1001;
}

.errors {
 margin: 10px 0px;
 padding: 15px;
 border: 1px solid #EBEBEB;
 /*background: #fff url(images/signInBoxContent_m.jpg) no-repeat 5px 50%;*/
}

.errors ul {
 margin: 0;
 padding: 0;
 list-style:none;
 color:#000;
}

.errors2 {
 margin: 5px 0px;
 padding: 15px;
 border-top: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;

}

/*.rbhzbum { position:absolute !important;  display:inline !important; left:-150px; top: -27px; *top:0; }*/
.footer-seal { padding: 20px 0 10px; }
			.footer-seal ul { text-align: center; width: 100%; margin: 0 auto; padding:0; }
			.footer-seal ul li { min-height:45px; list-style-type: none; vertical-align: middle;  width: auto; max-width:33%; padding:0 10px; margin:10px auto 0; height:auto; }
			.footer-seal ul li div { height:45px; display:table-cell; vertical-align : middle; }
			.footer-seal li a { margin:0 auto !important; }
			.footer-seal li a img { border:none; }
				.footer-seal li:last-child { margin-left:40px !important; }



/* responsive */

#logindiv { margin:0 auto; width:100%; max-width:500px; }
#headerdiv { margin:0 auto; width:100%; max-width:1100px; }
#logo { float: left;  padding: 10px 0px; margin-left: 30px;}
#select-lang { float:right; }
#contentdiv {  background-color:#fff; margin-top:30px; position: relative }
#content { background-color:#fff; padding: 0px 80px 40px 80px;  }
.cancel-btn { position: absolute; right: 28px; top: 24px; display: inline-block; color: #8c8c8c!important;
transform: scale(2,1.5); 
-moz-transform:scale(2,1.5); 
-o-transform:scale(2,1.5); 
-webkit-transform:scale(2,1.5);
-ms-transform:scale(2,1.5); }
.clear { clear:both; }
.title { font: normal 30px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif; color: #000; text-align: center; padding: 30px 60px 0 60px;   }
table {  width: 100% !important; margin: 0 auto; border-collapse: collapse; border-spacing: 0; }


@media only screen and (max-width: 600px) {
	.MainLogBox { margin-top:10px; }
	#contentdiv { padding:10px 0 10px !important; }
 	#content { border:none; padding: 0px 40px 40px 40px; }
	.title { text-align:center; padding: 40px 30px 0px 30px; }
	#logo { float: left; margin-left:10px; }
	#select-lang { margin-right:10px; }
	select  { font-size:12px; }
	/*#MainTable td, .rightTD, .leftTD { display:block; padding-left:5px; padding-right:5px; width:100%; }*/
	#JoinContentArea { padding-top:10px; }
	.select-security {width:340px !important; }
}

@media only screen and (max-width: 414px){	
	.HeaderRight {margin: 20px 13px 0px 0px;}
	.loginBtnheader {padding: 8px 10px; font-size: 14px; margin-left: 10px;}
    .lang-globe {height: 18px !important; padding: 7px 5px  !important; margin-left: 10px !important;}
    .lang-globe a { font-size: 14px;}
    .lang-dropdown {width: 30px; font-size: 14px;}
	.lang-globe { display: inline-block; position: relative;}
	#select-lang { clear:left; float:none; margin-top:10px;  text-align: center;  }
	.TermsCondition {padding: 10px 10px; margin-bottom: 15px;}
	.select-security {width:300px !important; }
	.SignUpBtn {font-size:17px;}
    .leftTDpass { vertical-align: top; width: 100%; float:none;}
    .rightTDpass {width: 100%; float: none;}
    .PasswordResult {font: 500 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif; margin: 0px; text-align:left; padding: 10px 20px 0px 20px; top:0px; left:0px; }
}

@media only screen and (max-width: 360px){	
.select-security {width:285px !important;}
}

@media only screen and (max-width: 375px){	
.pass-check {left:35%;  }
}

.col { float: none; display: inline-block; }
.col:first-child { margin-left: 0; }	


@media only screen and (max-width: 969px) { /* ipad portait */
.footer-seal img { max-width: 90%; height: auto; }					                         
}

@media only screen and (max-width: 900px) { /* ipad portait */
	.footer-seal img  { max-width: 90%; height: auto; }
	.footer-seal .fix-width { width: 75%; }
	.col { margin: 0% 0 1% 0%; 	}
}

@media only screen and (max-width: 720px) { /* iphone 5 landscape */
	.footer-seal .fix-width { width: 97%; }
	.footer-seal ul li { padding:0 10px; }
}

@media only screen and (max-width: 480px) {	/* iPhone 3+4 landscape · width: 480px */
	a#bbblink { width: 100px !important; height: 45px !important; }
	#bbblink img { width: 200px; height: 45px; }
	a#bbblink img:hover { width: 200px !important; margin-left: -100px !important; }
}

/* forms modification for iphone */
input[type="text"], input[type="number"], textarea, input[type="password"] { font-size:16px; max-width: 100%; width: 100%; padding: 0.9em 0.9em;  box-shadow: 1px 2px 2px #e7e7e7 inset;-moz-box-shadow: 1px 2px 2px #e7e7e7 inset;-webkit-box-shadow: 1px 2px 2px #e7e7e7 inset;-ms-box-shadow: 1px 2px 2px #e7e7e7 inset;}
input[type="submit"] { -webkit-appearance: none; padding-top: 10px; }
input [type="checkbox"] {font-weight:bold; }

.copyright p{font-family:  Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif; font-size:13px; color:#3d3d3d; text-align:center; padding:30px;}

/*language*/

.mobile-language .language-icon, .mobile-language .right {
    font-size: 0;
}

.mobile-language .language-icon {
padding: 16px 27px 7px 7px;
}

.mobile-language .language-icon {
    background: url(https://media.mercola.com/assets/images/hydro-nitro/lang-globe.png) no-repeat;
    color: rgba(255, 255, 255, 0);
}

.mobile-language .right {
    color: rgba(255, 255, 255, 0);
    background: url(https://media.mercola.com/assets/images/hydro-nitro/angle-down.png) no-repeat;
    margin-top: 7px !important;
    width: 12px;
    padding: 4px;
}

.mobile-language .language-options {
    background-color: #f2f2f2;
    border: 1px solid #dedede;
    border-top: 0 !important;
}

.mobile-language .off-canvas-submenu-call {
    text-transform: uppercase;
}

.lang-globe > a:hover {
    color: #000;
}

.lang-dropdown .makelink input{cursor: hand; background-color: transparent;}

.lang-dropdown input:focus, textarea:focus {
  border: none;
  box-shadow: none ;
  width: 100%;
   cursor: hand !important;
}

.lang-dropdown li a:hover {
    text-decoration: underline;
}

.lang-globe {
    display: inline-block;
    right: 0;
    background: white;
    padding: 8.5px 8px;
    border: 1px solid #dedede;
    margin-left:15px;
    font-weight: 500;
    font-family: Roboto;
    font-size: 16px;
    height: 21px;
    width: 70px;
    z-index: 9;
    position: relative !important;
    cursor: pointer;
}

.languagedropdown { height: 40px; padding-left: 22px; border-left: 1px solid #818281; margin-left: 18px; cursor: pointer;}
.lang-globe:hover .lang-dropdown { z-index: 1; opacity: 1;visibility: visible;}
.lang-globe { display: inline-block; position: relative; float: right;}
.lang-globe input {background: none; border:none; font-size:16px; font-weight:bold; cursor:pointer; padding: 10px;}

.lang-globe a { font-size: 16px; text-decoration: none; color: #7f7f7f;}

.lang-globe > a::after { content: url(https://media.mercola.com/assets/images/hydro-nitro/angle-down.png); padding: 0 0 0 8px; }

.lang-globe > a:first-child::before {
    content: url(https://media.mercola.com/assets/images/hydro-nitro/lang-globe.png);
    display: block;
    float: left;
    padding: 0 8px 0 0
}

.lang-dropdown {
    width: 44px;
    padding: 0px 25px;
    display: block;
    top: 100%;
    z-index: -1;
    opacity: 0;
    transition: opacity linear 0.15s;
    background: #fff;
    background-color: rgb(255, 255, 255);
    background-color: rgb(255, 255, 255);
    margin-left: -13px;
    background-color: #f2f2f2;
    border: 1px solid #dedede;
}

.lang-dropdown li {
    list-style-type: none;
    background: none;
    box-shadow: none;
}

.lang-dropdown li a {
    padding: 14px 16px;
    display: block;
    color: #333 !important;
    text-decoration: none;
    font-weight: 500 !important;
    text-align: center;
}
@media screen and (max-width: 820px) {
    .languagedropdown {
        width: 50%;
        border-top: 1px solid #818281;
        border-left: 0 !important;
        padding-left: 0 !important;
        margin: 20px auto !important;
        padding-top: 16px;
        display: block !important;
    }
    
}

@media only screen and (min-width: 989px) and (max-width: 1199px) {
    .lang-globe {
        width: 70px;
    }
}


.HeaderRight{float:right;margin-top:20px;margin-right:30px}
.tollfree span{font-weight:700;font-size:19px}
.loginBtnheader{background-color:#2d353c !important;color:#fff !important;border:1px solid #2d353c !important;border-radius:0 !important;padding:8px 16px !important;text-align:center;font:normal 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;text-decoration:none;display:inline-block;font-size:13px;margin-left:20px;float:right;text-transform:uppercase}
.tollfree a {text-decoration: none;pointer-events: none;}
.lang-dropdown{width:33px;padding:0 21px;display:block;top:100%;z-index:-1;opacity:0;transition:opacity linear .15s;background:#fff;background-color:#fff;background-color:#fff;background-color:#fff;background-color:#f2f2f2;border:1px solid #dedede;margin: 1px 0 0 -7px;
position: absolute;visibility: hidden;}
.lang-globe{display:inline-block;right:0;background:#2d353c !important;padding:9px 6px;border:1px solid #2d353c;margin-left:15px;font-weight:400;font-family:Roboto;font-size:15px;height:16px;width:62px;z-index:9;position:relative!important;cursor:pointer}
.lang-globe a{font-size:14px;text-decoration:none;color:#fff!important}
.lang-globe{font-weight:400;font-family:Roboto;font-size:15px;cursor:pointer}
.lang-globe input{background:none;border:none;font-size:13px;font-weight:700;cursor:pointer;padding:8px}
.lang-globe > a:first-child::before{content:url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_31_423)"><path d="M10.0928 5.45312C9.66797 2.83691 8.66602 1 7.5 1C6.33398 1 5.33203 2.83691 4.90723 5.45312H10.0928ZM4.6875 8.26562C4.6875 8.91602 4.72266 9.54004 4.78418 10.1406H10.2129C10.2744 9.54004 10.3096 8.91602 10.3096 8.26562C10.3096 7.61523 10.2744 6.99121 10.2129 6.39062H4.78418C4.72266 6.99121 4.6875 7.61523 4.6875 8.26562ZM14.2002 5.45312C13.3623 3.46387 11.666 1.92578 9.57129 1.30469C10.2861 2.29492 10.7783 3.78613 11.0361 5.45312H14.2002ZM5.42578 1.30469C3.33398 1.92578 1.63477 3.46387 0.799805 5.45312H3.96387C4.21875 3.78613 4.71094 2.29492 5.42578 1.30469ZM14.5137 6.39062H11.1533C11.2148 7.00586 11.25 7.63574 11.25 8.26562C11.25 8.89551 11.2148 9.52539 11.1533 10.1406H14.5107C14.6719 9.54004 14.7627 8.91602 14.7627 8.26562C14.7627 7.61523 14.6719 6.99121 14.5137 6.39062ZM3.75 8.26562C3.75 7.63574 3.78516 7.00586 3.84668 6.39062H0.486328C0.328125 6.99121 0.234375 7.61523 0.234375 8.26562C0.234375 8.91602 0.328125 9.54004 0.486328 10.1406H3.84375C3.78516 9.52539 3.75 8.89551 3.75 8.26562ZM4.90723 11.0781C5.33203 13.6943 6.33398 15.5312 7.5 15.5312C8.66602 15.5312 9.66797 13.6943 10.0928 11.0781H4.90723ZM9.57422 15.2266C11.666 14.6055 13.3652 13.0674 14.2031 11.0781H11.0391C10.7812 12.7451 10.2891 14.2363 9.57422 15.2266ZM0.799805 11.0781C1.6377 13.0674 3.33398 14.6055 5.42871 15.2266C4.71387 14.2363 4.22168 12.7451 3.96387 11.0781H0.799805Z" fill="white"/></g><defs><clipPath id="clip0_31_423"><rect width="15" height="15" fill="white"/></clipPath></defs></svg>')!important;display:block;float:left;padding:0 8px 0 0}
.lang-globe > a::after{content:url('data:image/svg+xml,<svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.97812 5H12.0187C12.575 5 12.8531 5.67188 12.4594 6.06563L8.44062 10.0875C8.19687 10.3312 7.79999 10.3312 7.55624 10.0875L3.53749 6.06563C3.14374 5.67188 3.42187 5 3.97812 5Z" fill="white"/></svg>');padding:0 0 0 4px}
.lang-globe > a:hover{color:#fff}


#contentdiv{background-color:#fff;margin-top:30px;position:relative;border-radius:25px;border: 1px solid #E0E0E0;}
#content{background-color:#fff;padding:0 26px 10px !important;border-radius:25px}
.formElement{padding-top:10px;position: relative;margin-bottom: 0 !important;}
.formElement.firstName,.formElement.lastName{width:48.5%; padding-top: 0;}
.formElement.firstName{margin-right:8px}
.formElement #ctl00_ContentPlaceHolder1_txtFirstName,.formElement #ctl00_ContentPlaceHolder1_txtLastName{padding:.9em;width:86%}
.formElement.forgotPassword #ctl00_ContentPlaceHolder1_PasswordRecoveryLink {margin: 15px 0 0 5px;display: block;}
.formElement .leftTDpass{width:80% !important;float:left}
.formElement.password .xsmallerText{font-size:12px!important;padding-left:5px}
.formElement .rightTDpass{width:27.5% !important;float:right;height:0;padding-top:3px!important}
.formElement .PasswordResult{font:500 16px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;margin:0;z-index:1;position:relative;top:-19px!important;left:35px!important;font-size:13px!important;right:0}
/*.formElement.password #ctl00_ContentPlaceHolder1_passwordDiv span{display:none}*/
.formElement .hide-show a, .formElement .hide-show a{font:normal 14px Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;color:#8c8c8c!important;text-decoration:none!important;float:none!important;top:18px!important;z-index:2;position:absolute!important;margin:0;padding:0;height:38px;}
.formElement #ctl00_ContentPlaceHolder1_litMobile2 .xsmallerText.gray{font-size:14px!important;padding-left:0px;}
.formElement #ctl00_ContentPlaceHolder1_litMobile2.active .xsmallerText.gray{font-size:10px!important;color:#3784BB;padding-left:2px}
.formElement.birthMonth{width:100%}
.formElement.birthMonth .gift.select-birth-month{font-size:15px}
.formElement.birthMonth #ctl00_ContentPlaceHolder1_ddlMonth{width:99%}
.formElement.birthMonth .select-responsive:focus{box-shadow:none}
.formElement.mobileNumber label .xsmallerText {color: #444;}
.formElement.mobileNumber .xsmallerText {margin-top: 8px;line-height: 1.4;font-size: 12.5px; color: #a0a0a0;}
#JoinContentArea .TermsCondition{border-top:0!important;padding:0px 8px 10px 8px!important;font-size:12px!important;width: 77%; margin: 8px auto 0;}
#JoinContentArea .AlreadyAccnt{border-top:1px solid #E0E0E0!important;font-size:14px!important}
#JoinContentArea .AlreadyAccnt a{font-weight:700}
.footer-seal ul{text-align:center;width:100%;margin:0 auto;padding:0;display:none}
.footer-seal .copyright p{font-family:Arial,"Helvetica Neue",Helvetica,Roboto,sans-serif;font-size:13px;color:#3d3d3d;text-align:center;padding:0 30px 10px}
.formElement.birthMonth .select-responsive { background-image: url('data:image/svg+xml,<svg width="8" height="5" viewBox="0 0 8 5" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 5L0 1.24978L1.33396 0L4 2.50044L6.66604 0L8 1.24978L4 5Z" fill="%23565656"/></svg>');}
#JoinContentArea #ctl00_ContentPlaceHolder1_lblheader {font-size: 14px;color: #404040;}
#JoinContentArea input::-ms-reveal, #JoinContentArea input::-ms-clear {display: none;}
.MainLogBox.es-lang .formElement .leftTDpass{width:84%!important;float:left;margin-left:-7px}
.MainLogBox.es-lang .formElement .leftTDpass span{font-size:12px}
.MainLogBox.es-lang .formElement .rightTDpass{width:36.5%!important;margin-right:-19px;font-size:15px!important;padding-top:4px!important}
.MainLogBox.es-lang .formElement .PasswordResult{font-size:12px!important}
.MainLogBox.es-lang #JoinContentArea .TermsCondition {font-size: 13px !important;width: 80%;margin: 0 auto;}

@media (max-width:640px){
    body {background: #fff;}
    #logo { float:left; margin-left:10px; padding: 10px 0px;  width:150px;}
    #logo img { width:100%;  margin-top:6px;}
    #headerdiv { background: #EEE;}
   .HeaderRight {margin-top: 16px;}
    #ctl00_pnlLanguage .loginBtnheader{display:none}
    div.tollfree {padding-top: 5px !important;}
    div.tollfree a span{visibility:hidden;width:1px;pointer-events:auto;display:inline-block}
    div.tollfree a{pointer-events:auto}
    .MainLogBox{margin-top:0}
    .MainLogBox.es-lang .formElement .leftTDpass {width: 120% !important;}
    .MainLogBox.es-lang .formElement .rightTDpass {width: 100% !important;}
	.MainLogBox.es-lang #JoinContentArea .TermsCondition {width: 100% !important}
    #contentdiv{padding:0!important;margin:0!important;border-radius:0!important;box-shadow:none!important;border: 0 !important;}
    #content{background-color:#fff;padding:0 30px 30px!important;border-radius:0}
    .formElement{float:left;width:90%}
    .formElement.firstName{margin-right:17px}
    .formElement.firstName,.formElement.lastName{width:45.5%}
    .formElement .leftTDpass{width:112%!important;float:left;margin-left:-5px}
    .formElement .rightTDpass{width:100%!important;float:left;height:auto;padding-top:3px!important}
    .formElement .rightTDpass .PasswordResult{top:0!important;left:0!important;text-align:left!important;padding:0!important}
    .formElement .pass-check{right:-3.2rem!important}
    .formElement.birthMonth .gift.select-birth-month{font-size:14px;line-height:1}
    .formElement.birthMonth #ctl00_ContentPlaceHolder1_ddlMonth{width:98%;margin-top:10px}
    #JoinContentArea{padding-top:0}
	#JoinContentArea .AlreadyAccnt {margin-bottom: 0 !important;}
	#JoinContentArea .TermsCondition {width: 100% !important;}
	.footer-seal{background:#fff!important;padding: 0!important;} 
    
}

div.gdpr-container{display: flex;position:fixed;bottom:0;left: 0;background:#F1F2F2!important;z-index:999999!important;padding:7px;width:100%;border-radius:0;margin:0;align-items:center;justify-content:center;height:60px;}
@media only screen and (max-device-width: 640px),only screen and (max-device-width: 667px),only screen and (max-width: 480px)
and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 3) {
div.gdpr-container{bottom:0}
}
.gdpr-container p{font-family:Arial;font-size:13px;font-weight:700;color:#3c3c3c;line-height:18px}
.gdpr-container > p{padding-right:15px;margin:0}
.gdpr-container a{color:#008CBA}
.gdpr-container .close-button p a{padding-bottom:1px;position:absolute;right:20px;color:#353535;width:20px;text-align:center;line-height:20px;font-size:15px;text-transform:lowercase!important;font-weight:700;cursor:pointer;top:50%;transform:translateY(-50%)}
.gdpr-container .agree-button{text-align:center;margin-right: 2.5rem;}
.gdpr-container .agree-button p{padding-bottom:2px;margin:0}
.gdpr-container .agree-button a{color:#fff!important;font-size:13px;background-color:#2369B4;text-align:center;cursor:pointer;text-decoration:none;padding:12px 16px;border-radius:0;font-weight:var(--default-font-weight-semi-bold);float:right;width:75px}
@media (max-width:400px){
.gdpr-container .agree-button a {width: 45px;}
.gdpr-container p {font-size: 12px !important;}
}