﻿
/* START--> New CSS Classes for Newly Desgined Join Page*/
body
{
	background: #b4d2ea url('http://media.mercola.com/assets/images/games/login/vv_mainbg.gif') repeat-x;
	margin: 0;
}

input, textarea {
  background: #EDEDED url('http://media.mercola.com/assets/images/games/login/text-bg.gif') no-repeat scroll 0 0;
  border: 1px solid white;
  color: black;
  font-size: 1em;
  margin: 0.2em 10px 0 0;
  padding: 0.2em 0.2em 0.2em 0.2em;
}

input.checkbox {
  width: 20px !important;
}

select {
  background: #EDEDED url('http://media.mercola.com/assets/images/games/login/text-bg.gif') no-repeat scroll 0 0;
  border: 1px solid white;
  color: black;
  font-size: .85em;
  margin: 0.2em 10px 0 0;
  padding: 0.2em 0.2em 0.2em 0.2em;
}

.MainLogBox
{
	font: normal 14px Arial;
	text-align: center;
	vertical-align: middle;
	height: 100%;
	margin-top: 20px;
}
.MainLogBox a
{
	color: #274eab;
	text-decoration: underline;
}
.MainLogBox a:hover
{
	color: Black;
	text-decoration: none;
}

#LogTopArea
{
	width: 628px;
	margin: 0px auto;
	height: 48px;
	background: url( 'http://media.mercola.com/assets/images/games/login/Login_Top.jpg' ) no-repeat;
}
#LogTopArea .LogTitle
{
	font: normal 22px Arial Narrow, Arial;
	text-align: left;
	margin-top: 20px;
	width: 350px;
	float: left;
	margin-left: 20px;
}
#LogTopArea .LogMenu
{
	margin-top: 28px;
	width: 290px;
	float: right;
	text-align: right;
	margin-right: 18px;
}

#JoinContentArea
{
	width: 628px;
	margin: 0px auto;
	background: url( 'http://media.mercola.com/assets/images/games/login/bg_JoinCS.jpg' );
	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: 262px;
	float: left;
	text-align: left;
	padding-left: 10px;
}
#JoinContentArea .FormAreaFullWidth
{
	text-align: left;
	padding-top: 20px;
	clear: left;
	padding-left: 40px;
}
.smallerText
{
	text-align: left;
	font: normal 12px Arial, Helvetica, sans-serif;
}
.Log_hrLong
{
	background: url( 'http://media.mercola.com/assets/images/games/login/Login_hr.jpg' ) repeat-x;
	height: 2px;
	width: 550px;
	margin-bottom: 5px;
}
.JoinTitle
{
	font: normal 22px Arial Narrow, Arial;
	text-align: left;
	margin-top: 10px;
}
.AvailBtn
{
	background: url( 'http://media.mercola.com/assets/images/games/login/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( 'http://media.mercola.com/assets/images/games/login/Login_hr.jpg' ) no-repeat;
	height: 2px;
	width: 260px;
	margin-bottom: 10px;
}
.ErrorMsg
{
	color: Red;
	margin: 10px 0px;
}
.LogBox
{
	background-color: Transparent;
	height: 34px;
	width: 240px;
	border: 0px;
	padding-left: 10px;
	font: normal 16px Arial;
}
.LogTextBox
{
	background: url( 'http://media.mercola.com/assets/images/games/login/SignIn_txtbox.jpg' ) no-repeat;
	height: 34px;
	width: 260px;
	padding-top: 7px;
	margin-top: 3px;
}
.ContinueBtn
{
	background: url( 'http://media.mercola.com/assets/images/games/login/btn-continue.gif' ) no-repeat;
	height: 41px;
	width: 144px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
}
.LogBtn
{
	background: url( 'http://media.mercola.com/assets/images/games/login/SignIn_Btn.jpg' ) no-repeat;
	height: 41px;
	width: 147px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
}
.SignUpBtn
{
	background: url( 'http://media.mercola.com/assets/images/games/login/JoinNow_Btn.jpg' ) no-repeat;
	height: 30px;
	width: 126px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
}
.ChangeBtn
{
    background: url("images/changepassword-Btn.jpg") no-repeat scroll 0 0 transparent;
    border: 0 none;
    cursor: pointer;
    height: 30px;
    width: 126px;

}
.RetrieveBtn
{
    background: url("images/retrieve-Btn.jpg") no-repeat scroll 0 0 transparent;
    border: 0 none;
    cursor: pointer;
    height: 30px;
    width: 126px;

}
.CancelBtn
{
	background: url( 'http://media.mercola.com/assets/images/games/login/Cancel_Btn.jpg' ) no-repeat;
	height: 30px;
	width: 100px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
}

.clearLeft
{
	clear: both;
}

#LogFooterArea
{
	width: 628px;
	margin: 0px auto;
	clear: both;
}
#LogFooterArea .LogFooterImg
{
	width: 628px;
	margin: 0px auto;
	height: 31px;
	background: url( 'http://media.mercola.com/assets/images/games/login/Login_Bot.png' );
}
#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( 'http://media.mercola.com/assets/images/games/login/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( 'http://media.mercola.com/assets/images/games/login/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;
}

.ContinueBtn
{
	background: url( 'http://media.mercola.com/assets/images/games/login/continue_Btn.jpg' ) no-repeat;
	height: 44px;
	width: 149px;
	border: 0px;
	cursor: pointer;
	cursor: hand;
	font: bold 12px Arial;
	color: #FFFFFF;
	margin-left: -3px;
}

.RightWidth
{
	width: 258px;
}
.TableForms
{
	margin-left: 15px;
}
/* END--> New CSS Classes for Newly Desgined Join Page*/

.SigninError
{
	height: 20px;
	font-size: 11px;
	color: Red;
	font-family: Verdana;
}
.cssPanelErrorMessage
{
	border: 1px solid black;
	background-color: #FFFF99;
	padding: 3px;
}

.validationFailure
{
	color: Red;
	font-family: Verdana;
	font-size: 12px;
	height: 25px;
	vertical-align: bottom;
}
.textBoxes
{
	width: 250px;
	height: 15px;
}
.leftTD
{
	text-align: right;
    padding: 0.8em 0.2em 0.2em 0.2em;
	vertical-align: top;
	width:200px;
}
.rightTD
{
	width: 350px;
	text-align: left;
}
.xsmallerText
{
	font-size: x-small;
}
.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: 14px/24px Arial;
        }
        #overlayProfile
        {
            position: absolute;
            left: 60%;
            border: 1px solid #000000;
            top: 50%;
            margin-left: -410px;
            margin-top: -210px;
            z-index: 102;
            padding: 0;
        }
        #overlaybaseProfile
        {
            z-index: 101;
            background-color: #476685;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        .tdContentsProfile
        {
            padding-top: 50px;
        }
        .styleProfile
        {
            padding-top: 5px;
            padding-left: 30px;
            padding-right: 30px;            
        }
        .styleProfileTitle 
        {
        	font-size:xx-large;
        	font-family:Sans-Serif;
        	padding:10px 15px 0 15px;
        }
        
        /**** logout styles ****/
#signIn_holder { background:#eef3fa; margin:18px; padding:0; }
.signInBoxContent_m { background:#d5eafc url('http://media.mercola.com/assets/images/games/login/signInBoxContent_m.jpg') 0 0 repeat-x; width:100%; }
.signInBoxContent_l { background: url('http://media.mercola.com/assets/images/games/login/signInBoxContent_m.jpg') 0 0 no-repeat;}
.signInBoxContent_r { background: url('http://media.mercola.com/assets/images/games/login/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('http://media.mercola.com/assets/images/games/login/logout_b.gif') 0 0 repeat-x; height:15px; width:100%; }
.signInBoxContent_bl2 { background:url('http://media.mercola.com/assets/images/games/login/logout_bl.gif') 0 0 no-repeat; height:15px;}
.signInBoxContent_br2 { background:url('http://media.mercola.com/assets/images/games/login/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: 5px 0px;
 padding: 15px;
 border-top: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;
 /*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;

}