﻿/************************************
 * GLOBAL STYLES
 ***********************************/
html, body 
{
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}

body 
{
    background-color: #FF6C04;
    background-image: url(../images/body_bg.jpg);
    background-position: top;
    background-repeat: repeat-x;
    font-family: Verdana, Arial, Sans-Serif;
    font-size: 13px;
    color: #BB252C;
}

a 
{
    color: #BB252C;
    text-decoration: none;  
}

a:hover
{
    text-decoration: underline;
}

h1
{
    font-size: 18px;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 5px;
}

h2
{
    font-size: 13px;
    font-weight: bold;
    margin-top: 2px;
    margin-bottom: 5px;
    display: inline;
}

h3
{
    margin-top: 5px;
    margin-bottom: 3px;
    display: inline;
}

h1 span, h2 span
{
    display: none;
}

p
{
    margin-top: 5px;
    margin-bottom: 5px;
}

label
{
    color: #F00009;
}

img
{
    border: 0;
}

#wrapper
{
    width: 835px;
    margin: 0 auto;
    padding: 0 132px 0 133px;
}

.note
{
    color: #D7786A;
    font-size:10px;
    font-weight: normal;
}

.small-font
{
    font-size: 10px;
}

.left
{
    float: left;
}

.right
{
    float: right;
}

.button-img
{
    margin-bottom: -2px;
}

.category-title
{
    font-weight: bold;
    padding-bottom: 5px;
    padding-top: 18px;
}

.game-description-text
{
    font-size: 10px;
    width: 87px;
}

/************************************
 * HEADER and FOOTER
 ***********************************/
#header 
{
    height: 63px;
}

#header img
{
    border: 0;
    float: left;
}

#header-links-list
{
    margin: 7px 10px 0 0;
}

#header-links-list a
{
    font-size: 10px;
}

#header ul, #footer ul
{
    float: right;
    padding: 0;
}

#header li, #footer li
{
    float: left;
    list-style-type:none;
    margin: 0;
    padding: 0 2px 0 2px;
    position: relative;
}

#header label
{
    font-size: 10px;
    color: #B0040B;
}

#sign-up-panel
{
    padding-left: 5px;
    padding-bottom: 7px;
}

#graph-link 
{
    padding-left: 9px;
    margin-top: -16px;
}

.padded-link-button 
{
    padding-right: 18px;
    background-image: url(../images/btn_link.gif);
    background-repeat: no-repeat;
    background-position: right 6px;
}

.achievements-header-links 
{
    width: 129px;
    height: 24px;
    padding-right: 3px;
    background-image: url(../images/header_link_bg.gif);
    background-repeat: no-repeat;
    background-position: top center;
}

.achievements-header-links a
{
    padding-top: 5px;
    float: right;
}

.horizontal-login-form
{
    height: 30px;
    margin-right: 7px;
    float: right;
    background-image: url(../images/login_bg.gif);
    background-repeat: no-repeat;
    background-position: bottom right;
    position: relative;
    bottom: -2px;
}

.login-form-wrapper
{
    padding-left: 9px;
    display: block;
}

.email-box
{
    float:left;
    border:1px solid #D1D1D1;
    width: 90px;
    height: 14px;
    color: #B5151B;
    font-size: 10px;
}

.password-box
{
    float:left;
    border-left: 1px solid #D1D1D1;
    border-top: 1px solid #D1D1D1;
    border-bottom: 1px solid #D1D1D1;
    border-right: 0;
    margin-left: 2px;
    width: 80px;
    height: 14px;
    color: #B5151B;
    font-size: 10px;
}

.login-label
{
    line-height:17px;
    float: left;
    font-size: 10px;
    color: #B0040B;
}

#footer-links-1
{
    margin:20px 0 3px 0;
}

#footer-links-2
{
    margin: 0;
}

#footer
{
    position: relative;
    top: -160px;
    margin-left: auto;
    margin-right: auto;
    width: 1100px;
    font-size: 11px;
    font-weight: bold;
    height: 175px;    
    clear: both;
    margin-bottom: 50px;
}

#lipton-logo-2
{
    height: 97px;
    float: left;
    width: 100%;
    background-image: url(../images/lipton_logo_2_bg.jpg);
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: -2px;
}

#lipton-logo-2-link
{
    width:443px;
    height: 72px;
    display: block;
    position: relative;
    left: 20px;
    top: 25px;
}

#theanine-callout
{
    background-image: url(../images/theanine-callout.gif);
    background-repeat: no-repeat;
    background-position: center;
    width: 1100px;
    height: 87px;
    float: left;
    margin: 0 auto 15px auto;
}


/************************************
 * PERFORMANCE
 ***********************************/
#performance
{
    height: 90px;
}

#performance h2, #performance h3
{
    margin-top: 2px;
    margin-bottom: 2px;
}

#score-module
{
    width: 286px;
    height: 78px;
    float: left;
    padding: 5px 10px 5px 15px;
    background-image: url(../images/score_container.gif);
    background-repeat: no-repeat;
}

#score-module p
{
    margin-bottom: 2px;
    margin-top: 1px;
}

#view-progress-img
{
    margin: 2px 0 0 0;
}

.rank-label
{
    margin-bottom: 5px;
}

#achievements
{
    width: 493px;
    height: 78px;
    float: left;
    padding: 5px 10px 5px 15px;
    background-image: url(../images/achievements_container.gif);
    background-position: top center;
    background-repeat: no-repeat;
}

#achievements h2
{
    width: 167px;
    float: left;
}

#achievements h3
{
    width: 175px;
    float: left;
}

#stars
{
    width: 355px;
    display: inline;
}

#achievements-panel
{
    width: 130px;
    margin-left: 7px;
    display: inline;
    font-size: 11px;
}

#achievements-signup
{
    margin: 0;
}

#achievements-panel h2
{
    margin-bottom: 3px;
}

#achievements #stars table
{
    margin-top: 3px;
}

#achievements #stars td
{
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 1px;
    padding-right: 1px;
}


/************************************
 * MAIN BODY STYLES
 ***********************************/
#container-main
{
    height: 390px;
    width: 820px;
    margin-top: -2px;
    padding: 8px 5px 5px 10px;
    background-image: url(../images/a-feature_container.gif);
    background-repeat: no-repeat;
}

#a-feature
{
    width: 546px;
    height: 380px;
    float: left;
}

#a-feature-promos
{
    width: 265px;
    height: 380px;
    float: left;
}

#container-secondary
{
    float: left;
}

#container-secondary h1
{
    float: left;
    padding: 0;
}

#container-secondary .column-one
{
    float: left;
    width: 220px;
}

#container-secondary .column-two
{
    float: left;
    width: 580px;
    margin-left: 12px;
    display: inline;
}

#train-brain-title
{
    background-image: url(../images/hdr_train-your-brain.gif);
    background-repeat: no-repeat;
    margin: 0;
    width: 176px;
    height: 20px;
}

#just-for-fun
{
    background-image: url(../images/hdr_other-games.gif);
    background-repeat: no-repeat;
    width: 133px;
    height: 20px;
    margin: 0 0 0 50px;
}

#main-body table tr td
{
    vertical-align: top;
}

#main-body table 
{
    margin-bottom: 10px;
}

.centered
{
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.text-centered
{
    text-align: center;
}

.container-top
{
    width: 830px;
    height: 8px;
    background-image: url(../images/container-top.gif);
    background-repeat: no-repeat;
}

.container-body
{
    padding: 0 0 5px 10px;
    background-image: url(../images/container_body_bg.gif);
    background-repeat: repeat-y;
    float: left;
    width: 830px;
}

.main-body
{
    width: 815px;
    position: relative;
    z-index: 9;
    float: left;
}

.bottom-wrapper
{
    width: 1100px;
    margin: 0 auto;
    position: relative;
    top: -150px;
    z-index: 3;
    height: 190px;
}

.container-bottom
{
    width: 1096px;
    height: 190px;
    margin-left: 8px;
    background-image: url(../images/container-bottom.jpg);
    background-repeat: no-repeat;
    float: left;
}

.spacer
{
    clear: both;
}

.container-thumbs
{
    border: 1px solid #ffe14b;
    padding: 1px;
    width: 87px;
    height: 50px;
}

#ctl00_ContentPlaceHolder1_ThirtySecPuzzlesThumbs_lblCategoryName
{
    padding-top: 6px;
}

/************************************
 * TWO-COLUMN STYLES
 ***********************************/
#two-column-content
{
	float: left;
	width: 830px;
}

#two-column-content .column-one
{
	width:512px;
	float:left;
	padding: 15px 15px 20px 30px;
}

.games-description p.intro 
{
    font-size: 13px;
    margin-top: 25px;
}
.games-description p
{
    font-size: 11px;
    line-height: 16px;
    margin-bottom: 15px;
}

.games-description a
{
    text-decoration: underline;
}

.games-description .indented-list a
{
    text-decoration: underline;
    margin-left: 15px;
}

#two-column-content .column-two
{
	width:273px;
	float:left;
}

#two-column-main
{
    background-image: url(../images/container_body_bg.gif);
    background-repeat: repeat-y;
	width: 830px;
	float: left;
}

#two-column-content-wrapper
{
	background-image: url(../images/container_main_two_column.gif);
	background-repeat: no-repeat;
	background-position: top;
    width: 830px;
    height: auto;
    float: left;
    position: relative;
    z-index: 8;
	min-height:500px;
} /* ie6.css */

.two-column-container-top
{
    width: 830px;
    height: 8px;
    background-image: url(../images/container_top_two_column.gif);
    background-repeat: no-repeat;
}

.two-column-header
{
    font-size: 17px
}

/* Rounded square */
/* set millions of background images */
.rbroundbox { background: url(../images/corners/nt.gif) repeat; }
.rbtop div { background: url(../images/corners/tl.gif) no-repeat top left; }
.rbtop { background: url(../images/corners/tr.gif) no-repeat top right; }
.rbbot div { background: url(../images/corners/bl.gif) no-repeat bottom left; }
.rbbot { background: url(../images/corners/br.gif) no-repeat bottom right; }

/* height and width stuff, width not really nessisary. */
.rbtop div, .rbtop, .rbbot div, .rbbot {
width: 100%;
height: 7px;
font-size: 1px;
}
.rbcontent { margin: 0 7px; }
.rbroundbox { width: 100%; margin: 1em auto; }
/* Rounded square - END */

/* link list, used by games descriptions and faqs */
.two-column-section-llist-items
{
    font-size:11px;
    color: #B0040B;	 
    margin-bottom: 2em;   
}
.two-column-section-llist-items #ul
{
    list-style-type: none;
    position: relative;
    margin:5px 10px;
    padding:0;
    
    
}
.two-column-section-llist-items #ul li 
{
	padding: 0.2em 0;
	
}
.two-column-section-llist-items #ul.games li 
{
	padding: 0.5em 0;
	border-bottom: solid 1px #F0E5CC;
}
.two-column-section-llist-items #ul.games li.last
{
	border:0;
}
#two-column-section-llist-content
{
    font-size:11px;
}
.two-column-section-llist-header
{
   float: left;
   color: #B0040B;
   padding-bottom: 5px;
   width: 420px;
   
}
.two-column-section-llist-header a:hover {text-decoration:none}
.two-column-section-llist-link
{
   float: right;
   width: 85px;
   color: #B0040B;
   padding-bottom: 5px;
   text-align: right;
}
.two-column-section-llist
{
    float: left;
    width: 100%;
    color: #5a5a5a;	
    padding: 5 5 5 5;
    margin-bottom: 20px;
    text-align: justify;
}

ol.tea-facts 
{
    font-size: 11px;
}
ol.tea-facts li 
{
    margin-bottom: 15px;
    line-height: 1.1em;
}
ol.tea-facts li a 
{  
    text-decoration:underline;
}
ol.tea-facts span 
{
    font-size: 10px;
    font-style: italic;
    color: #5A5A5A;
}
ol.tea-facts span a 
{
    color: #5A5A5A;
}
dl.puzzles_answers dt 
{
    float:left;
    width: 70px;
    clear:left;
    margin-bottom: 1.5em;
}

dl.puzzles_answers dd
{
    float:left; 
    width: 150px;
    margin:0 0 1.5em 10px;
}
dl.puzzles_answers dd.question
{
    width: 200px;
}
/************************************
 * OTHER STYLES
 ***********************************/
.game-column 
{
	float: left;
	margin-right: 6px;
}

/************************************
 * FORMS STYLES
 ***********************************/

.styledFormTop	{
	display:block;
	background: transparent url(../images/formTop.gif) 0 bottom no-repeat;
	width:510px;
	height:4px;
}

.styledFormBottom	{
	display:block;
	background: transparent url(../images/formBottom.gif) 0 0 no-repeat;
	width:510px;
	height:4px;
	margin-bottom: 10px;
}

.styledForm {  
	padding:0 10px 0 10px;
	width:490px;
	background-color: #fdf1d7; 
}

.styledForm fieldset {  
	float: left;  
	clear: both;  
	width: 100%;  
	margin: 0;  
	padding: 10px 0 10px 0;  
	border-style: none;  
	border-bottom: 1px solid #BFBAB0;  
	background-color: #fdf1d7; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:95%;
}

.styledForm fieldset ol {  
	padding:0;  
	margin:0;
	list-style: none;
}

.styledForm fieldset li {  
	float: left;  
	clear: left;  
	width: 100%;  
	padding-bottom: .5em; 
	padding-top:.5em;
	border-bottom:1px solid #f0e5cc;
	font-size:.9em;
}

.styledForm fieldset.last, .styledForm fieldset li.last {  
	border-bottom:none;
}

.styledForm .formSection {
	border-bottom: solid 1px #BFBAB0;
	padding: 0.5em 0;
	font-size: 95%;
	clear:both;
}
.styledForm .formSection p 
{
	font-size: 0.9em;
}
.styledForm .formSection.formButtons
{
	border:0;
	padding: 15px 0;
}

.styledForm fieldset li input.txt, .styledForm fieldset li select {  
	border:1px solid #d3d3d1;
	padding:2px;
	font-size:1em;
}

.styledForm fieldset li textarea {
	border:1px solid #d3d3d1;
	padding:2px;
	font-size:1em;
	display:block;
	clear:left;
	width: 429px;
	height: 125px;
}

.styledForm fieldset li input.txt	{
	width:269px;
}

.styledForm fieldset li select.txt {
	width: 275px;
	border: solid 1px #d3d3d1;
}

.styledForm fieldset li input.daytimePhone	{
	border:1px solid #d3d3d1;
	width:230px;
	padding:2px;
	font-size:1em;
} /* ie6.css */

.styledForm fieldset.submit {  
	border-style: none;
}

.styledForm label {  
	display: block;
	float: left;  
	width: 145px;  
	margin-top:2px;
	margin-right: 15px; 
	color:#b0040b;
	font-size:1em;
}
.styledForm label.forTextarea 
{	
	display:block;
	padding-bottom: 10px;
}

.styledForm .RegisterGender label	{
	float: none;  
	width: auto;  
	margin-right: auto; 
	font-size:1em;
	display:inline;
	color:#000;
	font-weight:normal;
}

.styledForm .longLabel label {  
	display: block;
	float: left;  
	width: 29em;  
	margin-top:2px;
	margin-right: 1em; 
	color:#b0040b;
	font-size:1em;
}

.styledForm .challengeFriend label {  
	width: 7em;  
}

.styledForm .challengeFriend .ErrorMessage {  
	color: #ff0000; 
	padding-left: 95px;
	
}


.styledForm li.textArea label	{
	float:none;
	margin-bottom:5px;
}

.styledForm li.textArea textarea	{
	display:block;
	width:474px;
	height:124px;
	border:1px solid #d3d3d1;
	padding:2px;
	font-size:1em;
}

.styledForm .termsLong .checkbox {  
	display: block;
	float: left;  
	width: 13px;  
	margin-right: 1em; 
}

.styledPanel {
	padding:10px;
	width:490px;
	background-color: #fdf1d7; 
}

.styledPanel .panel1 {
	width: 190px;
	border-right: solid 1px #ded3bc;
	padding: 0 50px 10px 0;
	margin-right: 20px;
	float:left;
} 
.styledPanel .panel2 {
	width: 180px;
	float:left;
}
.styledPanel p {
	font-size: 0.85em;
	color: #5a5a5a;
} 

/*
.styledForm fieldset li select.formStates	{
	width:100px;
}

.styledForm fieldset li.formDouble	{
	position:relative;
}

.styledForm fieldset li .postCodeContainer	{
	display:block;
	position:absolute;
	top:7px;
	left:300px;
}

.styledForm fieldset li .postCodeContainer label	{
	width: 6em;
}

.styledForm fieldset li .postCodeContainer input	{
	width: 20px;
}
*/
.orange,
.mandatory	{
	color:#ff6c04;
}

.intro	{
	color:#5a5a5a;
	margin-bottom:20px;
	font-size: 0.85em;
}
.styledPanel .contactPhoneNumber {
	font-size: 1.1em;
	color: #BB252C;
}
.styledPanel .contactAddress {
	color: #BB252C;
}

/*********************** START FORGOT PASSWORD ***********************/
.forgotpassword p {
	padding-top:5px;
	padding-bottom:5px;
	color:#5a5a5a;
	font-size:11px;
}
.forgotpassword  label {  
	display: block;
	float: left;  
	width: 5em;  
	margin-top:2px;
	margin-right: 1em; 
	color:#b0040b;
	font-size:1em;
}
.forgotpassword .styledForm  fieldset legend{	
	display:none;
}
.forgotpassword .ErrorMessage {
	font-size:11px;	
}

.forgotpassword li.last {
	padding-top:13px;
	padding-bottom:1px;
}
.forgotpassword .txt {
	margin-bottom:10px;
}
/*********************** END FORGOT PASSWORD ************************/

/*********************** START SITEMAP ******************************/
.sitemap ul 
{
	margin:0px;
	padding:0px;
}

.sitemap li span.last
{
	border-width:0px;
	margin-bottom:8px;
}

.sitemap ul.first
{
	padding-top:5px;
}

.sitemap li 
{	
	list-style-type:none;

	font-weight:bold;
	font-size:11px;
}

.sitemap ul li span 
{
	padding-left:5px;
	border-bottom:1px solid #f0e5cc;
	display:block;
	padding-bottom:3px;
	padding-top:3px;
	width:480px;/* width for IE6 */
}

.sitemap ul li ul li span 
{
	padding-left:40px;
	width:445px;/* width for IE6 */
}

.sitemap ul li ul li ul li span 
{
	padding-left:80px;
	width:405px;/* width for IE6 */
}

.sitemap ul li ul li
{
	font-weight:normal;
}

.sitemap ul li ul li a:link {color:#656462}
.sitemap ul li ul li a:hover {color:#656462;}
.sitemap ul li ul li a:visited {color:#656462}

/*********************** END SITEMAP ********************************/

.styledForm fieldset li input.captchaCode {
	border:1px solid #d3d3d1;
	width:120px;
	padding:2px;
	font-size:1em;
	margin-left:20px;	
} 

/*
.clear,
#wrapper,
.bottom-wrapper,
.two-column-top
.two-column-content-wrapper,
.styledForm {
	display:inline-block;
}
*/
.clear:after, 
#wrapper:after, 
.bottom-wrapper:after,
.two-column-top:after, 
.two-column-content-wrapper:after,
.styledForm:after,
.centered:after	{
	display: block; 
	visibility: hidden; 
	clear: both; 
	height: 0; 
	content: ".";
}
