/*-----------------------------------------
CSS Style Notes:

>PAGECONTAINER
	I. 	Header
			A. Headgraphic
			B. Navbar
	II.	Middlearea
			A. NavMenu (Article List for Subcategory)
			B. MainContent
				1. PrimaryArt
				2. SecondaryArt
			C. Sidebar (Optin Section for Email Minicourse, Ad for Ebook)
	III.Footer
			A. Footergraphic
			B. Footerinfo
			
Colors:
524138	brown
8fbe00	green
------------------------------------------*/

/*---- RESET ----*/
/* 
=======================
RESET
======================= */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/*------------------*/


body {
	background: url(../images/pageback.jpg);
	}



/*--- ENTIRE PAGE ---*/
#pagecontainer {
	width: 							880px;
	margin:							0px auto;
	padding-top:					1px;					/*bug?*/
	display:							block;
	background-color:   		#524138;  		/*brown*/
	vertical-align: 				top;
	border-bottom:				2px #413027 solid;
	border-right:					2px #413027 solid;
	} 



	
/*HEADER ---------------------------------------------*/
#header {
	width:								auto;
	margin:								10px 10px 0px 10px;
	background-color:				#ddd;
	display:								block;
	}

#headgraphic {
	width:								auto;
	height:								179px;
	margin:								0;
	display:								block;
	background:						url(../images/loseweightwithtea_header.jpg) #8fbe00;
	}

#navbar	{
	width:								auto;
	height:								30px;
	background:						#8fbe00; 
	padding: 	                        0 10px;
}
	

#navbar a {
	color: white;
	height: 30px;
	line-height: 30px;
	float: left;
	display: block;
	background:	url(../images/lwwt_rightnav.png) right top no-repeat #524138;
	color: white;
	font-family:"Times New Roman", Times, serif;
	font-size: 9px;
	text-transform: uppercase;
	text-decoration: none;
	padding-right: 10px;
	margin-right: 3px;
	}

#navbar  a span	 {
	font-size: 9px;	
	height: 30px;
	line-height: 30px;
	display: block;
	padding-left: 10px;
	background: url(../images/lwwt_leftnav.png) left top no-repeat #524138;
	}
	
#navbar a:hover {
	font-size: 9px;
	background:url(../images/lwwt_rightnav_act.png) right top no-repeat #e9dbcf;
	height:30px;
	display:block;
	color: #524138;
	padding-right: 10px;
	}

#navbar a:hover span {
	background:url(../images/lwwt_leftnav_act.png) left top no-repeat #e9dbcf;
	height:30px;
	padding-left:10px;
	}


#navbar a.active {
	height: 30px;
	line-height: 30px;
	background: url(../images/lwwt_rightnav_act.png) right top no-repeat #e9dbcf;
	padding-right: 10px;
	color: #524138;
	}

#navbar a.active span {
	background:url(../images/lwwt_leftnav_act.png) left top no-repeat #e9dbcf;
	height:30px;
	display:block;
	padding-left:10px;
	}

/*-----------------------------------------------------*/

/*MIDDLEAREA -----------------------------------------*/
#middlearea {
    width:							auto;	/*width of whole page */
	position:						relative;		/*This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:								both;
	overflow:						hidden;
	background:					url(../images/lwwt_midback.jpg) #ccc repeat-y;
	margin-left:					10px;
	margin-right:					10px;

		}

#navmenu {
	width: 							150px;
	float:								left;
	margin-left:					10px;
	background:					transparent;
	padding:	                    10px 10px 10px 10px;
	}

#maincontent {
	width:							470px;
	float:								left;
	display:							inline;
	margin-left:					0px;
	background-color:			#f1ebe7;
	padding:	                    10px;
/*	border-bottom: #bdb1a7 1px solid;	  */ 
	}

#sidebar {
	width: 							160px;
	float:								right;
	display:							block;
	margin-right:					10px;
	background-color:			transparent;
	padding:	                    0px 10px 10px 10px;
	}
	

/* FOOTER ----------------------------------------------------*/
#footer {
	width:							auto;
	margin-left:					10px;
	margin-right:					10px;
	margin-bottom:				10px;
	}

#footergraphic {
	width:							auto;
	height:							43px;
	background:					url(../images/loseweightwithtea_footer.jpg) #524138;
	}

#footerinfo {
	width:							auto;
	height:							25px;
	display: block;
	}

#footerinfo a {
	margin: 1px;
	color: white;
	height: 25px;
	line-height: 25px;
	display: inline;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 8px;
	text-transform: uppercase;
	text-decoration: none;
	padding-right: 5px;
	padding-left: 5px;
	border: 1px #8fbe00 dotted;
}

#footerinfo a:hover  {
	border: 1px #8fbe00 dotted;
	color: #8fbe00;
	background: #654c45;
	}


/* LEFT COLUMN DESIGN STYLES ------------------*/	
#navmenu {
	font-family: Georgia, "Times New Roman", Times, serif;
	color:  #413027;	
	}
#navmenu h1 {
	font-size: 14pt;;
	}

#navmenu h2 {
	font-size: 12pt;;
	}

#navmenu h3 {  /* for article list header */
	font-size: 8pt;
	font-weight: normal;
	line-height: 25px;
	padding-left: 4px;
	background:	url(../images/lwwt_menuback1.png) darkkhaki;
	}

#navmenu p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8.5pt;
	padding-top: 5px;
	padding-bottom: 5px;
	}

#navmenu ul {
	font-family:  Verdana, Arial, sans-serif;
	font-size: 9px;
	margin: 5px 0;
	list-style: none;
	border-bottom: 1px #d3c4b9 solid;
	display: block;	
	}

#navmenu li {
	display: block;
	border-top: 1px #d3c4b9 solid;
	}

#navmenu li.new {
	background: url(../images/new.gif) center right no-repeat;
	padding-right: 46px;
}

#navmenu a {
	text-decoration: none;
	color:  #413027;	
	display: block;
	padding: 7px 2px;

	height: auto;
	line-height: 1.2em;
	}

#navmenu  a:hover {
	color: #729800;
	}

#navmenu  a.active {
	color: #729800;
	display: block;
	}

/* MIDDLE COLUMN DESIGN STYLES ------------------*/	
#maincontent {    /* default font settings */
	font-family:  Georgia, "Times New Roman", Times, serif;
	color:  #413027;
	font-size:	8pt;
	}

#maincontent h1 {
	color:  #654c45;
	font-size:  11pt;;
	font-weight: normal;
	text-transform:  capitalize;
	border-bottom: 1px #654c45 dotted;
	border-top: 1px #654c45 dotted;
	margin-bottom: 10px;
	margin-top: 10px;
	padding-bottom: 10px;
	padding-top: 10px;
	}

#maincontent h2 {
	color: #8fbe00;
	font-size:  10pt;
	font-weight: normal;
	margin-left:  5px;
	margin-right:  5px;
	margin-top:20px;
	margin-bottom: 5px;
	}

#maincontent h3 {
	color: #729800;
	font-size: 9pt;
	font-style:  italic;
	font-weight: normal;
	margin-left:  5px;
	margin-right:  5px;
	margin-top: 2px;
	margin-bottom: 5px;
	}
	
#maincontent h4 {
	color: #729800;
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size:	8pt;
	margin-left:  5px;
	margin-right:  5px;
	margin-top: 2px;
	margin-bottom: 5px;
	}

#maincontent p {
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	margin-left:  5px;
	margin-right:  5px;
	margin-top: 5px;
	margin-bottom: 10px;
	line-height: 1.25em;
	}

#maincontent .highlight {
	color: #729800;
	font-weight: bold;
	}
	
#maincontent p.paraindent {
	margin-left:  25px;
	margin-right:  25px;
	margin-top: 5px;
	margin-bottom: 10px;
	}

#maincontent ul {
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size:	8pt;	
	margin-left:  45px;
	margin-right:  45px;
	margin-top: 5px;
	margin-bottom: 15px;
	list-style-image: url(../images/tea_icon.gif);
	line-height: 1.25em;
	}
	
#maincontent li {
	margin: 10px 0;
}

#maincontent ol {
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size:	8pt;	
	margin-left:  45px;
	margin-right:  45px;
	margin-top: 5px;
	margin-bottom: 10px;
	line-height: 1.25em;
	}

#maincontent a {
	text-decoration: none;
	color: #8fbe00;
	padding: 1px;
	}

#maincontent a:hover  {
	display: inline;
	padding: 1px;
	color: #FC0;
	}


#maincontent div.optin h1{
	font: bold 18pt Tahoma, Georgia, "Times New Roman", Times, serif;
	border: 0;
	line-height: 1.5em;
	font-weight: bold;
	color: #5A3F2E;
	margin-left: 15px;
	}
	
#maincontent div.optin p{
	color: #590;
	margin-left: 15px;
	}


/* RIGHT COLUMN DESIGN STYLES ------------------*/	
#sidebar {
	color: #654c45;
	font-size: 8pt;
	}

#sidebar h1 {
	font-size: 16pt;
	}

#sidebar h2 {
	font-size: 13pt;
	text-align: center;
	color: green;
	}

#sidebar h3 {
	font-family:  Arial, Helvetica, sans-serif;
	color:#590;
	font-size: 12pt;
	padding: 2px 2px 10px 2px;
	text-align: center;
	}
	
#sidebar p {
	color: #590;
	font-family:  Verdana, Geneva, sans-serif;
	padding-top: 5px;
	padding-bottom: 5px;
	line-height: 1.5em;
	}

#sidebar ul{
	font-size:	9pt;	
	margin-left:  20px;
	margin-right:  10px;
	margin-top: 5px;
	margin-bottom: 5px;
	list-style-image: url(../images/tea_icon_top.png);
	line-height: 16px;
	}
	
#sidebar a {
	text-decoration:none;
	}

#side-ads {
	background: #B8C750;
	padding: 10px;
	margin: 10px 0;
}

#side-ads h1 {
	font-weight: bold;
	color: black;
	margin-bottom: 5px;
	font-size: 18pt;
	}

#side-ads h2 {
	font-family:  Verdana, Geneva, sans-serif;
	font-weight: bold;
	font-size: 18px;
	text-transform: uppercase;
	color: yellow;
	margin-bottom: 5px;
	text-decoration: blink;
	border: 1px white dashed;
	padding: 4px;
}

#side-ads a {
	color: white;
	}
	
#side-ads h3 {
	font-size: 10px;
	font-family: Verdana, Geneva, sans-serif;
	text-transform: uppercase;
	font-weight: bold;
	}

/*ETC DESIGN ----------------------------------------*/
div.spacer {
	clear:both; 
	height:10px; 
	display:block;
	background: #e9dbcf;
	margin-left:	10px;
	margin-right: 10px;
	}
	
div.optin {
	background:  url(../images/lwwt_sidebarback.jpg) top right#fdfac3 no-repeat;
	padding: 5px;
	border-top: 1px white solid;
	border-left: 1px #FFd solid;
	border-bottom: 1px #999 solid;
	border-right: 1px #CCC solid;
	}


.clause {
	font-size: 8px;
	text-transform: uppercase;
	padding: 3px;
	}

.emphasis {
	font-weight: bold;
	font-size: 1.1em;
	}

.free {
	padding: 0px 3px 1px 3px;
	background-color: #09F;
	color: yellow;
	font-weight: bold;
	text-decoration:blink;
	text-transform: uppercase;
	border: 1px yellow dotted;
	}

.embossdown	{	
margin: 0;
margin-bottom: 8px;
padding: 3px;
	font-size: 13px;
	height: 16px;
	line-height: 22px;
	width:	95%;
	vertical-align: middle;
	border-top:		1px #ccc solid;
	border-bottom:	1px #eee solid;
	border-left:	1px #aaa solid;
	border-right:	1px	#fff solid;
	clear: both;
				}

.glossybutton {
	color: white;
	border: 0;
	margin-top: 7px;
	margin-bottom: 10px;
	width: 100px;
	height: 28px;
	font-size: 9px;
	text-transform: uppercase;
	background: url(../images/button_back.gif);
	cursor: pointer;
  }
  
hr  {
   border-top: 1px #c9a solid;
   border-bottom: 1px white solid;
  }
  
  
.rating_bar {
  width: 64px;
  background: url(../images/rating_nostars.png) 0 0 repeat-x;
  border: 2px black solid;
  margin: 0 auto;
}

.rating_bar div {
  height: 13px;
  background: url(../images/rating_fullstars.png) 0 0 repeat-x;
}


form.bottomform {
	width: 45%;
	float: right;
	margin: 0 20px;
	background: white;
	padding: 10px;
	background: #C6DD7D;
	border: 2px #FF9 solid;
}

form.bottomform label {
	display: block;
	margin: 0;
}

div.optin li.optinitem {
	list-style: none;
	padding-left: 32px;
	background: url(../images/bullet-check.png) top left no-repeat;
	margin: 10px 0;
}

#maincontent div.optin ul {
	margin: 15px 0;
	margin-left: 5px; margin-bottom: 40px;
	color: #993;
}

h2.articlelist {
	height: 24px;
	line-height: 24px;
	border: 3px #e9dbd0 double;
	padding: 0 3px;
}