/*---------------------------------------------
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
		7) =Pop up windows
 
*/

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

html{height:101%;}
body{
	text-align:center;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	color:#333;
	background:#fff;
	overflow-x:hidden;
	}

a{text-decoration:none;}

a:hover{text-decoration:underline;}	
a:focus{outline: none;}

em{font-style:italic;}

sup{font-size:9px;}

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

#HeaderWrap{ 
	width:100%; 
	float:left; 
	background:url(../images/BG-HeaderWrap.jpg) repeat-x;
	clear:both;
	}	
	
#Header{ 
	width:1200px;  
	text-align:left;
	color:#FFF;
	margin:0 auto;
	position:relative;
	}
	
#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:123px;
	}	
	
#BookMarkTool{
	position:absolute; 
	width:190px; 
	top:33px; 
	right:330px; 
	background:#fff;
	z-index:70;
	display:none;
	border: 1px solid #aaa;
	}	
	
#SendToFriend{
	position:absolute; 
	width:610px; 
	top:33px; 
	right:50px; 
	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;
	}
	
#flashPlacement{float:left; height:170px; margin:11px 0 0 0;}

/**** =Main Content Area
---------------------------------------------*/
#MainContentWrap{
	width:100%;
	float:left;
	background:url(../images/BG-MainContentWrap.jpg) repeat-x;
	clear:both;
	padding:0 0 50px 0;
	}	
	
#MainContent{
	width:1200px; 
	text-align:left;
	margin:0 auto;
	position:relative;
	}	
	
#MainContent:after{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}			
	
#Product{
	background:url(../images/Book-EndofOvereating-top.jpg) no-repeat; 
	width:432px; 
	height:442px;
	float:left;
	}	
	
#Product h2{text-indent:-500px;}	
#Product img{ display:block;}	

/**** =Side Scrolling
---------------------------------------------*/	
#Home,
#Book,
#Author,
#Events{margin:0;}

#slider {
    width:634px;
    margin:30px 0 0 0;
	float:left;
	height:412px;
	overflow:hidden;
	}

.scroll {
    width: 100%;
    position: relative;
    clear: left;
	overflow:hidden;
	}
	
.scrollContainer{float:left; width:100%;}


.scrollContainer div.panel { 
	width:100%; 
	background:none;
	float:left;
	}
	
.scrollContainer div.panel  h2,
.scrollContainer div.panel h3{
	width:100%;
	text-align:center;
	margin:0 0 10px 0;
	}
	
.scrollContainer div.panel .LeftContent{
	width:380px;
	float:left;
	}

.scrollContainer div.panel .LeftContent a.SectionLinks{
	float:left; 
	clear:both;
	}

.scrollContainer div.panel .LeftContent a,
.scrollContainer div.panel .LeftContent a.SectionsLinks,
.scrollContainer div.panel .RightContent a,
.scrollContainer div.panel .RightContentHomeSection a{
	color:#3F86A9;
	font-weight:normal;
	font-style:italic;
	}

.scrollContainer div.panel .LeftContent h2{
	width:100%;
	margin:0 0 15px 0;
	text-align:left;
	padding:0 0 0 3px;
	}

.scrollContainer div.panel .LeftContent h4{
	text-align:right; 
	width:100%;
	margin:0 0 10px 0;
	}	
	
.scrollContainer div.panel .LeftContent h4 img{ margin:0 60px 0 0;}	

.scrollContainer div.panel .LeftContent p{margin:0 0 10px 0; padding-left:3px;}

.scrollContainer #Events div.panel .LeftContent p{
	margin:0 0 10px 0; 
	float:left; 
	clear:both; 
	width:98%;
	}

.scrollContainer div.panel .LeftContent p img{float:left; margin:0 15px 0 0;}

.scrollContainer div.panel .LeftContent p span{font-family:Arial, Helvetica, sans-serif; font-size:11px;}

.scrollContainer div.panel .LeftContent p.CopyTeasersr{ 
	font-weight:bold; 
	margin:0 0 20px 0;
	}
	
.scrollContainer div.panel .LeftContent p.QuoteBy{ 
	font-size:11px; 
	text-align:right;
	margin:0 15px 20px 0;
	font-family:Arial, Helvetica, sans-serif;
	}
	
.scrollContainer div.panel .AboutAuthor{width:600px;}	
.scrollContainer div.panel .AboutAuthor img.RightSideHeadShot{float:right; margin:0 0 0 20px;}

.scrollContainer div.panel .AuthorContentBox{
	background:#fff;
	border:1px solid #E4E3E0;
	width:350px;
	padding:10px;
	float:left;
	font-size:11px;
	margin:10px 0;
	}
	
.scrollContainer div.panel .AuthorContentBox h2{width:100%; text-align:center;}	

.scrollContainer div.panel .RightContentHomeSection,
.scrollContainer div.panel .RightContent{
	float:left;
	background:#fff;
	border:1px solid #E4E3E0;
	padding:10px;
	width:170px;
	margin:0 0 0 10px;
	display:inline;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#332115;
	}	
.scrollContainer div.panel .RightContentHomeSection{text-align:center;}	
.scrollContainer div.panel .RightContentHomeSection p{
	width:100%;
	margin:0 0 5px 0;
	}
.scrollContainer div.panel .RightContentHomeSection img{display:block; margin:0 auto 5px auto;}	
	
.scrollContainer div.panel .RightContentHomeSection a{
	width:100%; 
	text-align:center; 
	display:block;
	margin:5px 0;
	}	

.scrollContainer div.panel .RightContent p{
	margin:0 0 2px 0;
	width:100%;
	font-family:Georgia, "Times New Roman", Times, serif;
	}
		
.scrollContainer div.panel .RightContent p.RightSideQuote{ 
	text-align:right;
	margin:8px 0 15px 0;
	font-family:Arial, Helvetica, sans-serif;
	}	
	
	
.scrollContainer div.panel .RightContent p.Location{margin:10px 0 10px 0;}	
.scrollContainer div.panel .RightContent p.TimeAndDate{font-family:Arial, Helvetica, sans-serif; margin:0 0 13px 0;}
		
.scrollContainer div.panel .RightContent h3{ margin:0 0 10px 0;}		


.scrollContainer div.panel .H-Divider{background:url(../images/H-Divider.gif) no-repeat center bottom; padding:0 0 20px 0;}


/**** =MainNav
---------------------------------------------*/

#MainNavWrap{
	background:url(../images/BG-MainNavWrap.jpg) repeat-x top left; 
	width:100%; 
	float:left; 
	clear:both;
	}
#MainNav{
	width:1200px; 
	overflow:hidden; 
	text-align:left;
	margin:0 auto;
	background:url(../images/BG-MainNav.jpg) no-repeat top center;
	position:relative;
	padding:0 0 80px 0;
	}	
#MainNav img{float:left; display:block;}	
	
#MainNav ul.navigation {
    list-style: none;
    margin: 2px 0 0 0;
    padding: 0;
    padding-bottom:9px;
	float:left;
	}

#MainNav ul.navigation li {
    display: block;
	float:left;
    margin-right: 10px;
	}

#MainNav ul.navigation li a{
	display: block;
  	padding-top: 110px; height: 0px !important;
  	height /**/: 110px; overflow: hidden;
	}	

#MainNav ul.navigation li#TabOne a{background:url(../images/Nav-Tab-One.jpg) no-repeat 0 0; width:199px; }
#MainNav ul.navigation li#TabTwo a{background:url(../images/Nav-Tab-Two.jpg) no-repeat 0 0; width:205px;}
#MainNav ul.navigation li#TabThree a{background:url(../images/Nav-Tab-Three.jpg) no-repeat 0 0; width:191px;}

#MainNav ul.navigation li#TabOne a:hover,
#MainNav ul.navigation li#TabTwo a:hover,
#MainNav ul.navigation li#TabThree a:hover{
	background-position:0 -120px;
	}
#MainNav ul.navigation li.Hide{display:none;}
#MainNav ul.navigation li#TabOne a.selected,
#MainNav ul.navigation li#TabTwo a.selected,
#MainNav ul.navigation li#TabThree a.selected {background-position:0 -120px;}

ul.navigation a:focus,
#MainNav ul.navigation li#TabOne a:focus,
#MainNav ul.navigation li#TabTwo a:focus,
#MainNav ul.navigation li#TabThree a:focus{outline: none;}

/**** =Footer
---------------------------------------------*/
#Footer{
	width:500px; 
	clear:both;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:11px;
	color:#999999;
	position:absolute;
	bottom:100px;
	right:130px;
	}	
	
#Footer ul{float:right;}
#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;}

#StoreLogos{
	float:left; 
	width:45%; 
	position:absolute; 
	bottom:50px;
	left:80px;
	height:50px;
	}
#StoreLogos ul{float:left;}
#StoreLogos ul li{
	display:block; 
	float:left; 
	list-style:none;
	margin:0 15px 0 0;
	padding:32px 0 0 0;
	}
	
#StoreLogos ul li#LastLogo{padding:0;}	
	
#StoreLogos ul li img{ vertical-align:bottom;}

/**** =Pop up windows
---------------------------------------------*/

#PopUp{
	background: url(../images/BG-Blog.jpg);
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#999;
	}
	
#Content{
	width:580px;
	background: #FFF;
	text-align:left;
	margin:0 auto;
	padding:20px;
	border:1px solid #ccc;
	}
	
#Content p{margin:0 0 10px 0;}

#Content a{color:#3F86A9;}

#Content ul{
	float:left; 
	width:98%; 
	margin:10px 0 0 5px; 
	display:inline;
	}
#Content ul li{
	display: list-item;
	padding:0 30px 0 0;
	list-style-position:outside;
	list-style-type:disc;
	margin:0 0 5px 15px;
	}

#Content ol{
	float:left; 
	width:98%; 
	margin:10px 0 20px 5px; 
	display:inline;
	}
	
#Content ol li{
	list-style:lower-roman;
	margin:0 0 5px 30px;
	list-style-position:outside;
	display: list-item;
	padding:0 30px 0 20px;
	color:#3F86A9;
	}	

#Content h1{
	font-size:16px; 
	color:#333; 
	margin:0 0 25px 0; 
	font-weight:bold;
	}
#Content h2{
	font-size:14px; 
	color:#666; 
	margin:0 0 5px 0; 
	font-weight:bold;
	}