/* Puffin Books */ /* === colours === background #45CCE6 head dashed border #FADE15 searchtxt bg #D5F4F9 to #FFFFFF searchtxt border #DCF6FA searchtxt color #4CBABB nav font #7C7018/#000000 nav item border #FADE15 secondary nav border #D4EFF4 main group borders #9FDDEA h2 #00B8E4 h3 #59BEBF h4 #59BEBF a #91873D a hover #000000 ptv humb bg #FFFFFF to #CDF0F7 footer bg #F6f3E1 series rhs text #59BEBF book details pipe #22C1E8 news rhs month #00B8E4 button states:inactive/active/active:hover/active:click | light to dark ================ */ /* ================================================== */ /* ===================== DEVELOPMENT ================ */ /* ================================================== */ .red { border:1px solid red; } .wht { border:1px solid white; } .blu { border:1px solid blue; } /* ================================================== */ /* ===================== ELEMENTS =================== */ /* ================================================== */ body { padding:0; margin:0; font:normal 12px Arial, Helvetica, sans-serif; line-height:1.4em; color:#000; background:none; } h2 { text-transform:lowercase; font-size:1.6em; font-weight:bold; color:#00B8E4; margin-bottom:10px; } h3 { font-size:1em; font-weight:bold; color:#59BEBF; } h4 { font-size:1em; font-weight:normal; color:#59BEBF; margin-bottom:10px; } a { color:#91873D; text-decoration:none; cursor:pointer; } a:hover { color:#000; } a.current { color:#000; } img { border:none;} strong { font-weight:bold; } hr { border:1px dashed #FADE15; } ol.decimal { margin-left:20px; list-style-type:decimal; padding-bottom:10px; } small { font-size:0.7em;} .invis { display:none; } .back-to-top { border:none; text-align:left; } .back-to-top img { position:relative; top:12px; } .back-to-top p { border:none; margin-left:25px; } #top { display:none; } /* ================================================== */ /* ===================== GLOBAL ===================== */ /* ================================================== */ /* === container === */ #container { background:none; width:1000px; margin:0 auto; padding-bottom:20px; overflow:none; font-size:100%; } /* === head === */ #headcon { background:none; width:1000px; height:150px; margin:10px 0;} #logocon { background:none; width:984px; height:140px; } .t_header, .b_header, .l_header, .l_header, .r_header, .bl_header, .br_header, .tl_header, .tr_header { background: none;} #logocon h1 { margin:0; padding:0; } #logocon img.puffin-logo { float:left; padding:30px 30px 30px 30px; } #edsrchcon { display:none; } #headsearch { display:none; } #headsearch form { display:none; } #sharecon { display:none; } /* === nav === */ #nav { display:none; } /* === left column === */ #leftcolumn { float:left; width:200px; } #side_menu { background:none; } #byage { background:none; padding:20px; } .t_leftcol, .b_leftcol, .l_leftcol, .l_leftcol, .r_leftcol, .bl_leftcol, .br_leftcol, .tl_leftcol, .tr_leftcol { background:none; } #byage h2 { font:bold 1.2em Arial, Helvetica, sans-serif; padding:0; color:#000; } #byage li { padding:10px 0; list-style-type:none;} #byage a { padding:10px 0; text-decoration:none; color:#7C7018; font-size:1.2em; font-weight:bold; } #minibanners { margin-bottom:5px; } #minibanners a { display:block; margin:10px 0; } /* === main column === */ #maincolumn { width:790px; margin-left:210px; } /* === subpages main column === */ #submain_bg { background:none; display:block; width:790px;} #submain { background:none; padding:10px; } /* === main column === */ #breadcrumbs { background:none; text-transform:lowercase; } #breadcrumbs li { display:inline; color:#F8A029; } #breadcrumbs li.home { background:none; margin-left:10px; } /* === one main column === */ #onemaincolumn_bg { padding:10px; } #onemaincolumn { width:1000px; margin:0; background:none; } .clearfloat { clear:both; } /* ================================================== */ /* ===================== 01 HOME ==================== */ /* ================================================== */ #group1_bg { background:none; display:block; width:790px;} #group1 { background:none; padding:10px; border-bottom:2px dashed #9fddea; } .t_content, .b_content, .l_content, .r_content, .bl_content, .br_content, .tl_content, .tr_content, .bl_content2, .br_content2, tl_content2, .tr_content2, .bl_content3, .br_content3, tl_content3, .tr_content3 { background:none; } /* === New Realeases === */ #newrel { width:480px; border-right:2px dashed #D4EFF4; float:left; padding:10px 20px 10px 10px; } #newrel a { color:#91873D; text-decoration:none; } #newrel li { display:block; } #nr-tab1-row1 { display:block; } .nr-tab1-row1-cell { display:block; float:left; width:148px; padding:0 13px 20px 0;} #nr-tab1-row2 { display:block; } .nr-tab1-row2-cell { display:block; float:left; width:148px; padding:0 13px 20px 0; } #nr-tab2-row1 { display:block; } .nr-tab2-row1-cell { display:block; float:left; width:148px; padding:0 13px 20px 0; } #nr-tab2-row2 { display:block; } .nr-tab2-row2-cell { display:block; float:left; width:148px; padding:0 13px 20px 0; } /* === Container & Clip ===*/ #newrel .jcarousel-container { left:-10px; } #newrel .jcarousel-container-horizontal { width:505px; padding:0; } #newrel .jcarousel-clip-horizontal { width:490px; height:720px; left:10px;} #newrel .jcarousel-item { width:485px; } #newrel .jcarousel-item-horizontal { margin-right:10px; } #newrel .jcarousel-item-placeholder { background:none; color:#000; } /* === Next === */ #newrel .jcarousel-next-horizontal { display:none; } /* === Prev === */ #newrel .jcarousel-prev-horizontal { display:none; } #group1right { width:215px; min-height:760px; margin-left:530px; margin-right:5px; } #group1right #accordion div { margin:20px 7px 20px 10px; padding:0; } #group1right #accordion h2 { width:200px; } #group1right #accordion h2.border { border-top:2px dashed #D4EFF4; } #group1right #accordion h3 { padding:20px 0 0 0;} #group1right #accordion p { padding:0 0 10px 0;} #group1right #accordion a { color:#91873D; text-decoration:none; } #group1right #accordion a h2 { background:none; padding:10px; } #bookofweek { margin:20px 0; } #news { margin:20px 0; } #bestsellers { margin:20px 0; } #puffintv { background:none; padding:20px; border-bottom:2px dashed #9fddea; } #puffintv_bg { background:none; margin:10px 0; } .ptv-head { color:#91873d; } #ptv-vid { width:480px; float:left; padding:10px 20px 10px 10px; } #ptv-vid img { padding:10px 0; } #ptv-thumbs img { width:138px; height:78px;} #ptv-thumbs { width:190px; height:360px; margin:-10px 10px 0 530px; padding-bottom:10px; text-align:center; border:none; background:none; } /* === Container & Clip ===*/ #ptv-thumbs .jcarousel-container { text-align:center;} #ptv-thumbs .jcarousel-container-vertical { width:160px; height:290px; padding:40px 10px 40px 20px; text-align:center; } #ptv-thumbs .jcarousel-clip-vertical { width:138px; height:280px; } #ptv-thumbs .jcarousel-item { width:75px; height:75px; } #ptv-thumbs .jcarousel-item-horizontal { margin-right:10px; } #ptv-thumbs .jcarousel-item-vertical { margin:10px 0; } #ptv-thumbs .jcarousel-item-placeholder { background:#FFF;color:#000; } /* === Up === */ #ptv-thumbs .jcarousel-prev-vertical { position:absolute; top:10px; left:80px; width:27px; height:17px; cursor:pointer; background:none; margin:0 auto; } #ptv-thumbs .jcarousel-prev-vertical:hover { background-position:0 -51px; } #ptv-thumbs .jcarousel-prev-vertical:active { background-position:0 -17px; } #ptv-thumbs .jcarousel-prev-disabled-vertical, #ptv-thumbs .jcarousel-prev-disabled-vertical:hover, #ptv-thumbs .jcarousel-prev-disabled-vertical:active { cursor:default;background-position:0 0; } /* === Down === */ #ptv-thumbs .jcarousel-next-vertical { position:absolute; bottom:10px; left:80px; width:27px; height:17px; cursor:pointer; background:none; margin:0 auto; } #ptv-thumbs .jcarousel-next-vertical:hover { background-position:0 -51px; } #ptv-thumbs .jcarousel-next-vertical:active { background-position:0 -17px; } #ptv-thumbs .jcarousel-next-disabled-vertical, #ptv-thumbs .jcarousel-next-disabled-vertical:hover, #ptv-thumbs .jcarousel-next-disabled-vertical:active { cursor:default; background-position:0 0; } /*--------- blog events --------*/ #blogeventscon { border-bottom:2px dashed #9fddea;} #blog_bg { background:none; margin:0 10px 5px 0; width:260px; float:left; } #blog { background:none; padding:20px; width:200px; min-height:250px; border-right:2px dashed #9fddea;} #events_bg { background:none; margin:0; width:520px; float:left; } #events { background:none; padding:20px 10px; width:480px; min-height:250px; } #events_details { width:40%; display:block; float:left; padding:0 2%; } #events_calender { width:55%; display:block; float:left; text-align:center; } #datepicker { padding:0 5px; margin:0; } /* Custom Datepicker overwrites */ .ui-datepicker { border:none; color:#00B8E4; } .ui-datepicker-prev { display:none; } .ui-datepicker-next { display:none; } .ui-datepicker-calendar { border:2px dashed #FACE15; } table.ui-datepicker-calendar { border-collapse:separate; padding:5px; } .ui-datepicker-header { border:none; background:none; color:#00B8E4; font-weight:bold; } table.ui-datepicker { border-collapse:separate; } .ui-datepicker th { border-right:1px solid #FACE15; border-left:1px solid #FACE15; } .ui-datepicker td { border-right:1px solid #FACE15; border-left:1px solid #FACE15; } .ui-datepicker td a { text-align:center; color:#FFF; padding:5px; } .ui-datepicker td a.ui-state-default { border:none; background:none; color:#00B8E4; font-weight:bold; } .ui-datepicker td a.ui-state-hover { background:none; color:#000; } .ui-datepicker td a.ui-state-active { background:none; color:#000; } .ui-datepicker td a.ui-state-highlight { background:none; color:#000; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity:1; filter:Alpha(Opacity=100); background-image: none; } .ui-widget-header { height:35px;} .ui-widget-header a.ui-state-default { border:none; background:none; } .ui-widget-header a.ui-state-hover { border:none; background:none; } .ui-widget-header a.ui-state-active { border:none; background:none; } .ui-widget-header a.ui-state-highlight { border:none; background:none; } .ui-widget-header .ui-icon { width: 17px; height:30px; background:none; } .ui-state-default .ui-icon { background:none;/*{iconsDefault}*/; } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon { bbackground:none;/*{iconsHover}*/; } .ui-state-active .ui-icon { background:none;/*{iconsActive}*/; } .ui-state-highlight .ui-icon { background:none;/*{iconsHighlight}*/; } .ui-icon-circle-triangle-w { background-position:-85px 0; } .ui-icon-circle-triangle-e { background-position:-51px 0px; } .ui-datepicker-header { width:225px;} .ui-datepicker-title { position:relative; top:8px; } #fullcal .ui-datepicker { text-align:center; width:730px; } #fullcal .ui-datepicker-header { margin-left:5px; width:720px;} #fullcal .ui-datepicker-title { font-size:2em; position:relative; top:-5px; text-transform:lowercase; } #fullcal .ui-datepicker table { border:none; } #fullcal table.ui-datepicker-calendar th { background:#EEE; width:100px; height:100px; font-size:1.6em; border:1px solid #FFF; text-transform:lowercase; } #fullcal table.ui-datepicker-calendar td { background:#9FDDEA; height:100px; font-size:1.6em; border:1px solid #FFF; } #fullcal table.ui-datepicker-calendar td a { text-align:left; height:100px; } #fullcal ul { margin:0 auto; text-align:center; margin-left:50px; } #fullcal ul.navigation li.last { border:none;} #fullcal .ui-datepicker td a.ui-state-default { border:none; background:none; color:#FFF; font-weight:bold; } /* Your favourite characters */ #yourfavchars_bg { background:none; margin:5px 0 10px 0; width:790px; /* normal column width is 790px (-40 padding + 5 position left )*/ } #yourfavchars { background:none; padding:10px; width:790px; /* normal column width is 790px (-40 padding + 5 position left )*/ border-bottom:2px dashed #9fddea; } #yourfavchars h2 { padding:10px 10px 0 10px; } /* Carousel item img */ #yfc-carousel img { border:none; } /* === Container & Clip ===*/ #yourfavchars .jcarousel-container { left:-5px; } #yourfavchars .jcarousel-container-horizontal { width:685px; padding:10px 40px; } #yourfavchars .jcarousel-clip-horizontal { width:660px; height:90px; left:10px; } #yourfavchars .jcarousel-item { width:auto; } #yourfavchars .jcarousel-item-horizontal { margin-right:9px; } #yourfavchars .jcarousel-item-placeholder { background:none; color:#000; } /* === Next === */ #yourfavchars .jcarousel-next-horizontal { display:none; } /* === Prev === */ #yourfavchars .jcarousel-prev-horizontal { display:none; } /* ================================================== */ /* ===================== 02 FIND A BOOK ============= */ /* ================================================== */ /* === Main Left === */ #find-left { width:700px; padding:10px 20px 10px 10px; } #find-left #intro { padding-bottom:20px; } #find-left h3 { padding:20px 0 10px 0;} #find-left p { padding:0 0 10px 0; margin-bottom:10px; } #find-left a { color:#000; text-decoration:none; } #find-left li { list-style-type:none; } #find-left li li { list-style-type:none; } /* ================================================================ */ /* ===================== Customized forms - find a book =========== */ /* ================================================================ */ #find-left fieldset { background:none; padding:0 10px 10px 0; margin-bottom:20px; width:680px; border:none; } #find-left input, textarea, select { padding:0; font:12px/12px Arial, Helvetica, sans-serif;} #find-left fieldset.action { text-align:right;} #find-left label { font-weight:bold; color:#f8a637;} #find-left label.opt { font-weight:normal; position:absolute;margin-top:-20px; padding:0; } #find-left dl { clear:both;} #find-left dt { float:left; text-align:left; width:200px; line-height:25px; margin:0 10px 0 0; } #find-left dd { float:left; width:450px; line-height:25px; margin:0; } #find-left dd#checkbox { float:left; width:20px; line-height:25px; margin:0; padding:0;} /*Text inputs*/ #find-left .NFText { border:none; vertical-align:middle; background:none;} #find-left .NFTextCenter { height:15px; background:none; padding:3px 0; margin:0; float:left; line-height:15px;} #find-left .NFTextLeft, #find-left .NFTextRight { width:7px; height:21px; vertical-align:middle; float:left;} #find-left .NFTextLeft { background:none; } #find-left .NFTextRight { background:none; } /*Radio*/ #find-left .NFRadio { display:none; } /*Checkbox*/ #find-left .NFCheck { display:none; } /*Buttons*/ #find-left .NFButton { display:none; } #find-left .NFButtonLeft, #find-left .NFButtonRight { width:6px; height:26px; vertical-align:middle;} #find-left .NFButtonLeft { background:none; } #find-left .NFButtonRight { background:none; } /*Textareas*/ #find-left .NFTextarea { border:none; background:none; font:12px/12px Arial, Helvetica, sans-serif; margin:0;} #find-left .NFTextareaTop, #find-left .NFTextareaBottom { height:5px; clear:both; float:none; padding-right:10px;} #find-left .NFTextareaTop { background:none;} #find-left .NFTextareaBottom { background:none; margin-bottom:5px;} #find-left .NFTextareaTopLeft, #find-left .NFTextareaBottomLeft { width:5px; height:5px;} #find-left .NFTextareaTopLeft { background:none;} #find-left .NFTextareaBottomLeft { background:none;} #find-left .NFTextareaLeft, #find-left .NFTextareaRight, #find-left .NFTextareaLeftH, #find-left .NFTextareaRightH { float:left; padding-bottom:5px;} #find-left .NFTextareaLeft, #find-left .NFTextareaLeftH { width:5px;} #find-left .NFTextareaLeft { background:none;} #find-left .NFTextareaLeftH { background:none;} #find-left .NFTextareaRight, .NFTextareaRightH { padding-right:5px; padding-bottom:0;} #find-left .NFTextareaRight { background:none;} #find-left .NFTextareaRightH { background:none;} /*Files*/ #find-left .NFFileButton { padding-bottom:0; vertical-align:bottom; cursor:pointer; background:none; width:60px; height:21px;} #find-left .NFFile { position:relative; margin-bottom:5px;} #find-left .NFFile input.NFhidden { position:relative; filter:alpha(opacity=0); opacity:0; z-index:2; cursor:pointer; text-align:left;} #find-left .NFFileNew { position:absolute; top:0px; left:0px; z-index:1;} /*Selects*/ #find-left .NFSelect { height:21px; position:static; border:1px solid transparent; margin:0; } #find-left .NFSelectLeft { float:left; width:3px; height:21px; background:none; vertical-align:middle;} #find-left .NFSelectRight { height:21px; width:auto; background:none; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#000; padding-left:3px; margin-left:3px;} #find-left .NFSelectTarget { position:static; background:none; margin-left:-13px; margin-top:0; z-index:3; left:0; top:0; padding-bottom:13px;} #find-left .NFSelectOptions { position:relative; background:#daf4f9; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;} #find-left .NFSelectOptions li { padding-bottom:1px;} #find-left .NFSelectOptions a { display:block; text-decoration:none; padding:2px 3px; background:none;} #find-left .NFSelectOptions a.NFOptionActive { background:#464646;} #find-left .NFSelectOptions a:hover { background:#0c78a6;} /*Multiple Selects*/ #find-left .NFMultiSelect { border:0; background:none; margin:0;} #find-left .NFMultiSelectTop, .NFMultiSelectBottom { height:5px; clear:both; float:none; padding-right:10px;} #find-left .NFMultiSelectTop { background:none;} #find-left .NFMultiSelectBottom { background:none; margin-bottom:5px;} #find-left .NFMultiSelectTopLeft, #find-left .NFMultiSelectBottomLeft { width:5px; height:5px;} #find-left .NFMultiSelectTopLeft { background:none;} #find-left .NFMultiSelectBottomLeft { background:none;} #find-left .NFMultiSelectLeft, #find-left .NFMultiSelectRight, #find-left .NFMultiSelectLeftH, #find-left .NFMultiSelectRightH { float:left; padding-bottom:5px;} #find-left .NFMultiSelectLeft, #find-left .NFMultiSelectLeftH { width:5px;} #find-left .NFMultiSelectLeft { background:none;} #find-left .NFMultiSelectLeftH { background:none;} #find-left .NFMultiSelectRight, #find-left .NFMultiSelectRightH { padding-right:5px; padding-bottom:0;} #find-left .NFMultiSelectRight { background:none;} #find-left .NFMultiSelectRightH { background:none;} /*Focused*/ #find-left .NFfocused { border:1px dotted #666;} /*Hovered*/ #find-left .NFh { background-position:0 100%;} #find-left .NFhr { background-position:100% 100%;} /*Hidden*/ #find-left .NFhidden { opacity:0; z-index:-1; position:relative;} /*Safari*/ #find-left select, input, textarea, button { outline:none; resize:none;} /* ================================================== */ /* ===================== 03 AUTHORS & ILLUSTRATORS == */ /* ================================================== */ /* === Main Left === */ #author-left { width:700px; padding:10px 20px 10px 10px; } #alphanav li { display:inline; text-transform:lowercase; font-size:1.4em; font-weight:bold; color:#CCC;} #alphanav a { padding:5px;} /* ================================================== */ /* ===================== 04 FAVOURITE CHARACTERS ==== */ /* ================================================== */ /* === Main Left === */ #fave-left { width:700px; padding:10px 20px 10px 10px; } #fave-left p { padding:0 0 10px 0; margin-bottom:10px; } #fave-left ul { width:730px; } #fave-left li { display:inline; width:221px; } /* ================================================== */ /* ===================== 05 SERIES ================== */ /* ================================================== */ /* === Main Left === */ #series-left { width:460px; border-right:2px dashed #D4EFF4; padding:10px 20px 10px 10px; } #series-left #intro { padding-bottom:20px; } #series-left #intro h2 { padding-bottom:10px;} #series-left #accordion div.accmod { margin:0; padding:0; border-bottom:2px dashed #FACE15; } #series-left #accordion h3.border { border-bottom:2px dashed #FADE15; } #series-left #accordion h3 { padding:20px 0 0 0; width:450px;} #series-left #accordion p { padding:0 0 10px 0; margin-bottom:10px; } #series-left #accordion a { color:#91873D; text-decoration:none; } #series-left #accordion a h3 { background:none; padding:10px 0 10px 0; color:#91873D; } #series-right { width:220px; float:right; margin-top:40px; margin-right:20px; color:#59BEBF;} #series-right div { margin:20px 20px 50px 10px; padding:0; } #series-right h2 { margin-bottom:20px; } #series-right img { margin-bottom:20px; } #series-left #accordion .accmod ul { margin:0; padding:0; } #series-left #accordion .accmod li { float:left; padding:10px; } /* ================================================== */ /* ===================== 06 NEWS ==================== */ /* ================================================== */ /* === Main Left === */ #news-left { width:460px; border-right:2px dashed #D4EFF4; padding:10px 20px 10px 10px; } #news-left #intro { padding-bottom:20px; } #news-left #intro h2 { padding-bottom:10px; } #news-left #list-item { height:150px; border:1px solid #FFF;} #news-left #list-item img { float:left; } #news-left #list-item h4 { margin:30px 20px 5px 125px; color:#000; font-weight:bold; } #news-left #list-item p { margin:0 20px 5px 125px; } #news-right { width:220px; margin-top:40px; margin-right:20px; color:#59BEBF; float:right; } #news-right div { margin:20px 20px 50px 10px; padding:0; } #news-right h2 { margin-bottom:20px; } /* === Container & Clip ===*/ #news-right .jcarousel-container { left:0; margin:0; padding:0; } #news-right .jcarousel-container-horizontal { width:270px; padding:0; } #news-right .jcarousel-clip-horizontal { width:220px; left:10px; } #news-right .jcarousel-item { width:215px; } #news-right .jcarousel-item-horizontal { margin-right:10px; } #news-right .jcarousel-item-placeholder { background:none; color:#000; } /* === Next === */ #news-right .jcarousel-next-horizontal { display:none; } /* === Prev === */ #news-right .jcarousel-prev-horizontal { display:none; } /* ================================================== */ /* ===================== 07 COMPETITIONS ============ */ /* ================================================== */ /* === Main Left === */ #comp-left { width:460px; border-right:2px dashed #D4EFF4; padding:10px 20px 10px 10px; } #comp-left #intro { padding-bottom:20px; } #comp-left #intro h2 { padding-bottom:10px; } #comp-left #accordion div.accmod { margin:0; padding:0; border-bottom:2px dashed #FACE15; } #comp-left #accordion h3.border { border-bottom:2px dashed #FADE15; } #comp-left #accordion h3 { padding:20px 0 0 0; width:460px;} #comp-left #accordion p { padding:0 0 10px 0; margin-bottom:10px; } #comp-left #accordion a { color:#91873D; text-decoration:none; } #comp-left #accordion a h3 { background:none; padding:10px 0 10px 0; color:#91873D; } #comp-right { width:220px; margin-top:40px; margin-right:20px; color:#59BEBF; float:right; } #comp-right div { margin:20px 20px 50px 10px; padding:0; } #comp-right h2 { margin-bottom:20px; } #comp-right img { margin-bottom:20px; } /* ================================================== */ /* ===================== 08 EVENTS ================== */ /* ================================================== */ /* === Main Left === */ #events-left { width:700px; padding:10px 20px 10px 10px; } #events-left #intro { padding-bottom:20px; } #events-left #intro h2 { padding-bottom:10px; } #events-left div.accmod { margin:0; padding:0; border-bottom:2px dashed #FACE15; } #events-left h3.border { border-bottom:2px dashed #FADE15; } #events-left h3 { padding:20px 0 0 0;} #events-left p { padding:0 0 10px 0; margin-bottom:10px; } #events-left a { color:#91873D; text-decoration:none; } #events-left a h3 { background:none; padding:10px 0 10px 0; color:#91873D; } /* ================================================== */ /* ===================== 08 EVENTS 2 ================== */ /* ================================================== */ #calender { width:700px; position:relative; } #calender .box { background-color: #fff; color: #6cc7c8; font-size: 12px; border:3px solid #9fddea; } #calender .box em { color:#f8a029; } #calender .box p { padding: 10px; } #calender .box span { float: left; font-size: 26px; font-weight: bold; color:#9fddea; } #calender .box ul { list-style-type:none; padding-left:10px; margin:0; padding:0;} #calender .box li { margin-left:10px; padding:0; text-align:left;} #calender div.alt { background-color: #9fddea; color: #FFF; font-size:12px; border:3px solid #e6f0f2; } #calender div.alt span { color: #FFF; } .events_facebook { padding:10px;} /* ================================================== */ /* ===================== 09 FUN STUFF =============== */ /* ================================================== */ /* === Main Left === */ #fun-left { width:460px; border-right:8px dashed #D4EFF4; padding:10px 20px 10px 10px; } #fun-left #intro { padding-bottom:20px; } #fun-left #intro h2 { padding-bottom:10px; } #fun-left #accordion div.accmod { margin:0; padding:0; border-bottom:2px dashed #FACE15; } #fun-left #accordion h3.border { border-bottom:2px dashed #FADE15; } #fun-left #accordion h3 { padding:20px 0 0 0; width:460px;} #fun-left #accordion p { padding:0 0 10px 0; margin-bottom:10px; } #fun-left #accordion a { color:#91873D; text-decoration:none; } #fun-left #accordion a:hover { color:#000; text-decoration:none; } #fun-right { width:220px; margin-top:40px; margin-right:20px; color:#59BEBF; float:right; } #fun-right div { margin:20px 20px 50px 10px; padding:0; } #fun-right h2 { margin-bottom:20px; } #fun-right h2.border { border-top:8px dashed #D4EFF4; padding-top:20px; margin-top:20px; } #fun-right img { margin-bottom:20px; } #fun-right strong { color:#000; } #wpthumbs { height:auto; padding-top:40px; } #wpthumbs img { height:113px; } #wpthumbs a:hover { color:#000; text-decoration:none; } #wpthumbs ul.accordion { list-style-type:none; width:480px; } #wpthumbs ul.accordion li { float:left; margin:0; padding:0; width:225px; height:150px; } #wpthumbs ul.accordion li a { height:113px; } #wpthumbs ul.accordion img { box-shadow:5px 5px 5px #999;} /* ================================================== */ /* ===================== 10 ABOUT PUFFIN ============ */ /* ================================================== */ /* === Main Left === */ #about-left { width:460px; border-right:2px dashed #D4EFF4; padding:10px 20px 10px 10px; } #about-left #intro { padding-bottom:20px; } #about-left #intro h2 { padding-bottom:10px; } #about-left #accordion div.accmod { margin:0; padding:0; border-bottom:2px dashed #FACE15; } #about-left #intro h3.border { border-bottom:2px dashed #FADE15; } #about-left #intro h3 { padding:20px 0 0 0;} #about-left #intro p { padding:0 0 10px 0; margin-bottom:10px; } #about-left #intro a { color:#91873D; text-decoration:none; } #about-left #intro a h3 { background:none; padding:10px 0 10px 0; color:#91873D; } #about-right { width:220px; margin-top:40px; margin-right:20px; color:#59BEBF; float:right; } #about-right div { margin:20px; padding:0; width:200px; } #about-right h2 { margin-bottom:20px; } #about-right h2.border { border-top:8px dashed #D4EFF4; padding-top:20px; margin-top:20px; } #about-right div.logodev { text-align:center;} #about-right div.logodev p { float:left;} #about-right div.logodev img { margin-left:-30px; } #about-right strong { color:#000; } /* ================================================== */ /* ===================== CATALOGUE ================== */ /* ================================================== */ /* === Main Left === */ #catalogue-left { width:700px; padding:10px 20px 10px 10px; } #catalogue-left #intro { padding-bottom:20px; } #catalogue-left h3 { padding:20px 0 0 0;} #catalogue-left p { padding:0; margin-bottom:10px; } #catalogue-left a { color:#91873D; text-decoration:none; } #catalogue-left form a { color:#000; text-decoration:none; } #catalogue-left form a:hover { color:#fff; text-decoration:none; } #catalogue-left form li { list-style-type:none; } #catalogue-left form li li { list-style-type:none; } #list-control { display:block; width:700px; height:50px; } #view-switch { float:left; width:450px; margin-top:-10px; } #view-switch a { outline:none; } #view-switch ul { display:block; } #view-switch li { display:block; float:left; padding-right:10px; } #view-switch li p { display:inline; width:70px; position:relative; top:10px; padding:0; margin-right:10px; font-weight:bold; color:#F8A029; text-transform:lowercase; } #view-switch .switch { display:block; width:173px; height:38px; cursor:pointer; } #catalogue-left #sort { margin-left:450px; width:250px; } #catalogue-left #list { margin-top:30px; top:400px; position:absolute; } #catalogue-left #list img { width:85%; margin:0px; } #catalogue-left #list ul#wrapper { width:690px; } #catalogue-left #list ul li.list_inline { width:32%; display:block; float:left; padding-bottom:30px; } /* === Gallery View Styles === */ #catalogue-left #list ul li img { width:85%; } #catalogue-left #list img.more-arrow { height:14px; width:8px; border:0; padding-top:20px; } #catalogue-left .book-details { width:90%; } #catalogue-left .book-details ul { width:100%; padding:0; margin:0; } /* ---- show-hide elements ---- */ #catalogue-left #list li .show { display:block; width:auto; height:300px; } #catalogue-left #list li .hide { color:#000; text-align: left; height: 0; overflow: hidden; background-color:#fff; } #catalogue-left #list li:hover .show, #catalogue-left #list li.over .show { height: 0; overflow: hidden; cursor: pointer; } #catalogue-left #list li:hover .hide, #catalogue-left #list li.over .hide { display:block; cursor: pointer; height: 290px; padding:0 10px 10px 10px; width:auto; } /* === List View Styles === */ #catalogue-left #list ul.list-view li.list_inline { width:100%; display:block; padding-bottom:30px; } #catalogue-left #list ul.list-view .book-details { width:82%; float:left; height:170px;} #catalogue-left #list ul.list-view li { display:block; width:220px; height:300px; margin:0px; padding-bottom:20px; vertical-align:middle; } #catalogue-left #list ul.list-view li ul { width:100%;} #catalogue-left #list ul.list-view li { width:100%; height:70%; padding-top:10px; padding-bottom:10px; border-bottom:1px solid #FADE15; } #catalogue-left #list ul.list-view li li { display:inline; border:none; padding:0; margin:0; margin-right:5px; padding-right:10px; border-right:1px solid #22C1E8 } #catalogue-left #list ul.list-view li li.last { border:none; } #catalogue-left #list ul.list-view li a img { border:none; } #catalogue-left #list ul.list-view li .show { float:left; height:150px; width:15%; } #catalogue-left #list ul.list-view li .show img { height:100px; width:auto; margin-top:20px; } #catalogue-left #list ul.list-view li a img.more-arrow { height:14px; width:8px; border:none; float:right; } #catalogue-left #list ul.list-view .hide { overflow:visible; display:block; height: 150px; width:100%; padding:0; margin:0; background:#fff; } #catalogue-left #list ul.list-view li.over .show { height: 150px; overflow:visible; cursor: pointer; background:#f1f9fd; } #catalogue-left #list ul.list-view li.over .hide { display:block; cursor: pointer; height: 150px; width:100%; padding:0; background:#f1f9fd; } #catalogue-left #pagination { display:none; } #sort fieldset { margin-bottom:-10px; border:none; } /* ============================================================================= */ /* ===================== Customized forms - search results - sorting =========== */ /* ============================================================================= */ #sort fieldset { background:none; padding:0; margin:0; width:200px; } #sort input, textarea, select { padding:0; font:12px/12px Arial, Helvetica, sans-serif;} #sort fieldset.action { text-align:right; } #sort label { font-weight:bold; color:#f8a637;} #sort label.opt { font-weight:normal; position:absolute;margin-top:-10px; padding:0;} #sort dl { padding: 0; clear:both;} #sort dt { text-align:left; width:200px; line-height:15px; margin:0;} #sort dd { width:200px; line-height:10px; margin:0;} /*Selects*/ #sort .NFSelect { height:21px; position:static; border:1px solid transparent;} #sort .NFSelectLeft { float:left; width:3px; height:21px; background:url(../images/form_img/select-left.png) no-repeat 0 0; vertical-align:middle;} #sort .NFSelectRight { height:21px; width:auto; background:url(../images/form_img/select-right.png) no-repeat 100% 0; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#000; padding-left:3px; margin-left:3px;} #sort .NFSelectTarget { position:static; background:none; margin-left:-13px; margin-top:0; z-index:3; left:0; top:0; padding-bottom:0;} #sort .NFSelectOptions { position:relative; background:#daf4f9; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;} #sort .NFSelectOptions li { padding-bottom:1px;} #sort .NFSelectOptions a { display:block; text-decoration:none; padding:2px 3px; background:none;} #sort .NFSelectOptions a.NFOptionActive { background:#464646;} #sort .NFSelectOptions a:hover { background:#0c78a6;} /*Radio*/ #sort .NFRadio { cursor:pointer; position:static; display:block; width:13px; height:13px; border:1px solid transparent; margin:0; background:url(../images/form_img/radio.png) no-repeat 0 0; z-index:2;} /*Checkbox*/ #sort .NFCheck { cursor:pointer; position:static; display:block; width:12px; height:12px; border:1px solid transparent; margin:0; background:url(../images/form_img/checkbox.png) no-repeat 0 0; z-index:2;} /*Buttons*/ #sort .NFButton { width:auto; height:26px; color:#fff; padding:0 2px;} /*Focused*/ #sort .NFfocused { border:1px dotted #666;} /*Hovered*/ #sort .NFh { background-position:0 100%;} #sort .NFhr { background-position:100% 100%;} /*Hidden*/ #sort .NFhidden { opacity:0; z-index:-1; position:relative;} /*Safari*/ #sort select, input, textarea, button { outline:none; resize:none;} /* ================================================== */ /* ===================== BOOK PROFILE A ============= */ /* ================================================== */ #bookprof-left { float:left; width:220px; text-align:right; margin-top:30px; } #bookprof-left #book-links { margin-right:20px; } #bookprof-left #book-links img { margin:0; } #bookprof-left li { margin:0; padding-bottom:5px;} #bookprof-left img { margin-right:20px; } #bookprof-left ul#side_btn { list-style:none; margin-left:15px; padding:0; text-align:left; } #bookprof-left-meetauthor { clear:both;} #side_btn li,#side_btn li a { height:56px; width:185px; position:relative; display:block; line-height:56px; padding-bottom:10px; margin:0; } /* mac hide \*/ #side_btn li,#side_btn li a { overflow:hidden;} /* end hide*/ #side_btn a { font-size:1em; } #side_btn li em { position:absolute; left:0; top:0; display:block; height:56px; width:185px; } li.meet_author em { background:none; } li.discuss_forum em { background:none; } #bookprof-left img .bookcover { width:185px; height:auto; } #bookprof-left #sharecon { width:205px; margin:0; padding:10px 0; text-align:left; height:60px; } #bookprof-left #sharecon * { padding:0; margin:0; float:left; } #bookprof-left #sharecon iframe { margin-top:5px; } #bookprof-right { margin:0; padding:0; margin-left:240px; width:690px; margin-top:38px; } #bookprof-right .book-details { color:#F8A029; } #bookprof-right .book-details strong { color:#000; } #bookprof-right ul.book-details { width:88%; margin:0; padding:0; } #bookprof-right .book-details li { display:inline; border:none; margin:0; border-right:1px solid #22C1E8; } #bookprof-right li.book-detials-first { padding:0 5px 0 0; margin:0; } #bookprof-right ul.view { width:85%; margin:0; padding:0; text-transform:lowercase; font-weight:bold; } #bookprof-right .view li { display:inline; border:none; margin:0; padding:0 7px 0 7px; border-right:1px solid #22C1E8; } #bookprof-right .view li.first { padding:0 5px 0 0; border:0; } #bookprof-right li.last { border:none; } #bookprof-right .expandable { border-bottom:2px dashed #FACE15; padding-bottom:30px; margin-bottom:30px;} #bookprof-right h3 { font-size:1.2em; color:#FACE15; margin-bottom:20px; text-transform:lowercase; width:690px;} #bookprof-right h3.the_author { font-size:1.2em; color:#FACE15; margin-bottom:20px; text-transform:lowercase; width:500px;} #bookprof-right em { color:#FACE15; } #bookprof-right .expandable p { width:65%; margin-bottom:10px; } #bookprof-right .author { float:right; } #bookprof-right .author img { height:180px; } #bookprof-right .expand { float:right; margin-top:0px; } #bookprof-right .collapse { float:right; margin-top:0px; } #bookprof-right .expandable_also { border-bottom:2px dashed #FACE15; padding-bottom:0; margin-bottom:0; } #bookprof-right .expandable_also h3 { font-size:1.2em; color:#FACE15; margin-bottom:20px; text-transform:lowercase; width:690px; } #bookprof-right .also { text-align:left; width:690px; } #bookprof-right .also li { display:inline; float:left; text-align:center; width:20%; } #bookprof-right .also li a { display:block; } #bookprof-right .also li img { margin-bottom:10px; margin-top:0px; } #video { background:#FFF; margin:10px 0; border-bottom:2px dashed #FACE15; } #embed-video { width:480px; float:left; padding:5px; } #embed-video img { padding:0; } #vid-thumbs { width:175px; height:360px; float:left; padding-bottom:10px; text-align:center; border:1px solid #CDF0F7; background:none; } #vid-thumbs #vid-carousel img { width:138px; height:78px; display:block;} /* === Container & Clip ===*/ #vid-thumbs .jcarousel-container { text-align:center;} #vid-thumbs .jcarousel-container-vertical { width:160px; height:290px; padding:40px 0 40px 20px; text-align:left; background:none;} #vid-thumbs .jcarousel-clip-vertical { width:138px; height:280px; } #vid-thumbs .jcarousel-item { width:75px; height:75px; } #vid-thumbs .jcarousel-item-horizontal { margin-right:10px; } #vid-thumbs .jcarousel-item-vertical { margin:10px auto; } #vid-thumbs .jcarousel-item-placeholder { background:none;color:#000; } /* === Up === */ #vid-thumbs .jcarousel-prev-vertical { position:absolute;top:10px;left:70px;width:27px;height:17px;cursor:pointer; background:none; margin:0 auto; } /* === Down === */ #vid-thumbs .jcarousel-next-vertical { position:absolute; bottom:10px; left:70px; width:27px; height:17px; cursor:pointer; background:none; margin:0 auto; } #bookprof-right #footbanners { display:block; margin-bottom:20px; text-align:left; } #bookprof-right #footbanners li { display:inline; float:left; padding-left:10px;} #bookprof-right #footbanners img { padding:0; margin:0; } #book-links-lookinside a { height:25px; width:124px; position:relative; display:block; line-height:25px; float:right; } #book-links-lookinside em { position:absolute; left:0;top:0; display:block; height:25px; width:124px; background:none; } /* mac hide \*/ #book-links-lookinside a { overflow:hidden;} /* end hide*/ #book-links-lookinside a { font-size:1em;} #book-links-lookinside a:hover { visibility:visible;}/* needed for ie to work*/ #book-links-lookinside a:hover em { background-position:0 -25px;} /* ================================================== */ /* ===================== BOOK PROFILE B ============= */ /* ================================================== */ #book-links-extract a { height:25px; width:124px; position:relative; display:block; line-height:25px; float:right; } #book-links-extract em { position:absolute; left:0;top:0; display:block; height:25px; width:124px; background:none; } /* mac hide \*/ #book-links-extract a { overflow:hidden;} /* end hide*/ #book-links-extract a { font-size:1em;} #book-links-extract a:hover { visibility:visible;}/* needed for ie to work*/ #book-links-extract a:hover em { background-position:0 -25px;} #look-cont { padding-bottom:30px; margin-bottom:30px; border-bottom:2px dashed #FACE15; } #lookinside { margin:10px 0; padding:10px; width:670px; border:1px solid #DCF6FA; background:none;} #lookinside h2 { padding:10px 10px 0 10px; } /* Carousel item img */ #look-carousel img { border:none; } /* === Container & Clip ===*/ #lookinside .jcarousel-container { left:-5px; } #lookinside .jcarousel-container-horizontal { width:600px; padding:10px 40px; } #lookinside .jcarousel-clip-horizontal { width:560px; height:110px; padding:0; margin:0; left:30px; } #lookinside .jcarousel-item { width:auto; padding-bottom:10px;} #lookinside .jcarousel-item-horizontal { margin-right:20px; } #lookinside .jcarousel-item-placeholder { background:none; color:#000; } /* === Next === */ #lookinside .jcarousel-next-horizontal { position:absolute; top:30px; right:5px; width:45px; height:72px; cursor:pointer; background:none; } /* === Prev === */ #lookinside .jcarousel-prev-horizontal { position:absolute; top:30px; left:5px; width:45px; height:72px; cursor:pointer; background:none; } /* === Lightbox === */ #jquery-overlay { display:none; } #jquery-lightbox { display:none; } /* ================================================== */ /* ===================== AUTHOR ===================== */ /* ================================================== */ .expandable_auth .expandable { border-bottom:2px dashed #FACE15; padding-bottom:30px; margin-bottom:30px;} .expandable_auth h3 { font-size:1.2em; color:#FACE15; margin-bottom:20px; text-transform:lowercase; width:690px;} .expandable_auth h3.the_author { font-size:1.2em; color:#FACE15; margin-bottom:20px; text-transform:lowercase; width:500px;} .expandable_auth em { color:#FACE15; } .expandable_auth .expandable p { width:65%; margin-bottom:10px; } .expandable_auth .author { float:right; } .expandable_auth .author img { height:180px; } .expandable_auth .expand { float:right; margin-top:0px; } .expandable_auth .collapse { float:right; margin-top:0px; } .expandable_auth .authprof { width:690px; } .expandable_auth .authprof li { display:inline; float:left; text-align:center; margin-left:0px; margin-right:20px; } .expandable_auth .authprof li a { display:block; } .expandable_auth .authprof li img { margin-bottom:10px; margin-top:0px; } /* === Author Popup ==== */ #popup-background { display:none; position:fixed; _position:absolute; /* hack for internet explorer 6*/ height:100%; width:100%; top:0; left:0; background:none; z-index:1; } #popup-author { padding:0; margin:0; } #popup-author-close { display:block; right:-20px; top:-20px; position:absolute; } #popup-author-content-bg { padding:10px; } #popup-author-content { display:none; position:relative; _position:absolute; /* hack for internet explorer 6*/ z-index:2; padding:10px; text-align:left; background-color:none; margin:0; height:auto; width:700px; padding:0; } #popup-author-head { width:100%; } #popup-author-content h2 { display:block; float:left; margin-top:10px; } #popup-author-content #sharecon { margin:0; padding-top:10px; width:480px; } #popup-author-content #sharecon iframe { padding:0; margin:0;} #popup-author-content hr { clear:both; } #popup-author-body { padding-top:10px; } #popup-author-main { margin:0 165px; padding:0; } #popup-author-img-left { float:left; width:150px; } #popup-author-img-right { float:right; width:150px; } #popup-author-img-left img { width:150px; } #popup-author-img-right img { width:150px; } #author-left-meetauthor { clear:both;} #slider { width:325px; margin:0; padding:0; } #slider h4 { font-size:1.3em; font-weight:bold; color:#00B8E4; } #slider h5 { font-size:1.1em; font-weight:bold; color:#00B8E4; padding-bottom:10px; } ul.navigation { list-style:none; padding-bottom:9px; margin-left:15px; } ul.navigation li { display:inline; border-right:1px solid #FACE15; } ul.navigation li.last { border:0; } ul.navigation a { padding:5px; } ul.navigation a:focus { outline:none; } .t_lightbox, .b_lightbox, .l_lightbox, .r_lightbox, .bl_lightbox, .br_lightbox, .tl_lightbox, .tr_lightbox { background:none; } /* ================================================== */ /* ===================== SEARCH RESULTS ============= */ /* ================================================== */ #sresults-left { display:none; } #back-link { display:block; float:right; height:60px; } #back-link ul { list-style-type:none;} #back-link li { display:inline; padding-right:10px; } #sresults-right #list-control .switch { cursor:pointer; } #sresults-right #list-control img { width:173px; height:38px;} #sresults-right { margin:0; padding:0; width:820px; margin-left:130px; margin-top:38px; min-height:1417px; } #sresults-right #intro { padding-bottom:20px; } #sresults-right h3 { padding:20px 0 0 0;} #sresults-right p { padding:0 0 10px 0; margin-bottom:10px; } #sresults-right a { color:#91873D; text-decoration:none; } #sresults-right a:hover { color:#000; text-decoration:none; } #sresults-right #list img { width:85%; margin:0px;} #sresults-right #list ul#wrapper { width:690px; } #sresults-right #list ul li.list_inline { width:32%; display:block; float:left; padding-bottom:30px; } /* === Gallery View Styles === */ #sresults-right #list ul li img { width:85%; } #sresults-right #list img.more-arrow { height:14px; width:8px; border:0; padding-top:20px;} #sresults-right .book-details { width:90%; } #sresults-right .book-details ul { width:100%; } /* ---- show-hide elements ---- */ #sresults-right #list li .show { display:block; width:auto; height:300px; } #sresults-right #list li .hide { color:#000; text-align: left; height: 0; overflow: hidden; background-color:#fff; } /* === List View Styles === */ #sresults-right #list ul.list-view li.list_inline { width:100%; display:block; padding-bottom:30px; } #sresults-right #list ul.list-view .book-details { width:82%; box-shadow:none; float:left; height:170px; } #sresults-right #list ul.list-view li { display:block; width:220px; height:300px; margin:0px; padding-bottom:20px; vertical-align:middle; } #sresults-right #list ul.list-view li ul { width:100%;} #sresults-right #list ul.list-view li { width:100%; height:70%; padding-top:10px; padding-bottom:10px; border-bottom:1px solid #FADE15; } #sresults-right #list ul.list-view li:hover { height:100%; background:#f1f9fd; } #sresults-right #list ul.list-view li li { display:inline; border:none; padding:0; margin:0; margin-right:5px; padding-right:10px; border-right:1px solid #22C1E8 } #sresults-right #list ul.list-view li li.last { border:none; } #sresults-right #list ul.list-view li a img { border:none; } #sresults-right #list ul.list-view li .show { float:left; height:150px; width:15%; } #sresults-right #list ul.list-view li .show img { height:100px; width:auto; margin-top:20px;} #sresults-right #list ul.list-view li a img.more-arrow { height:14px; width:8px; border:none; float:right;} #sresults-right #list ul.list-view .hide { overflow:visible; display:block; height: 150px; width:100%; padding:0; margin:0; background:#fff; } #sresults-right #pagination { display:none; } /* ================================================== */ /* ===================== FOOTER ===================== */ /* ================================================== */ #maincolumn #big_footbanners { margin:0; text-align:center; background:none; margin-bottom:10px;} #maincolumn .small_footbanners { width:390px; text-align:center; background:none; float:left; margin-bottom:5px;} #maincolumn .left { margin-right:10px; } #maincolumn #big_footbanners img, #maincolumn .small_footbanners img { padding:10px 37px; } /* === footer === */ #footercon { display:none;} #footer { display:none; } #footlogo { display:none; } #footlinks_bg { display:none; } #footlinks { display:none; } #footlinks div { display:block; float:left; padding:20px; width:150px; height:180px; } #copyright { display:block; margin:0; padding:10px 10px 10px 210px; width:790px; font-size:0.9em; color:#FFF; } .t_footer { background:none; } .b_footer { background:none; } .l_footer { background:none; } .r_footer { background:none; } .bl_footer { background:none; } .br_footer { background:none; } .tl_footer { background:none; } .tr_footer { background:none; } /* ================================================== */ /* ========== PAGE LOCATION (FOR PRINTS) ============ */ /* ================================================== */ #location { display:none; } /* === ===*/