/* ----------------------------------------------- Hay Festival v1.0 - Archive Stylesheet Author: Finn Beales - hello@madebyfinn.com Version: 02/2011 CONTENTS: 1 Button colours 2 Navigation colour styles 3 Header logo 4 Picture boxes on right hand side of homepage 5 Homepage sales image 6 Standard content page ----------------------------------------------- */ /* 1 Archive buttons (Dark dark grey) ----------------------------------------------- */ .button, .CartDeleteButton, .UpdateCartButton, .ContinueShoppingButton, .CheckoutNowButton, .AddToCartButton, .PaymentPageContinueCheckoutButton, .ReviewPageContinueCheckoutButton, .ContinueCheckoutButton, .normalButtons, .SelectAddressButton, .EditAddressButton, .AccountPageContinueCheckoutButton, .UpdateAccountButton, .CreateAccount, .EditAddressButton, .button-standard, .btn, .button-big, .back, input.btn-login { color: #fff; border: solid 1px #131313; background: #333; background: -webkit-gradient(linear, left top, left bottom, from(#333), to(#232323)); background: -moz-linear-gradient(top, #333, #232323); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333', endColorstr='#232323'); } .button:hover, .CartDeleteButton:hover, .UpdateCartButton:hover, .ContinueShoppingButton:hover, .CheckoutNowButton:hover, .AddToCartButton:hover, .PaymentPageContinueCheckoutButton:hover, .ReviewPageContinueCheckoutButton:hover, .ContinueCheckoutButton:hover, .normalButtons:hover, .SelectAddressButton:hover, .EditAddressButton:hover, .AccountPageContinueCheckoutButton:hover, .UpdateAccountButton:hover, .CreateAccount:hover, .EditAddressButton:hover, .button-standard:hover, .btn:hover, .button-big:hover, .back:hover, input.btn-login:hover { background: #232323; background: -webkit-gradient(linear, left top, left bottom, from(#232323), to(#0f0f0f)); background: -moz-linear-gradient(top, #232323, #0f0f0f); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#232323', endColorstr='#0f0f0f'); } .button:active, .CartDeleteButton:active, .UpdateCartButton:active, .ContinueShoppingButton:active, .CheckoutNowButton:active, .AddToCartButton:active, .PaymentPageContinueCheckoutButton:active, .ReviewPageContinueCheckoutButton:active, .ContinueCheckoutButton:active, .normalButtons:active, .SelectAddressButton:active, .EditAddressButton:active, .AccountPageContinueCheckoutButton:active, .UpdateAccountButton:active, .CreateAccount:active, .EditAddressButton:active, .button-standard:active, .btn:active, .button-big:active, .back:active, input.btn-login:active { color: #fff; background: -webkit-gradient(linear, left top, left bottom, from(#0f0f0f), to(#232323)); background: -moz-linear-gradient(top, #0f0f0f, #232323); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0f0f0f', endColorstr='#232323'); } /* 2 Navigation colour styles ----------------------------------------------- */ #nav .active span, #nav a:hover span, #nav li:hover a span, #nav li.hover a span, .add-nav .active a, .add-nav .active span, .add-nav a:hover span, .add-nav li:hover a span, .add-nav li.hover a span { background:url(images/arrow-archive.png) no-repeat; } #nav .active a, #nav a:hover, #nav li:hover a, #nav li.hover a, .add-nav a:hover, .add-nav li:hover a, .add-nav li.hover a { background:#333; } #nav ul { border-bottom:5px solid #333; } #main { border-top:3px solid #333; /*font-family: 'TradeGothicLTStdRegular';*/ } .add-nav ul { border-bottom:5px solid #333; } .title { font-family: 'Trade Gothic W02 Bold 2'; width:100%; text-transform:uppercase; border-bottom:5px solid #333; } /* 3 Logo ----------------------------------------------- */ .logo { display:block; text-indent:-9999px; overflow:hidden; background:url(images/logo-archive.gif) no-repeat; width: 586px; height: 53px; margin: 0; } /* 4 Picture boxes on right hand side of homepage ----------------------------------------------- */ .text-box a { color:#fff; display:block; background:url(images/bg-text-box-archive.png); width:211px; padding:10px 5px 8px 10px; cursor:pointer; } .text-box a:hover { background:url(images/bg-text-box-archive-hover.png); text-decoration:none; } .box:hover .text-box-holder, .aside .hover .text-box-holder { background:url(images/bg-text-box-archive-hover.png); } /* 5 Homepage ----------------------------------------------- */ .keyword input { width:190px; } .sales-block { width:100%; border-bottom:1px solid #ccc; padding:0 0 29px; margin:0 0 32px; } .sales-block:after { content:""; display:block; clear:both; } .sales-block img { float:right; } .text-block { float:left; width:460px; padding:18px 0 0; line-height:18px; color:#010101; vertical-align:top; } .text-block h1 { margin:0 0 16px -5px; position:relative; z-index:2; text-indent:-9999px; line-height:0; font-size:0; overflow:hidden; background:url(images/img-sales.gif) no-repeat; width: 442px; height: 175px; } .text-block h2 { font-size:18px; line-height:24px; font-weight:normal; margin:18px 0; padding:0; text-transform:none; border-bottom:none; } /* 6 Standard content page ----------------------------------------------- */ /* 7 Weblingo colour changes ----------------------------------------------- */ #tabnav A.active:link, #tabnav A.active:visited { background-color:#333; color:#fff; } #tabnav A:hover { background-color:#333; color:#fff; } table#calendar_of_events td.session { background-color:#ecfdfe; border-bottom-color:#333; } table#calendar_of_events td.session:hover { background-color:#e2feff; } /* 8 IE Specific styles ----------------------------------------------- */ * html #nav a:hover span, * html #nav li:hover a span, * html #nav li.hover a span, * html .add-nav a:hover span, * html .add-nav li:hover a span, * html .add-nav li.hover a span { background-position:-9999px -9999px; filter: progid:dximagetransform.microsoft.alphaimageloader(src='images/arrow-archive.png', sizingmethod='crop'); } * html .text-box a { background:none; filter: progid:dximagetransform.microsoft.alphaimageloader(src='images/bg-text-box-archive.png', sizingmethod='scale'); } * html .text-box a:hover { background:none; filter: progid:dximagetransform.microsoft.alphaimageloader(src='images/bg-text-box-archive-hover.png', sizingmethod='scale'); } /*-------------------------------------------------- HOME PAGE --------------------------------------------------*/ div.archive { clear:both; } div.archive h2 { margin-left:0; margin-bottom:9px; font-size:20px; color:#333; } ul.buy { overflow:hidden; margin:18px 0 0 -5px; } ul.buy li { float:left; } ul.buy li.existing { font-size:11px; padding:12px 0 0 10px; } div.intro big { line-height:22px; } div.intro ul#persuaders { clear:both; list-style:disc; padding-top:20px; } div.intro ul#persuaders li { margin-bottom:5px; } div.intro p { margin-left:0; margin-top:9px; } div.intro p strong { text-indent:-9999px; display:block; background:url(../../archive/img/functional/btn-subscribe.jpg) top left no-repeat; width:210px; height:45px; cursor:pointer; } div.intro p strong:hover { background-position:bottom; } form#FilterForm { clear:left; float:left; margin-top:0; } ul.search-methods { list-style:none; margin:12px 0 18px 5px; padding:0; overflow:hidden; } ul.search-methods li.keyword { float:left; margin-bottom:9px; margin-right:20px; width:190px; } /*ul.search-methods li.keyword input { width:190px; } ul.search-methods li.btn-search { float:left; width:50px;} input.search { width:50px; }*/ ul.search-methods li.title-filtersearch { clear:left; float:left; width:260px; margin-top:18px; margin-bottom:9px; height:20px; } ul.search-methods li.title-filtersearch h3 { margin-left:0; } ul.search-methods li.festival { clear:left; float:left; width:260px; margin-right:20px; margin-bottom:5px; } ul.search-methods li.festival select { width:260px; } ul.search-methods li.artist { clear:left; float:left; width:260px; margin-bottom:5px;} ul.search-methods li.artist select { width:260px; } ul.search-methods li.genre { float:left; width:260px;} ul.search-methods li.genre select { width:260px; } ul.search-methods li.btn-reset { clear:left; float:left; margin-top:9px;} a.reset { width:100px; float:left; background-color:#333; color:#fff; } a.reset:hover { background-color:#515151; color:#fff; } div.showcase { margin:20px 0; } div.showcase h3 { color:#333; border-top:7px solid #ccc; border-bottom:1px solid #ccc; padding:12px 0 18px 5px; margin-left:-5px;!important } div.showcase-panel ul { overflow:hidden; margin-top:20px; width:702px; } div.showcase-panel ul li { float:left; overflow:hidden; width:702px; height:280px; } div.showcase-panel ul li div.col-2 { width:600px; margin:0; padding:0; } div.showcase-panel ul li p { margin-top:9px; } div.showcase-panel ul li img { border:none; display:none; } div.showcase-panel ul li h4 { color:#333; font-size:18px; margin:0 0 0 0; } div.showcase-panel ul li p { color:#333; } div.showcase-panel ul li object { margin-top:20px; } div.showcase-panel ul li p.download { } div.showcase-panel .carousel-next { display:none; text-indent:-9999px; } div.showcase-panel .carousel-previous { display:none; text-indent:-9999px; } div.showcase-panel .carousel-pagination { margin:9px 0 0 -5px; } div.showcase-panel .carousel-pagination p a { cursor:pointer; display:block; width:18px; height:10px; background-color:#e5e5e4; text-indent:-9999px; float:left; margin-right:4px; } div.showcase-panel .carousel-pagination p a:hover { background-color:#CCC; } div.showcase-panel .carousel-pagination p a.active { background-color:#989898; } div.topevents { margin-top:20px; padding-bottom:40px;} div.topevents h3 { color:#333; border-top:7px solid #ccc; border-bottom:1px solid #ccc; padding:12px 0 18px 5px; } div.topevents-panel { margin-top:20px; padding-bottom:30px;} div.topevents-panel ul { width:226px; } div.topevents-panel ul li { clear:both; float:left; clear:left; } div.topevents-panel ul li p { width:226px; float:left; padding-bottom:4px; } div.topevents-panel ul li img { float:right; } div.topevents-panel .carousel-next { display:none;} div.topevents-panel .carousel-previous { cursor:pointer; display:block; width:14px; height:15px; background:url(../../archive/img/functional/btn-arrow-down.gif) top left; text-indent:-9999px; float:left; margin-left:206px; margin-top:-55px;} div.topevents-panel .carousel-previous:hover { background-position:bottom; } /*-------------------------------------------------- RESULTS / DETAIL PAGE --------------------------------------------------*/ #results { margin-bottom:27px; } #results span.archivetitle { border-top:7px solid #ccc; border-bottom:1px solid #ccc; padding:12px 0 18px 0; display:block; margin-bottom:27px; } h3 { padding-bottom:3px; color:#cc0000; } p.date { color:#666; } div#search-panel { background-color:#eee; border-top:7px solid #999; display:block; padding:17px 20px; width:305px; margin-bottom:27px; } div#search-panel h3 { color:#333; } /* Results page */ ul.search-results { margin-top:27px; } ul.search-results li { clear: both; margin-bottom:27px; padding-bottom:27px; border-bottom:1px dotted #ccc; } ul.search-results li p { margin-bottom:10px; } /* Detail Page */ div.detail { margin-bottom:27px; } div.detail h3 { color:#333; margin-left:0; font-size:18px; } div.detail p.date { margin-bottom:9px; } div.detail h4 { font-family: "Helvetica Neue", Arial, sans-serif; margin-bottom:9px; text-transform:uppercase; font-weight:bold; font-size:11px; color:#000; } div.detail h6 { margin:9px 0 0 0; font-size:14px; } div.detail img { float:right; margin-left:18px; margin-bottom:18px; } div.detail object { margin-bottom:18px; } div.detail p.description { padding-bottom:18px; overflow:hidden; } div#listen-options { clear:both; } div#listen-options p.subscriber-note { padding:15px; background:#ffffcc; border:1px solid #cccc99; } div#stream-event { float:left; } div#stream-event h4 { margin-left:0; } div#download-event { float:left; margin-left:20px; } div#download-event h4 { margin-left:0; } p.download { margin:0; padding:0; } p.forwardFriend { margin-top:27px; display:none; } /* Page numbering */ div.page-numbers { text-align:left; clear:both; margin:27px 0 0 0; padding:18px 0 0 0; border-top:1px solid #CCC; width:583px; } div.page-numbers a:hover { background-color:#333; color:#fff; text-decoration:none; } div.page-numbers a.active { background-color:#333; color:#fff; } /* BUY SUB PAGE --------------------------------------------------*/ div.upsell, a.prev, a.next, a.back, hr.dark, p.tellafriend { display:none; } div.wrapper, div.product-block { overflow:hidden; clear:both;} div.product-block { padding-top:10px; } div.product { margin-left:10px; } div.product img { border:none; outline:none; } div.product-detail { width:500px; margin-left:20px; } div.product-detail h2 { margin-left:0; } span.variantprice { display:block; margin:10px 0; } input#Quantity { font-size:16px; vertical-align:middle; border:1px solid #ccc; } input.AddToCartButton { vertical-align:middle; }