html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, ul, li {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: inherit;
font-family: inherit;
vertical-align: baseline;
/*list-style: none;*/
}
/* remember to define focus styles! */
:focus {
outline: 0px;
}
html, body {
margin: 0px;
padding: 0px;
height: 100%;
}
.container {
position: relative;
margin: 0px auto;
height: 100%;
}
body {
background: #3e5467 url('/images/front_bg1.jpg') repeat top left;
font-family: Trebuchet MS;
font-size: 12px;
}
.container a {
color: #5a96e8;
text-decoration: none;
}
.container a:hover {
color: #5a96e8;
text-decoration: underline;
}
/*-------------------------------- BEGIN LAYOUT ----------------------------------------- */
/*##############################################################################
##############################################################################
## Body Containers ##
############################################################################*/
#bodyContainer { position: absolute; width: 100%; min-height: 100px; margin: 0; padding: 0; background: url('/images/front_bg2.jpg') repeat-x top left; }
#headerContainer { position: absolute; width: 100%; min-height: 415px; margin: 0; padding: 0; background: url('/images/front_bg3.jpg') no-repeat top center; }
/*##############################################################################
##############################################################################*/
/*##############################################################################
##############################################################################
## Header ##
############################################################################*/
#header { width: 1004px; height: 412px; margin: 0; padding: 0; }
/*###########################################
## Navigation ##
###########################################*/
#header #nav { width: 1004px; height: 71px; margin: 0; padding: 0; background: url('/images/front_logo_top.jpg') no-repeat top left; }
#header #nav .left { width: 175px; height: 71px; margin: 0; padding: 0 0 0 27px; }
#header #nav .left h1 { width: 175px; height: 71px; margin: 0; padding: 0; }
#header #nav .left h1 a { background: none; width: 175px; height: 71px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
#header #nav .right { width: 802px; height: 51px; margin: 0; padding: 20px 0 0 0; }
#header #nav .right #navigation { width: 802px; margin: 0; padding: 0; }
#header #nav .right #navigation ul { list-style: none; margin: 0; padding: 0; }
#header #nav .right #navigation ul li { float: left; height: 24px; margin: 0; padding: 0; }
#header #nav .right #navigation ul li h2 { height: 24px; margin: 0; padding: 0; }
#header #nav .right #navigation ul li:first-child a { display: block; height: 20px; margin: 0 7px 0 0; padding: 4px 0 0 0; border-left: 0; color: #ffffff; font-size: 15px; font-weight: normal; letter-spacing: -0.02em; line-height: 16px; text-decoration: none; }
#header #nav .right #navigation ul li a { display: block; height: 20px; margin: 0 7px 0 0; padding: 4px 0 2px 7px; border-left: 1px solid #87a1b7; color: #ffffff; font-size: 15px; font-weight: normal; letter-spacing: -0.02em; line-height: 16px; text-decoration: none; }
#header #nav .right #navigation ul li a:hover { color: #b9f38a; text-decoration: none; }
#header #nav .right #navigation ul li.kids { padding: 0 0 0 7px !important; border-left: 1px solid #87a1b7; }
#header #nav .right #navigation ul li.kids a { background: url('/images/front_nav_kids.jpg') no-repeat top left; width: 37px; height: 22px; margin: 0 7px 0 0 !important; padding: 2px 0 0 0 !important; display: block; text-indent: -99999px; cursor: pointer; border-left: 0; color: #ffffff; font-size: 15px; font-weight: normal; letter-spacing: -0.02em; line-height: 16px; text-decoration: none; }
#header #nav .right #navigation ul li.kids a:hover { background: url('/images/front_nav_kids_on.jpg') no-repeat top left; }
#header #nav .right #navigation ul li.teens { padding: 0 0 0 7px !important; border-left: 1px solid #87a1b7; }
#header #nav .right #navigation ul li.teens a { background: url('/images/front_nav_teens.jpg') no-repeat top left; width: 42px; height: 22px; margin: 0 7px 0 0 !important; padding: 2px 0 0 0 !important; display: block; text-indent: -99999px; cursor: pointer; border-left: 0; color: #ffffff; font-size: 15px; font-weight: normal; letter-spacing: -0.02em; line-height: 16px; text-decoration: none; }
#header #nav .right #navigation ul li.teens a:hover { background: url('/images/front_nav_teens_on.jpg') no-repeat top left; }
/*###########################################
## Columns ##
###########################################*/
#header .columns { width: 1004px; height: 329px; margin: 0; padding: 0; }
#header .columns #logo { width: 237px; height: 329px; margin: 0; padding: 0; background: url('/images/front_logo.jpg') no-repeat top left; }
#header .columns #logo h1 { width: 183px; height: 279px; margin: 0 27px 0 27px; padding: 0; }
#header .columns #logo h1 a { background: none; width: 183px; height: 279px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
#header .columns #kids { width: 232px; height: 329px; margin: 0; padding: 0; background: url('/images/front_kids_left.jpg') no-repeat top left; }
#header .columns #pieces { width: 425px; height: 306px; margin: 0 35px 0 0; padding: 23px 0 0 75px; background: url('/images/front_kids_right.jpg') no-repeat top left; }
#header .columns #pieces .left { width: 232px; height: 306px; margin: 0 25px 0 0; padding: 0; }
#header .columns #pieces .right { width: 158px; height: 270px; margin: 0; padding: 35px 10px 0 0; background: url('/images/front_header_hours.jpg') no-repeat top left; }
#header .bottom { clear: both; width: 1004px; height: 12px; margin: 0; padding: 0; background: url('/images/front_header_bottom.jpg') no-repeat top left; font-size: 10px; line-height: 10px; }
/* My Account */
#header .columns #pieces .left #myAccount { width: 228px; margin: 0 0 0 4px; padding: 35px 0 0 0; background: url('/images/front_header_account.jpg') no-repeat top left; }
#header .columns #pieces .left #myAccount h2 { height: auto; color: #ffffff; font-size: 16px; font-weight: normal; letter-spacing: -0.02em; line-height: 14px; }
#header .columns #pieces .left #myAccount h2 a { color: #ffca5f; font-size: 16px; font-weight: bold; letter-spacing: -0.02em; line-height: 14px; text-decoration: none; }
#header .columns #pieces .left #myAccount h2 a:hover { color: #000000; text-decoration: underline; }
/* Book Search */
#header .columns #pieces .left #bookSearch { width: 232px; margin: 52px 0 0 0; padding: 35px 0 0 0; background: url('/images/front_search_top.jpg') no-repeat top left; }
#header .columns #pieces .left #bookSearch form { margin: 0; padding: 0; }
#header .columns #pieces .left #bookSearch #searchfor { width: 208px; height: 25px; margin: 0; padding: 1px 10px 0 14px; border: 0; background: url('/images/front_search_bg.jpg') no-repeat top left; font-size: 12px; }
#header .columns #pieces .left #bookSearch .columns { width: 232px; height: 25px; margin: 0; padding: 11px 0 0 0; background: url('/images/front_search_bottom.jpg') no-repeat top left; }
#header .columns #pieces .left #bookSearch .columns .left { width: 109px; height: 23px; margin: 0; padding: 2px 0 0 6px; color: #ffffff; font-size: 14px; font-weight: bold; letter-spacing: -0.02em; line-height: 14px; }
#header .columns #pieces .left #bookSearch .columns .left h2 { margin: 0; padding: 0; color: #ffffff; font-size: 14px; font-weight: bold; letter-spacing: -0.02em; line-height: 14px; }
#header .columns #pieces .left #bookSearch .columns .right { width: 117px; height: 25px; margin: 0; padding: 0; background: none; }
#header .columns #pieces .left #bookSearch .columns .right select { width: 112px; margin: 0; padding: 0; }
#header .columns #pieces .left #bookSearch .submit { width: 232px; margin: 0; padding: 0; text-align: right; }
/* Hours */
#header .columns #pieces .right b { color: #ffca5f; font-size: 14px; line-height: 14px; }
#header .columns #pieces .right p { margin: 8px 0 10px 0; padding: 0; color: #ffffff; font-size: 12px; font-weight: normal; line-height: 16px; }
#header .columns #pieces .right ul { list-style: none; margin: 0; padding: 0; }
#header .columns #pieces .right li { display: inline; margin: 0; padding: 0; }
#header .columns #pieces .right li a { display: block; float: left; height: 22px; margin: 0; padding: 5px 0 5px 10px; background: transparent url('/images/buttonleft.png') no-repeat left; color: #ffffff; font-size: 11px; font-weight: bold; line-height: 11px; }
#header .columns #pieces .right li a span { display: inline; float: left; height: 12px; padding: 5px 10px 5px 0; background: transparent url('/images/buttonright.png') no-repeat right; }
#header .columns #pieces .right h4 { color: #ffca5f; height: auto; margin: 0 0 -8px 0; padding: 0; }
#header .columns #pieces .right .times { clear: both; width: 158px; margin: 0 0 10px 0; padding: 0; }
#header .columns #pieces .right .times .row { clear: both; width: 158px; margin: 0; padding: 0; color: #ffffff; font-size: 12px; font-weight: normal; line-height: 14px; }
#header .columns #pieces .right .times .row .left { width: 62px; height: 14px; margin: 0; padding: 0; background: none; }
#header .columns #pieces .right .times .row .right { width: 96px; height: 14px; margin: 0; padding: 0; background: none; }
/*##############################################################################
##############################################################################*/
/*##############################################################################
##############################################################################
## Body ##
############################################################################*/
#body { width: 1004px; min-height: 200px; margin: 0; padding: 0; background: url('/images/front_body_bg.jpg') repeat-y top left; }
#body #height { width: 1004px; min-height: 400px; margin: 0; padding: 0; background: url('/images/front_body_bottom.jpg') no-repeat bottom left; }
#body #height .top { width: 893px; min-height: 500px; margin: 0; padding: 14px 49px 0 62px; background: url('/images/front_body_top.jpg') no-repeat top left; }
/*###########################################
## Promo ##
###########################################*/
#body #height .top #promo { width: 893px; margin: 0; padding: 0; }
#body #height .top #promo .top { width: 893px; min-height: 288px; margin: 0; padding: 0; background: transparent; }
#body #height .top #promo .top .copy { width: 315px; margin: 0 20px 0 0; padding: 15px 0 0 0; background: transparent; }
#body #height .top #promo .top .copy h2 { height: auto; margin: 0 0 10px 0; padding: 0; color: #4d4d4d; font-size: 18px; font-weight: normal; letter-spacing: -0.02em; line-height: 20px; }
#body #height .top #promo .top .copy p { margin: 0 0 15px 0; padding: 0; color: #929292; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 18px; }
#body #height .top #promo .top .copy ul { list-style: disc outside; margin: 0 0 10px 0; padding: 0 0 0 20px; line-height: 18px; }
#body #height .top #promo .top .copy ul li { width: 280px; margin: 0; padding: 0; color: #777777; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 16px; }
#body #height .top #promo .top .copy h4 { width: 300px; height: 50px; margin: 25px 0 0 0; padding: 0; }
#body #height .top #promo .top .copy h4 a { background: url('/images/front_promo_button.jpg') no-repeat top left; width: 300px; height: 50px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
#body #height .top #promo .top .photo { width: 540px; min-height: 270px; margin: 0; padding: 9px 9px 9px 9px; background: url('/images/front_promo_bg.jpg') no-repeat top left; }
#body #height .top #promo .bottom { width: 893px; min-height: 35px; margin: 8px 0 0 0; padding: 0; }
#body #height .top #promo .bottom .spacer { width: 315px; margin: 0 20px 0 0; padding: 0; }
#body #height .top #promo .bottom .thumbs { width: 549px; min-height: 35px; margin: 0 0 0 9px; padding: 0; }
#body #height .top #promo .bottom .thumbs .left { width: 50px; margin: 0; padding: 8px 0 0 0; color: #777777; font-size: 13px; letter-spacing: -0.02em; line-height: 14px; }
#body #height .top #promo .bottom .thumbs .left h2 { margin: 0; padding: 0; color: #777777; font-size: 13px; letter-spacing: -0.02em; line-height: 14px; }
#body #height .top #promo .bottom .thumbs .middle { width: 205px; margin: 0; padding: 0; }
#body #height .top #promo .bottom .thumbs .right { width: 294px; margin: 0; padding: 4px 0 0 0; text-align: left; }
#body #height .top #promo .bottom .thumbs .right ul { list-style: none; margin: 0; padding: 0; }
#body #height .top #promo .bottom .thumbs .right ul li:first-child { float: left; height: 19px; margin: 0; padding: 5px 0 0 0; border-left: 0; }
#body #height .top #promo .bottom .thumbs .right ul li { float: left; height: 19px; margin: 0 0 0 14px; padding: 5px 0 0 14px; border-left: 1px solid #dadada; }
#body #height .top #promo .bottom .thumbs .right ul li h2 { color: #4d4d4d; margin: 0; padding: 0; }
#body #height .top #promo .bottom .thumbs .right ul li h2 b { color: #639f47; }
#body #height .top #promo .bottom .thumbs .right ul li h2 a { width: auto !important; margin: 0; padding: 0; color: #4d4d4d; font-size: 14px; font-weight: normal; letter-spacing: -0.02em; line-height: 14px; background: none; text-decoration: none; }
#body #height .top #promo .bottom .thumbs .right ul li h2 a:hover { width: auto !important; margin: 0; padding: 0; color: #000000; font-size: 14px; font-weight: normal; letter-spacing: -0.02em; line-height: 14px; background: none; text-decoration: none; }
/* Pagination */
#body #height .top #promo .bottom .thumbs a { float: left; display: block; width: 24px; height: 24px; margin: 0 8px 8px 0; padding: 5px 5px 5px 5px; background: url('/images/front_promo_thumb.jpg') no-repeat top left; overflow: hidden; }
#body #height .top #promo .bottom .thumbs a.activeSlide { background: url('/images/front_promo_thumbActive.jpg') no-repeat top left; }
#body #height .top #promo .bottom .thumbs img { border: 0; width: 24px; height: 24px; }
/*###########################################
## Columns ##
###########################################*/
#body #height .top #bodyColumns { width: 893px; margin: 0 0 15px 0; padding: 0 0 0 0; }
#body #height .top #bodyColumns .left { width: 300px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .middle { width: 35px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right { width: 558px; margin: 0; padding: 25px 0 0 0; }
/* Left */
#body #height .top #bodyColumns .left .title { width: 228px; margin: 0 0 20px 0; padding: 13px 0 0 70px; }
#body #height .top #bodyColumns .left .title h2 { margin: 0; padding: 0; color: #4d4d4d; font-size: 30px; font-weight: normal; letter-spacing: -0.02em; line-height: 30px; }
#body #height .top #bodyColumns .left .title p { width: 200px; margin: 0; padding: 0 12px 0 0; background: url('/images/front_featured_marker2.jpg') no-repeat top right; line-height: 13px; }
#body #height .top #bodyColumns .left .title a { color: #df2d2c; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 13px; text-decoration: none; }
#body #height .top #bodyColumns .left .title a:hover { text-decoration: underline; }
#body #height .top #bodyColumns .left .title b { font-size: 13px; }
#body #height .top #bodyColumns .left .copy { width: 274px; min-height: 100px; margin: 0; padding: 0 12px 0 12px; }
#body #height .top #bodyColumns .left .copy .bookCover { width: 90px; margin: 0 10px 0 0; padding: 0; }
#body #height .top #bodyColumns .left .copy .bookCover img { width: 80px; margin: 0 0 10px 0; padding: 4px 4px 4px 4px; border: 1px solid #d8d8d8; background: #eeeeee; }
#body #height .top #bodyColumns .left .copy .bookDetails { width: 174px; margin: 0; padding: 4px 0 0 0; }
#body #height .top #bodyColumns .left .copy .bookDetails .source { width: 174px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .left .copy .bookDetails .source .row { width: 174px; margin: 0 0 8px 0; padding: 0; }
#body #height .top #bodyColumns .left .copy .bookDetails .source .row b { font-size: 13px; }
#body #height .top #bodyColumns .left .copy .bookDetails .source .row .left { width: 42px; margin: 0; padding: 0; color: #4d4d4d; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 11px; }
#body #height .top #bodyColumns .left .copy .bookDetails .source .row .right { width: 132px; margin: 0; padding: 0; color: #4d4d4d; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; }
#body #height .top #bodyColumns .left .copy .bookDetails .description { width: 174px; margin: 0; padding: 0; color: #777777; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 14px; }
#body #height .top #bodyColumns .left .copy .bookDetails .more { width: 174px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .left .copy .bookDetails .more h4 { height: 16px; margin: 12px 0 12px 0; padding: 2px 0 0 29px; background: url('/images/front_featured_marker.jpg') no-repeat top left; }
#body #height .top #bodyColumns .left .copy .bookDetails .more h4 a { color: #df2d2c; font-size: 14px; font-weight: bold; letter-spacing: -0.02em; line-height: 14px; text-decoration: none; }
#body #height .top #bodyColumns .left .copy .bookDetails .more h4 a:hover { color: #000000; text-decoration: underline; }
/* Right */
#body #height .top #bodyColumns .right #contentColumns { width: 558px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .left { width: 214px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right { width: 309px; min-height: 500px; margin: 0 0 0 17px; padding: 0 0 0 17px; border-left: 1px solid #e2e2e2; }
/*###########################################
## What's Hot? ##
###########################################*/
#body #height .top #bodyColumns .left #whatshot { width: 298px; min-height: 45px; margin: 0 0 21px 0; padding: 0; background: #f8f8f8 url('/images/front_featured_whatshot.jpg') no-repeat top left; border: 1px solid #cfcfcf; }
#body #height .top #bodyColumns .left #whatshot .title { width: 228px; margin: 0 0 20px 0; padding: 13px 0 0 70px; }
#body #height .top #bodyColumns .left #whatshot .title h2 { margin: 0; padding: 0; color: #4d4d4d; font-size: 30px; font-weight: normal; letter-spacing: -0.02em; line-height: 30px; }
#body #height .top #bodyColumns .left #whatshot .copy { width: 139px; min-height: 201px; margin: 0; padding: 0 10px 0 149px; /*background: url('/images/front_featured_whatshot_bg.jpg') no-repeat bottom left;*/ }
#body #height .top #bodyColumns .left #whatshot .copy h3 { margin: 0 0 6px 0; padding: 0; color: #007ec4; font-size: 18px; font-weight: bold; letter-spacing: -0.02em; line-height: 19px; }
#body #height .top #bodyColumns .left #whatshot .copy h3 a { color: #007ec4; font-size: 18px; font-weight: bold; letter-spacing: -0.02em; line-height: 19px; text-decoration: none; }
#body #height .top #bodyColumns .left #whatshot .copy h3 a:hover { color: #000000; text-decoration: underline; }
#body #height .top #bodyColumns .left #whatshot .copy p { margin: 0; padding: 0; color: #777777; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 15px; }
#body #height .top #bodyColumns .left #whatshot .copy h4 { height: 16px; margin: 12px 0 10px 0; padding: 2px 0 0 29px; background: url('/images/front_featured_marker.jpg') no-repeat top left; }
#body #height .top #bodyColumns .left #whatshot .copy h4 a { color: #007ec4; font-size: 14px; font-weight: bold; letter-spacing: -0.02em; line-height: 14px; text-decoration: none; }
#body #height .top #bodyColumns .left #whatshot .copy h4 a:hover { color: #000000; text-decoration: underline; }
/*###########################################
## We Recommend... ##
###########################################*/
#body #height .top #bodyColumns .left #werecommend { width: 298px; min-height: 66px; margin: 0 0 21px 0; padding: 0; background: #f8f8f8 url('/images/front_featured_werecommend.jpg') no-repeat top left; border: 1px solid #cfcfcf; }
/* see .title & .copy w/ children above */
/*###########################################
## Recent Arrivals ##
###########################################*/
#body #height .top #bodyColumns .left #recentarrivals { width: 298px; min-height: 45px; margin: 0 0 21px 0; padding: 0; background: #f8f8f8 url('/images/front_featured_recentarrivals.jpg') no-repeat top left; border: 1px solid #cfcfcf; }
#body #height .top #bodyColumns .left #recentarrivals .title p { width: 185px; margin: 0; padding: 0 12px 0 0; background: url('/images/front_featured_marker2.jpg') no-repeat top right; line-height: 13px; }
/* see .title & .copy w/ children above */
/*###########################################
## Welcome ##
###########################################*/
#body #height .top #bodyColumns .right #welcome { width: 550px; margin: 0 0 35px 0; padding: 0; }
#body #height .top #bodyColumns .right #welcome .header { width: 550px; margin: 0 0 6px 0; padding: 0; background: none; }
#body #height .top #bodyColumns .right #welcome .header .title { width: 275px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #welcome .header .title h2 { margin: 0; padding: 0; color: #4d4d4d; font-size: 28px; font-weight: normal; letter-spacing: -0.02em; line-height: 28px; }
#body #height .top #bodyColumns .right #welcome .header #resize { width: 275px; margin: 0; padding: 5px 0 0 0; }
#body #height .top #bodyColumns .right #welcome .header #resize .left { width: 183px; margin: 0; padding: 4px 7px 0 0; text-align: right; color: #777777; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; }
#body #height .top #bodyColumns .right #welcome .header #resize .right { width: 85px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize { width: 85px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer { list-style: none; display: inline; margin: 0px; padding: 0px; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer li { display: inline; margin: 0px; margin-right: 5px; padding: 0px; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer a { color: #000000; border: solid 1px #ffffff; padding: 2px 3px; font-weight: bold; text-decoration: none; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer a:hover { color: #000000; border: solid 1px #dadada; text-decoration: none; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer .medium-text { font-size: 13px; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer .large-text { font-size: 16px; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer .larger-text { font-size: 19px; }
#body #height .top #bodyColumns .right #welcome .header #resize #textSize ul.textresizer a.textresizer-active { border: solid 1px #dadada; background: #f8f8f8; color: #000000; }
#body #height .top #bodyColumns .right #welcome .body { width: 550px; margin: 0; padding: 0; color: #4d4d4d; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 20px; }
#body #height .top #bodyColumns .right #welcome .body p { margin: 0; padding: 0; }
/*###########################################
## Connect ##
###########################################*/
#body #height .top #bodyColumns .right #contentColumns .left #connect { width: 214px; margin: 0; padding: 0 0 30px 0; border-bottom: 1px solid #e2e2e2; }
#body #height .top #bodyColumns .right #contentColumns .left #connect h2 { margin: 0; padding: 3px 0 0 0; color: #4d4d4d; font-size: 28px; font-weight: normal; letter-spacing: -0.02em; line-height: 28px; }
#body #height .top #bodyColumns .right #contentColumns .left #connect ul { list-style: none; margin: 8px 0 0 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .left #connect ul li { width: 214px; margin: 0 0 2px 0; padding: 0px; }
#body #height .top #bodyColumns .right #contentColumns .left #connect ul li a { display: block; margin: 0; color: #777777; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 13px; text-decoration: none; }
#body #height .top #bodyColumns .right #contentColumns .left #connect ul li a:hover { text-decoration: underline; }
#body #height .top #bodyColumns .right #contentColumns .left #connect ul li b { font-style: italic; }
#body #height .top #bodyColumns .right #contentColumns .left #connect .twitter { min-height: 23px; padding: 9px 0 0 35px; background: url('/images/front_contact_twitter.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #connect .facebook { min-height: 21px; padding: 8px 0 0 35px; background: url('/images/front_contact_facebook.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #connect .goodreads { min-height: 21px; padding: 6px 0 0 35px; background: url('/images/front_contact_goodreads.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #connect .flickr { min-height: 21px; padding: 8px 0 0 35px; background: url('/images/front_contact_flickr.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #connect .youtube { min-height: 23px; padding: 8px 0 0 35px; background: url('/images/front_contact_youtube.jpg') no-repeat top left; }
/*###########################################
## How Do I... ##
###########################################*/
#body #height .top #bodyColumns .right #contentColumns .right #howdoi { width: 309px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .header { width: 309px; margin: 0 0 8px 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .header .title { width: 165px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .header .title h2 { margin: 0; padding: 3px 0 0 27px; color: #4d4d4d; font-size: 28px; font-weight: normal; letter-spacing: -0.02em; line-height: 28px; background: url('/images/front_howdoi_icon.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .header .description { width: 134px; margin: 0; padding: 14px 10px 0 0; color: #4d4d4d; font-size: 12px; font-weight: normal; letter-spacing: -0.02em; line-height: 12px; text-align: right; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul { list-style: none; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li { margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question { width: 309px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .q { width: 30px; margin: 0; padding: 0; color: #777777; font-size: 20px; font-weight: bold; font-family: Trebuchet MS; text-align: center; line-height: 20px; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content { width: 265px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content h4 { height: auto; font-style: italic; margin: 4px 0 4px 0; padding: 0; line-height: 16px; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content h4 b { font-style: normal; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content h4 a { color: #007ec4; font-size: 14px; font-weight: normal; font-family: Trebuchet MS; line-height: 16px; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content h4 a:hover { color: #007ec4; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content p { margin: 0 0 10px 0; padding: 0; color: #777777; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 14px; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content a { color: #000000; font-size: 12px; font-weight: bold; text-decoration: none; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi ul li .question .content a:hover { color: #000000; text-decoration: underline; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .browse { width: 300px; margin: 10px 0 0 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .browse h3 { width: 300px; height: 50px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #howdoi .browse h3 a { background: url('/images/front_howdoi_browse.jpg') no-repeat top left; width: 300px; height: 50px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
/*###########################################
## Stay Connected! ##
###########################################*/
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected { width: 214px; margin: 0; padding: 28px 0 28px 0; border-bottom: 1px solid #e2e2e2; }
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected h2 { margin: 0; padding: 0; color: #4d4d4d; font-size: 28px; font-weight: normal; letter-spacing: -0.02em; line-height: 28px; }
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected h4 { margin: 3px 0 0 0; padding: 0; color: #4d4d4d; font-size: 15px; font-weight: normal; letter-spacing: -0.02em; line-height: 12px; }
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected #emailUpdates { width: 211px; margin: 10px 0 0 0; padding: 6px 0 0 0; background: url('/images/front_email_top.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected #emailUpdates form { margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected #emailUpdates input[type="text"] { width: 187px; height: 26px; margin: 0; padding: 0 12px 0 12px; border: 0; background: url('/images/front_email_input.jpg') no-repeat top left; color: #919191; font-size: 14px; font-weight: normal; font-family: Trebuchet MS; line-height: 14px; }
#body #height .top #bodyColumns .right #contentColumns .left #stayConnected #emailUpdates .bottom { width: 211px; margin: 0; padding: 12px 0 0 0; background: url('/images/front_email_bottom.jpg') no-repeat top left; text-align: right; }
/*###########################################
## Photos ##
###########################################*/
#body #height .top #bodyColumns .right #contentColumns .right #photos { width: 309px; margin: 40px 0 0 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header { width: 309px; margin: 0 0 12px 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header .title { width: 135px; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header .title h2 { margin: 0; padding: 0 0 0 27px; color: #4d4d4d; font-size: 28px; font-weight: normal; letter-spacing: -0.02em; line-height: 28px; background: url('/images/front_photos_icon.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header .description { width: 164px; margin: 0; padding: 8px 10px 0 0; color: #4d4d4d; font-size: 12px; font-weight: normal; letter-spacing: -0.02em; line-height: 12px; text-align: left; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header .description h4 { height: 14px; margin: 0; padding: 2px 0 0 20px; color: #4d4d4d; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 13px; background: url('/images/front_photos_flickr.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header .description h4 a { color: #4d4d4d; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 13px; text-decoration: none; }
#body #height .top #bodyColumns .right #contentColumns .right #photos .header .description h4 a:hover { text-decoration: underline; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul { list-style: none; margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul li { margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo { width: 309px; margin: 0 0 12px 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .thumb { width: 60px; height: 60px; margin: 0 10px 0 0; padding: 5px 5px 5px 5px; background: url('/images/front_photos_thumb.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .thumb img { border: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details { width: 229px; margin: 0; padding: 4px 0 0 0; line-height: 14px; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details h3 { margin: 0; padding: 0; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details h3 a { color: #007ec4; font-size: 12px; font-weight: bold; font-family: Trebuchet MS; line-height: 12px; text-decoration: none; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details h3 a:hover { text-decoration: underline; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details h4 { margin: 0; padding: 0; color: #4d4d4d; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; font-style: italic; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details p { margin: 0; padding: 0; color: #777777; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 14px; font-style: italic; }
#body #height .top #bodyColumns .right #contentColumns .right #photos ul .photo .details b { font-style: normal; color: #4d4d4d; font-size: 11px; }
/*###########################################
## Audio Books ##
###########################################*/
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks { width: 144px; min-height: 90px; margin: 28px 0 0 0; padding: 0 0 28px 70px; background: url('/images/front_audiobooks_bg.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks h2 { margin: 0; padding: 0; color: #4d4d4d; font-size: 28px; font-weight: normal; letter-spacing: -0.02em; line-height: 28px; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks h4 { height: 14px; margin: 0 0 10px 0; padding: 2px 0 0 20px; color: #4d4d4d; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; background: url('/images/front_audiobooks_apple.jpg') no-repeat top left; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks .push { width: 89px; margin: 0 0 0 55px; padding: 0; text-align: center; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks .push h3 { margin: 0; padding: 0; color: #639f47; font-size: 18px; font-weight: bold; letter-spacing: -0.02em; line-height: 18px; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks .push h3 a { color: #639f47; font-size: 18px; font-weight: bold; letter-spacing: -0.02em; line-height: 18px; text-decoration: none; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks .push h3 a:hover { color: #000000; text-decoration: underline; }
#body #height .top #bodyColumns .right #contentColumns .left #audioBooks .push p { margin: -2px 0 0 0; padding: 0; color: #777777; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; }
/*###########################################
## Back To Top ##
###########################################*/
#body #height .top #bodyColumns .left #backToTop { width: 295px; height: 30px; margin: 0 0 22px 0; padding: 0 5px 0 0; }
#body #height .top #bodyColumns .left #backToTop h2 { width: 80px; height: 27px; margin: 0 0 0 215px; padding: 0; }
#body #height .top #bodyColumns .left #backToTop h2 a { background: url('/images/front_backToTop.jpg') no-repeat top left; width: 80px; height: 27px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
/*##############################################################################
##############################################################################*/
/*##############################################################################
##############################################################################
## Bottom ##
############################################################################*/
#bottom { width: 884px; min-height: 100px; margin: 0; padding: 20px 60px 0 60px; background: url('/images/front_bottom.jpg') no-repeat top left; }
#bottom .logo { width: 83px; margin: 0 32px 0 0; padding: 0; }
#bottom .logo h1 { width: 83px; height: 148px; margin: 0 0 15px 0; padding: 0; }
#bottom .logo h1 a { background: url('/images/front_bottom_logo.jpg') no-repeat top left; width: 83px; height: 148px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
#bottom .contact { width: 375px; margin: 0; padding: 17px 0 0 0; }
#bottom .contact p { margin: 0 0 10px 0; padding: 0; color: #9abad8; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 14px; }
#bottom .contact .columns { width: 375px; margin: 0; padding: 0; }
#bottom .contact .columns .left { width: 177px; margin: 0 10px 0 0; padding: 0; }
#bottom .contact .columns .right { width: 178px; margin: 0 10px 0 0; padding: 0; }
#bottom .contact .columns h2 { margin: 0; padding: 0; color: #ffffff; font-size: 18px; font-weight: normal; letter-spacing: -0.02em; line-height: 18px; }
#bottom .contact .columns p { margin: 0; padding: 0; color: #ffffff; font-size: 12px; font-weight: normal; font-family: Trebuchet MS; line-height: 16px; }
#bottom .contact .columns b { font-size: 14px; }
#bottom .contact .columns a { color: #ffca5f; text-decoration: none; }
#bottom .contact .columns a:hover { text-decoration: underline; }
#bottom .legal { width: 394px; margin: 0; padding: 25px 0 0 0; }
#bottom .legal p { width: 394px; margin: 0 0 4px 0; padding: 0; color: #ffffff; font-size: 10px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; text-align: right; }
#bottom .legal .sitemap { width: 394px; margin: 0 0 2px 0; padding: 0; text-align: right; color: #ffffff; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 16px; }
#bottom .legal .sitemap a { color: #c1ddf6; font-size: 11px; font-weight: normal; font-family: Trebuchet MS; line-height: 12px; text-decoration: none; }
#bottom .legal .sitemap a:hover { color: #ffffff; text-decoration: none; }
#bottom .legal .credit { margin: 0; padding: 0; }
#bottom .legal .credit h4 { width: 248px; height: 22px; margin: 0px 0 0 146px; padding: 0; }
#bottom .legal .credit h4 a { background: url('/images/flex360.jpg') no-repeat top left; width: 248px; height: 22px; margin: 0; padding: 0; display: block; text-indent: -99999px; cursor: pointer; }
/*##############################################################################
##############################################################################*/
/*##############################################################################
##############################################################################
## Dropdown Navigation ##
############################################################################*/
/* Controls */
.mainNav li:hover, .mainNav li.over { position: static; /* make menus not sticky in ie7 */ }
.mainNav li ul { position: absolute; left: -999em; list-style: none; }
.mainNav li:hover ul { left: auto; }
.mainNav li:hover ul, .mainNav li.sfhover ul { left: auto; }
/* Dropdown */
.dropdownNav { z-index: 99; position: absolute; width: 220px; margin: 0 0 0 -5px !important; padding: 9px 0 9px 0 !important; line-height: 12px; background: url('/images/dropdown_bg.png') repeat top left; }
.dropdownNav li { width: 220px; height: auto; margin: 0 !important; padding: 0 !important; line-height: 12px; text-align: left; border-left: 0 !important; }
.dropdownNav li a { display: block; width: 194px; margin: 0 !important; padding: 4px 10px 3px 15px !important; color: #ffffff !important; font-size: 12px !important; font-weight: bold !important; text-decoration: none; cursor: pointer; border-left: 0 !important; }
.dropdownNav li a:hover { margin: 0; padding: 4px 10px 3px 15px; color: #ffffff; font-size: 12px; font-weight: bold; text-decoration: none; background: #639f47; cursor: pointer; }
/* Individual Containers */
/*.navigation li { margin: 0 26px 0 0; padding: 0; }*/
/*##############################################################################
##############################################################################*/
/*###########################################
## Universals ##
###########################################*/
.clear { clear: both; }