/*BenBella Books WEB SITE STYLE SHEET*/
/**************************************************************************************
date:  		3/20/09
author:   	Laura Yeffeth
email:    	laura@laurayeffeth.com
website:  	http://www.benbellabooks.com/

/***** =COLOR SCHEME *****

Background 							#ffffff		White
Main Text							#252525		Dark Gray
Navigation Text						#464646		Medium Gray
Active Tabs/h2 headings				#b81617		Red
Tabs/Logo/h3 headings				#27627b		Blue
Darker Footer Text					#01557a		Medium Blue
Lighter Footer Text					#86bbc9		Light Blue
Header/Footer background			#e2e8dd		Very Light Blue
Form field and table background		#ecefe8		Tint of Blue

/***** =LAYOUT *****/
html {font-size:100%}
html, body, #container {height:100%}
body > #container {height:auto; min-height:100%;}
body {  
position:relative;
height:101%;
text-align:center; /* This centers the container in IE 5* browsers*/
z-index:1;
}
div#container {
background:url(/media/header_background.png) top center repeat-x;
position:relative;
text-align:left; /* This overrides the text-align:center on the body element. */
}
#contentWrap {
padding-bottom:140px;
overflow:auto;
}
#content {
position:relative;
width:940px;
margin:60px auto;
height:100%;
}
#sideContent {
width:240px;
height:500px;
float:left;
margin-bottom:60px;
}
#bookstore #sideContent {
height: 540px;	/*additional height for search field on store pages */
}
#mainContent {
position:relative;
width:640px;
float:right;
padding-bottom:40px;
height:100%;
}
/* =BOOK PAGES */
.category {
overflow:hidden;
width:640px;
clear:both;
}
p.more {
position:relative;
margin:0;
text-align:right;
color:#b81617;
font-weight:700;
}
p.more a {
position:relative;
top:-30px;
}
.book {
float:left;
width:170px;
height:250px;
margin:0 42px 0 0;
}
.book p {
clear:left;
font-size:1.4em;
margin:0;
}
.book img {
width:100px;
border:1px solid #cccccc;
}
.book a {
display:block; 
width:102px;
}
.book a:hover, .book a:active {
opacity:0.6;
}
/* =BOOK OPTIONS PAGES (HARDCOVER AND PAPERBACK) */
#bookOptions .book {
width:200px;
height:400px;
margin:0 100px 0 0;
}
#bookOptions .book img {
width:200px;
}
#bookOptions .book img {
width:200px;
height:300px;
}
#bookOptions .book a {
width:202px;
}
#bookOptions .book .price .regular {text-decoration:line-through;}
#bookOptions .book .price .sale {font-weight:800; color:#b81617;}

/***** =LINKS *****/
a:link, a:visited {text-decoration:none; color:#27627b; border-bottom:1px solid #27627b;}
a:hover, a:active {text-decoration:none; color:#b81617; border-bottom:1px solid #b81617;}
a:hover span, a:active span {border-bottom:none; text-decoration:none; color:#b81617;}

#logo a:link, #logo a:visited, #navList li a:link, #navList li a:visited, #logo a:hover, #logo a:active, #navList li a:hover, #navList li a:active, .book a:link, .book a:visited, .book a:hover, .book a:visited, p.findOut a:link, p.findOut a:visited, p.findOut a:hover, p.findOut a:active, .checkOut a:link, .checkOut a:visited, .checkOut a:hover, .checkOut a:active, .bookSlider .features a:link, .bookSlider .features a:visited, .bookSlider .features a:hover, .bookSlider .features a:active, #home .findOut a:link, #home .findOut a:hover, #home .findOut a:visited, #home .findOut a:active {border-bottom:none;}

p.more a:link, p.more a:visited {border-bottom:none; color:#b81617;}
p.more a:hover, p.more a:active {text-decoration:underline;}

a.externalLink {
background:url(/media/external_link.gif) no-repeat 100% 55%; 
padding-right:14px;
}
#footer a.externalLink, #header a.externalLink {
background:url(/media/external_link_small.gif) no-repeat 100% 55%; 
padding-right:12px;
}
.category a.externalLink {background:none;}

a.top, #ourAuthors #mainContent h3 a.top {
margin-top:10px;
font-size:2em;
line-height:.5em;
text-transform:uppercase;
text-align:center;
padding:5px;
float:right;
font-weight:600;
height:12px;
width:12px;
border:1px solid #86bbc9;
background:#e2e8dd;
}
#ourAuthors #mainContent h3 a.top {
position:absolute;
top:1px;
right:0;
font-size:1.25em;
margin-top:0;
border:none;
padding-right:10px;}

/***** =IMAGE REPLACEMENT *****

Neal Image Replacement by Neal Venditto: http://neal.venditto.org/
This technique allows for text to show up in place of images when style sheets 
are disable or when images are turned off.

In your html, add class "replace" to any text element you want to replace with an image.
Then surround the text with <span> tags. 
*/
.replace span {
position:relative;
z-index:-1;
}
.replace a {
display:block;
width:100%;
height:100%;
text-decoration:none;
border-bottom:none;
}
/***** =TYPOGRAPHY *****/
body {
color:#252525;
font:62.5%/1.4 Arial, sans-serif;
}
h1, h1 a:link span {
font-size:2em; 
line-height:4em;
color:#24627b;
}
#mainContent h2 {
background:no-repeat;
color:#b81617; 
height:30px;
font-size:3em; 
font-weight:400;
line-height:1em; 
text-transform:uppercase; 
width:640px;
margin-bottom:30px;
clear:both;
}
.books h2 {
border-bottom:1px solid #db8a8b;
margin-bottom:0;
}
/*Replacement of page title text with text graphics*/
#bestsellers h2 {background:url(/media/h2.png) 0 0;}
#upcoming h2 {background:url(/media/h2.png) 0 -30px;}
#new h2 {background:url(/media/h2.png) 0 -60px;}
#smartpop h2 {background:url(/media/h2.png) 0 -90px;}
#health h2 {background:url(/media/h2.png) 0 -120px;}
#business h2 {background:url(/media/h2.png) 0 -150px;}
#reference h2 {background:url(/media/h2.png) 0 -180px;}
#science h2 {background:url(/media/h2.png) 0 -210px;}
#advice h2 {background:url(/media/h2.png) 0 -240px;}
#memoirs h2 {background:url(/media/h2.png) 0 -270px;}
#ideas h2 {background:url(/media/h2.png) 0 -300px;}
#sports h2 {background:url(/media/h2.png) 0 -330px;}
#fiction h2 {background:url(/media/h2.png) 0 -360px;}
#agents h2 {background:url(/media/h2.png) 0 -390px;}
#authors h2 {background:url(/media/h2.png) 0 -420px;}
#ourAuthors h2 {background:url(/media/h2.png) 0 -480px;}
#about h2 {background:url(/media/h2.png) 0 -540px;}
#staff h2 {background:url(/media/h2.png) 0 -570px;}
#contact h2 {background:url(/media/h2.png) 0 -600px;}
#privacy h2 {background:url(/media/h2.png) 0 -630px;}
#terms h2 {background:url(/media/h2.png) 0 -660px;}
#order h2 {background:url(/media/h2.png) 0 -690px;}
#search h2 {background:url(/media/h2.png) 0 -720px;}
#smartpop h2.whedon {background:url(/media/h2.png) 0 -750px;}


h3 {
font-size:1.8em; 
margin:1em 0;
text-transform:uppercase; 
font-weight:400;
color:#27627b;
}
.books h3 {
font-size:2.1em; 
margin:1em 0 ;
}
h4 {font-size:1.6em;}
h5, p, ul, ol {
font-size:1.6em;
margin:1em 0;
}
strong {
font-weight:600;
}
ol {
list-style:decimal outside; 
padding-left:20px;
}
#mainContent ul {
list-style: outside url(/media/bullet.gif); 
padding-left: 20px;
}
#agents #mainContent ul, #authors #mainContent ul {
list-style: none; 
padding-left:0;
}
#agents #mainContent ul li, #authors #mainContent ul li {
padding:.5em 0 ;
}

#home ul {
list-style-image: none;
}
ul li.last {
background:none !important;
padding-right:0 !important;
border-right:none !important;
}
p.name {margin-bottom:0;}
p.jobTitle {margin-top:0;}
.disclaimers, .liability {
text-transform:uppercase;
}
blockquote {
padding:0 0 1em 40px;
font-size:.875em;
}
blockquote p {
margin-top:0;
}
.cite {
margin-top:0;
float:right;
text-align:left;
}
#authors h3, .salutation {
clear:both;
}
/*TAB NAVIGATION: OUR AUTHORS PAGE*/
#ourAuthors #mainContent ul.tabNavigation {
height:20px;
margin:40px 0;
padding-left:0;
}
#ourAuthors #mainContent ul.tabNavigation li {
width:23px;
height:20px;
list-style:none;
float:left;
border-right:1px solid #e2e8dd;
}
#ourAuthors #mainContent ul.tabNavigation li a {
text-align:center;
border-bottom:none;
width:22px;
height:20px;
padding-left:1px;
display:block;
}
#ourAuthors #mainContent ul.tabNavigation li a:hover, #ourAuthors #mainContent ul.tabNavigation li a:active, 
.a #mainContent ul.tabNavigation li.a a, 
.b #mainContent ul.tabNavigation li.b a, 
.c #mainContent ul.tabNavigation li.c a, 
.d #mainContent ul.tabNavigation li.d a, 
.e #mainContent ul.tabNavigation li.e a, 
.f #mainContent ul.tabNavigation li.f a, 
.g #mainContent ul.tabNavigation li.g a, 
.h #mainContent ul.tabNavigation li.h a, 
.i #mainContent ul.tabNavigation li.i a, 
.j #mainContent ul.tabNavigation li.j a, 
.k #mainContent ul.tabNavigation li.k a, 
.l #mainContent ul.tabNavigation li.l a, 
.m #mainContent ul.tabNavigation li.m a, 
.n #mainContent ul.tabNavigation li.n a, 
.o #mainContent ul.tabNavigation li.o a, 
.p #mainContent ul.tabNavigation li.p a, 
.r #mainContent ul.tabNavigation li.r a, 
.s #mainContent ul.tabNavigation li.s a, 
.t #mainContent ul.tabNavigation li.t a, 
.v #mainContent ul.tabNavigation li.v a, 
.w #mainContent ul.tabNavigation li.w a, 
.y #mainContent ul.tabNavigation li.y a, 
.z #mainContent ul.tabNavigation li.z a
{
color:#b81617;
font-weight:800;
font-size:1.5em;
line-height:.95em;
}
#ourAuthors #mainContent h3 { 
position:relative;
background-color:#e2e8dd;
margin:0;
margin-top:-2px;
}
#ourAuthors #mainContent h3 a {
border-bottom:none;
padding:0 20px;
}
/* OUR AUTHORS AND STAFF PAGES */
.bio {
position:relative;
border-bottom:1px solid #e2e8dd;
overflow:auto;
padding:20px 0;
}
.bio img {
width:152px;
border:1px solid #999;
float:left;
margin-right:20px;
}
.bio p.website a {
position:relative;
bottom:0;
width:110px;
float:left;
}
#mainContent .bio h4 {margin-bottom: .5em;}
#mainContent .bio p {margin:0 0 .5em 0;}
#mainContent .bio .text p.website a {float:none;}
.findOut {margin:0;}

/***** =HEADER *****/
#header {
height:177px;
width:960px;
margin:0 auto;
position:relative;
}
h1#logo {
padding-top:21px;
width:243px;
height:137px;
float:left;
}
h1#logo a {
background:transparent url(/media/logo.png) 0 0 no-repeat;
overflow:hidden;
text-decoration:none;
}
h1#logo a:hover, #home h1#logo a{
background:transparent url(/media/logo.png) 0 -137px no-repeat;
}
h1#logo a span { 
display:block;
text-transform:uppercase;
}
#subNav {
padding-right:30px;
width:600px;
float:right;
}
#subNav ul, #subNav form{
height:27px;
float:right;
list-style:none outside;
}
#subNav li {
list-style:none outside;
float:left;
padding:0 13px 0 8px;
background:transparent url(/media/divider.gif) center right no-repeat;
line-height:.85em;
}
#subNav ul li.last {
padding-right:8px !important;
}
#subNav li a {
border-bottom:none;
text-transform:uppercase;
text-decoration:none;
font-size:.75em;
color:#000;
}
#subNav li a:hover, #subNav li a:active {
color:#b81617;
}
#subNav form {
clear:right;
position:relative;
width:268px;
background:transparent url(/media/search_field.gif) 0 0 no-repeat; 
}
#cse-search-box input {
border:none !important;
padding:0;
}
#cse-search-box input#field {
position:absolute;
left:6px;
top:1px;
background-color:transparent;
height:21px;
padding-top:3px;
width:231px;
font-size:1.4em;
}
#cse-search-box input#button {
position:absolute;
top:0;
right:4px;
background-color:transparent;
height:27px;
width:31px;
cursor:pointer;
background:transparent url(/media/search_button.gif) 0 0 no-repeat; 
}
#cse-search-box input#button:hover {
background:transparent url(/media/search_button.gif) 0 -27px no-repeat; 
}
ul.store {
position:absolute;
right:20px;
top:175px;
}
/***** =Main Navigation *****/
#navList {
position:absolute;
width:684px;
height:37px;
margin:0;
list-style:none;
bottom:0;
right:0;
}
#navList li {
position:absolute;
top:0;
display:block; /*eliminates any flickering of the hover images*/
height:37px;
width:95px;
padding-right:3px;
}
#navList li.navBooks {left:0;}
#navList li.navAgents {left:98px;}
#navList li.navAuthors {left:196px;}
#navList li.navPress {left:294px;}
#navList li.navOurAuthors {left:392px;} 
#navList li.navBlog {left:490px;}
#navList li.navCatalog {left:588px;}

#navList li.navBooks a {background:transparent url(../media/navigation.new.png) 0 0;}
#navList li.navAgents a {background:transparent url(../media/navigation.new.png) -98px 0;}
#navList li.navAuthors a {background:transparent url(../media/navigation.new.png) -196px 0;}
#navList li.navPress a {background:transparent url(../media/navigation.new.png) -294px 0;}
#navList li.navOurAuthors a {background:transparent url(../media/navigation.new.png) -392px 0;} 
#navList li.navBlog a {background:transparent url(../media/navigation.new.png) -490px 0;}
#navList li.navCatalog a {background:transparent url(../media/navigation.new.png) -588px 0;}

#navList li.navBooks a:hover {background:transparent url(../media/navigation.new.png) 0 -37px;}
#navList li.navAgents a:hover {background:transparent url(../media/navigation.new.png) -98px -37px;}
#navList li.navAuthors a:hover {background:transparent url(../media/navigation.new.png) -196px -37px;}
#navList li.navPress a:hover {background:transparent url(../media/navigation.new.png) -294px -37px;}
#navList li.navOurAuthors a:hover {background:transparent url(../media/navigation.new.png) -392px -37px;} 
#navList li.navBlog a:hover {background:transparent url(../media/navigation.new.png) -490px -37px;}
#navList li.navCatalog a:hover {background:transparent url(../media/navigation.new.png) -588px -37px;}

/*The following code causes the active page to be highlighted in the navBar*/
.books #navList li.navBooks a {
background:transparent url(../media/navigation.new.png) 0 -37px;}
#agents #navList li.navAgents a {
background:transparent url(../media/navigation.new.png) -98px -37px;}
#authors #navList li.navAuthors a {
background:transparent url(../media/navigation.new.png) -196px -37px;}
#press #navList li.navPress a {
background:transparent url(../media/navigation.new.png) -294px -37px;}
#ourAuthors #navList li.navOurAuthors a {
background:transparent url(../media/navigation.new.png) -392px -37px;} 
#blog #navList li.navBlog a {
background:transparent url(../media/navigation.new.png) -490px -37px;}
#catalog #navList li.navCatalog a {
background:transparent url(../media/navigation.new.png) -588px -37px;}

/* Styling of text for navigation links if images are turned off */
#navList li a span {
background-color:#27627b;
border:1px solid #86bbc9;
border-bottom:none;
color:#fff;
display:block;
font-size:.7em;
font-weight:bold;
height:30px;
line-height:2.4em;
padding:0 3px;
text-align:center;
text-decoration:none;
text-transform:uppercase;
width:87px;
}
#navList li a:hover span {
color:#b81617;
background-color:#fff;
border:1px solid #86bbc9;
}
/***** =Side Navigation *****/
#content #sideContent h3 {
font-size:2.1em; 
text-transform:uppercase; 
text-align:center;
font-weight:400;
color:#27627b;
height:30px;
border-bottom:1px solid #e2e8dd;
margin:0;
}
#content h3.browse {
background:url(/media/h3.png) 0 0 no-repeat;
}
#sideNav {
position:relative;
width:240px;
font-size:1.4em;
margin-top:0;
padding-left: 0;
list-style:none outside;
}
#sideNav li {
list-style: none outside;
border-bottom:1px solid #e2e8dd;
text-align:right;
text-transform:uppercase;
height:34px;
width:240px;
}
#sideNav li a {
border-bottom:none;
color:#252525;
text-decoration:none;
font-size:.82em;
line-height:3em;
display:block;
height:34px;
}
#sideNav li a span {
display:block;
height:34px;
width:230px;
padding-right:10px;
}
#sideNav li.mainBook a {
font-size:1.1em;
line-height:2.4em;
font-weight:600;
}
#sideNav li a:hover {
color:#b81617;
background:url(/media/shading.png) repeat-y;
}
#sideNav li.subBook a:hover {
font-weight:600;
}
/*The following code causes the active page to be highlighted in the navBar*/
#bestsellers #sideNav li.bestsellers a, #upcoming #sideNav li.upcoming a, #new #sideNav li.new a { color:#b81617; 
background:url(/media/shading.png) no-repeat;
}
#smartpop #sideNav li.smartpop a, #health #sideNav li.health a, #business #sideNav li.business a, 
#reference #sideNav li.reference a, #science #sideNav li.science a, #advice #sideNav li.advice a, 
#memoirs #sideNav li.memoirs a, #ideas #sideNav li.ideas a, #fiction #sideNav li.fiction a, #sports #sideNav li.sports a {
color:#b81617; 
background:url(/media/shading.png) repeat-y;
font-weight:600; 
}
/***** =SEARCH RESULTS *****/
#cse-search-results iframe {width: 640px;}
#search #mainContent #cse-search-results iframe html body .ra {
border:none !important;
border-left:1px solid red !important;
}

/***** =FOOTER *****/
#footerWrap {
position:relative;
margin-top:-140px; /* negative value of footer height */
height:140px;
background:url(/media/footer_background.png) bottom center repeat-x;
clear:both;
bottom:0;
} 
/* CLEAR FIX*/
.clearfix:after {content:".";
display:block;
height:0;
clear:both;
visibility:hidden;}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */

#footer {
position:relative;
width:940px;
margin:0 auto;
padding-top:28px;
height:84px;
font-size:.8em;
}
#footer img {
width:150px;
height:84px;
margin:0 55px;
float:left;
}
#footer p#email_errors {
color:#01557a; 
margin:0 10px 20px 0;
text-align:right;
font-size:1.4em;
}
#footer ul {
position:absolute;
right:10px;
width:690px;
height:13px;
float:right;
text-align:right;
margin:.5em 0;
}
.siteInfo {bottom:0;}
.footerNav {bottom:32px;}

#footer ul li {
border-bottom:none;
display:inline;
list-style:none;
text-decoration:none;
font-size:.85em;
height:13px;
}
.footerNav li {
padding:0 8px;
background:transparent url(/media/divider_footer.gif) center right no-repeat;
}
.siteInfo li {
padding:0 6px 0 15px;
background:transparent url(/media/check.gif)  2px -2px no-repeat;
}
#footer .footerNav li, #footer .footerNav li a:link, #footer .footerNav li a:visited {
border-bottom:none;
text-decoration:none; color:#01557a; 
}
#footer .footerNav li a:hover, #footer .footerNav li a:active {
border-bottom:none;
text-decoration:none; color:#b81617; 
}
#footer .siteInfo li, #footer .siteInfo li a:link, #footer .siteInfo li a:visited {
border-bottom:none;
text-decoration:none; color:#86bbc9; 
}
#footer .siteInfo li a:hover, #footer .siteInfo li a:active {
border-bottom:none;
text-decoration:none; color:#b81617; 
}