/*---------------------------------------------
Squeaky Wheel Media Style Sheet for The End of Overeating

	Author: Carlos Agosto
	Created: March, 2009
	
	Style Sheet reads from Top To Bottom Left to Right 
	
	Structure of this Document (search for "=" to jump to each section heading):
	
	Basic Document Hierarchy:  

		1) =XHTML ELEMENTS
		2) =Header
		3) =Main Content Area
		4) =Side Scrolling
		5) =MainNav
		6) =Footer
 
*/

/**** =XHTML Elements
---------------------------------------------*/


html{height:101%;}
body{
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	font-size:16px;
	color:#999;
	background: url(../images/BG-Blog.jpg);
	padding:0 0 20px 0;
	}

a{text-decoration:none; color:#3F86A9;}

a:hover{text-decoration:underline; color:#3F86A9;}	
a:focus{outline: none;}

em{font-style:italic;}

sup{font-size:9px;}

.H-DividerLong{background:url(../images/H-DividerLong.gif) no-repeat 43px 67px; padding:0 0 20px 0;}
.H-Divider{background:url(../images/H-Divider.gif) no-repeat center bottom; padding:0 0 20px 0;}

/**** =Header 
---------------------------------------------*/

#HeaderWrap{ 
	width:100%; 
	float:left; 
	background:url(../images/BG-BlogHeaderWrap.jpg);
	clear:both;
	}	
	
#Header{ 
	width:980px;  
	text-align:left;
	color:#FFF;
	margin:0 auto;
	position:relative;
	height:34px;
	}
	
#Header:after{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}				
	
#Header #TitleLink{
	margin:10px 0 0 20px; 
	display:block; 
	float:left;
	}	
	
#Header ul.navigation {
    list-style: none;
    margin: 12px 0 0 0;
    padding: 0;
	float:left;
	}	
#Header ul.navigation li{
	display:block;
	float:left;
	}
#Header ul.navigation li img{display:block;}	
	
#Header ul{ 
	margin:0;
	display:inline;
	}	
#Header ul li{
	display:inline; 
	list-style:none; 
	margin:0 0 0 10px;
	}
	
/* Hidden Sliding Divs */	
	
#Header ul#SocialArea{
	position:absolute; 
	z-index:100; 
	top:10px; 
	right:10px;
	}	
	
	
#BookMarkTool{
	position:absolute; 
	width:190px; 
	top:34px; 
	right:228px; 
	background:#fff;
	z-index:70;
	display:none;
	border: 1px solid #aaa;
	}	
	
#SendToFriend{
	position:absolute; 
	width:610px; 
	top:33px; 
	right:-60px; 
	background:#fff;
	z-index:50;
	border: 1px solid #aaa;
	color:#333;
	padding:0 0 10px 0;
	display:none;
 	}
	
/* Send to Friend Form */	
#SendToFriend ul{
	float:left;
	display:inline;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:10px 0 0 0 ;
	}
	
	
#SendToFriend ul#YourEmailInfo{
	width:295px;
	margin:10px 0 0 10px;
	} 
#SendToFriend ul#FirendsInfo{ 
	width:280px; 	
	border-left:1px dotted #ccc; 
	padding-left:10px; 
	}	

#SendToFriend ul li{
	list-style:none;
	float:left; 
	display:block;
	clear:both;
	margin: 0 0 5px 0;
	width:280px;
	}
#SendToFriend ul li.FirendSectionTitles{
	color:#5596B2;  
	display:inline;
	}	
#SendToFriend ul li label{
	float:left;
	display:block;
	width:155px;
	}
	
#SendToFriend ul li input{
	display:block;
	float:left;
	width:120px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	}
	
#SendToFriend ul li input#Send{width:auto;}	

#SendToFriend ul li span{color:#CC0000;}

#Error{
	width:100%; 
	float:left; 
	text-align:center;
	background: #ffffcc;
	padding:5px 0;
	color:#CC0000;
	display:none;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	}

/**** =Main Content Area
---------------------------------------------*/
#MainContentWrap{
	width:920px;
	background:#fff;
	margin:0 auto;
	padding:30px 0 25px 60px;
	text-align:left;
	clear:both;
	}	
	
#MainContentWrap:after{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}			
	
#MainContentWrap h1{margin:0 0 10px 0;}	

#BolgArea{
	float:left; 
	width:625px;
	border-right:1px dotted #ccc;
	padding:0 15px 0 0;
	}
	
#BolgArea .BlogTitle{
	font-size:28px; 
	color:#666; 
	margin:25px 0 10px 0;
	float:left;
	width:99%;
	}	

#BolgArea .BlogTitle p{width:88%; float:left; line-height:125%;}
	
#BolgArea .BlogTitle span{ 
	float:left; 
	display:block; 
	font-size:72px; 
	color:#ccc;
	line-height:100%;
	margin:0 10px 0 0;
	}
	
#BolgArea p.MainBlogCopy{ margin:0 0 15px 70px;}

#BolgArea p.ChapterNote{ 
	font-style: italic; 
	font-size:14px; 
	font-family:Georgia, "Times New Roman", Times, serif;
	margin:0 0 0 70px;
	}
	
#SideBar{
	float:left; 
	width:245px; 
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	padding:0 0 0 15px;
	}	
	
#SideBar ul{
	float:left; 
	margin:0 0 15px 0; 
	width:90%;
	}
#SideBar ul li{
	list-style:none; 
	margin:0 0 5px 0;
	float:left;
	clear:both;
	width:100%;
	}
	
#SideBar a{
	font-style:italic; 
	clear:both; 
	float:left; 
	display:block; 
	width:95%;
	}	
	
#SideBar #SectionLinksWrap{
	padding:0 0 0 5px; 
	float:left; 
	width:98%;
	}	
	
/**** =Footer
---------------------------------------------*/
#Footer{
	width:980px; 
	clear:both;
	padding:0 0 20px 0;
	margin:0 0 30px 0;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:11px;
	color:#999999;
	margin:0 auto;
	background:url(../images/BGFooter.jpg) no-repeat bottom left #FFF;
	}	
	
#Footer:after{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}				
	
#Footer ul{float:right; margin:0 20px 0 0; display:inline;}
#Footer ul li{display:block; float:left; margin-right:10px;}
#Footer ul li a{
	color:#999; 
	margin:10px 0 0 0; 
	vertical-align:middle;
	display:block;
	float:left;
	}
	
#Footer ul li img{vertical-align:top;}