/* == STYLESHEET FUNCTIONS ------------------------------------------------------------------------------------------------------------------------ - Defines the site-wide layout for core structure - Defines reusable widget code - Defines page specific layout - Overrides base HTML elements where required ----------------------------------------------------------------------------------------------------------------------*/ /* == CONTENTS ------------------------------------------------------------------------------------------------------------------------ - Main Layout - Head Content - Primary Navigation - Foot Content [Widget Styles:] ----------------------------------------------------------------------------------------------------------------------*/ /* == Main Layout ----------------------------------------------------------------------------------------------------------------------*/ #topStrip{} #wrap{width: 995px;margin: 0 auto;text-align: left;position: relative;font-family:Century Gothic;} #head{float: left; width: 995px;} #priNav{float: right;padding-top:6px;} #mainContent{float: left; width: 995px;margin:10px 0;} #foot{float: left; width: 980px;margin-bottom: 25px;} /** content divisions **/ #mainContent #templateOne, #mainContent #templateThree{float: left;width: 995px;} #mainContent #templateOne .zoneOne, #mainContent #templateThree .zoneOne, #mainContent #templateFour .zoneOne{float: left;} #mainContent #templateOne .zoneOne .splitLeft{float: left;} #mainContent #templateOne .zoneOne .splitRight{float: right;} #mainContent #templateTwo .zoneOne, #mainContent #templateThree .zoneOne{float: left;width:652px;padding-right:17px;} #mainContent #templateTwo .zoneTwo, #mainContent #templateThree .zoneTwo{float: right;width:325px;} #mainContent #templateFour .zoneOne{width: 995px;} /* == Head Content ----------------------------------------------------------------------------------------------------------------------*/ #head div.logo{float:left;width: 446px; height: 74px; margin:25px 0 0 0; background: url(/_img/logo.gif) top left no-repeat;} /* == Top Banner ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .box h3.title{position:relative;float:right;margin:-35px 0 0 0;text-align:right;font-family:Century Gothic, Verdana;text-transform:none;color:#f05922;font-size:185%;letter-spacing:-0.3px;} #mainContent .box h3.title span{display:block;padding: 0 25px 0 0;} /* == Primary Navigation & Foot Navigation ----------------------------------------------------------------------------------------------------------------------*/ #priNav ul, #priNav ul li, #foot .main ul, #foot .main ul li{float: left;margin:0;padding:0;list-style: none;} #priNav ul li, #foot .main ul li{margin-right:15px;} #priNav ul li a, #foot .main ul li a{float:left;font-weight:bold;text-transform:uppercase;text-decoration:none;} #priNav ul li a span, #foot .main ul li a span{float:left;padding:3px 9px 4px 9px;cursor:pointer;} #priNav ul li a.on, #foot .main ul li a.on{background: url(/_img/bg/pri-nav-bg.gif) top left no-repeat;} #priNav ul li a.on span, #foot .main ul li a.on span{background: url(/_img/bg/pri-nav-bg-r.gif) top right no-repeat;} #priNav ul li a:hover, #foot .main ul li a:hover{background: url(/_img/bg/pri-nav-hov-bg.gif) top left no-repeat;} #priNav ul li a:hover span, #foot .main ul li a:hover span{background: url(/_img/bg/pri-nav-hov-bg-r.gif) top right no-repeat;} /* == Foot Content ----------------------------------------------------------------------------------------------------------------------*/ #foot .main ul{margin-top:5px;} #foot .social ul, #foot .social ul li{float:right;margin:0;padding:0;list-style: none;} #foot .social ul li{float:left;margin-left:15px;font-weight:bold;padding:0 0 7px 0;} #foot .social ul li.facebook{background: url(/_img/ico/ico_facebook.gif) top left no-repeat;} #foot .social ul li.myspace{background: url(/_img/ico/ico_myspace.gif) top left no-repeat;} #foot .social ul li.bebo{background: url(/_img/ico/ico_bebo.gif) top left no-repeat;} #foot .social ul li a{float:left;margin:7px 0 7px 32px;text-decoration:none;} #foot .social ul li a:hover{text-decoration:underline;} /*----- Main Content ------------------ - Box definitions & Generic Styles -----------------------------------*/ /* == Box definitions & Generic Styles ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .box{float:left;border:solid 8px #d3cac1;margin-bottom:16px;background:#101c29;} #mainContent .boxAlt{background:#161616;} #mainContent .box h2, #mainContent .box h1.top{float:left;width:100%;background:transparent url(/_img/bg/box-fade-light.gif) no-repeat bottom left;} #mainContent .box h2 span, #mainContent .box h1.top span{float:left;width:140px;padding:6px 0 10px 10px} #mainContent .boxAlt h2{background:transparent url(/_img/bg/box-fade-dark.gif) no-repeat bottom left;} #mainContent #templateTwo .zoneOne .box h2, #mainContent #templateThree .zoneOne .box h2{background:transparent url(/_img/bg/box-fadefull-light.gif) no-repeat bottom left;} #mainContent #templateTwo .zoneOne .boxAlt h2, #mainContent #templateThree .zoneOne .boxAlt h2{background:transparent url(/_img/bg/box-fadefull-dark.gif) no-repeat bottom left;} #mainContent .threeCol1{width:302px;height:305px;overflow:hidden;} #mainContent .threeCol2{width:310px;margin-right:16px;margin-left:16px;} #mainContent #templateTwo .zoneTwo .threeCol2, #mainContent #templateThree .zoneTwo .threeCol2{margin-right:0;margin-left:0;} #mainContent .height1{height:275px;overflow:hidden;} #mainContent .height2{height:305px;} #mainContent #templateTwo .zoneOne .box, #mainContent #templateTwo .zoneOne .boxAlt, #mainContent #templateThree .zoneOne .box, #mainContent #templateThree .zoneOne .boxAlt{width:635px;padding:0 0 15px 0;} #mainContent #templateFour .zoneOne .box{width: 979px;} #mainContent .box h2 div.loz{float:right;margin: 3px 5px 0 0;background:transparent url(/_img/btn/lozenge-light.gif) no-repeat top left;width:122px; height:25px;} #mainContent .box h2 div.lozBack{background-image:url(/_img/btn/lozenge-light-back.gif);} #mainContent .box h2 div.lozDark{background-image:url(/_img/btn/lozenge-dark.gif);} #mainContent .box h2 div.lozDarkBack{background-image:url(/_img/btn/lozenge-dark-back.gif);} #mainContent .box h2 div.loz a{ float:left;font-size:55%;text-transform:none;font-weight:normal;letter-spacing:0.01px; font-family:Century Gothic;text-decoration:none; background:transparent url(/_img/btn/lozenge-light.gif) no-repeat top left; width:117px; height:25px; text-align:center;padding:2px 5px 0 0;} #mainContent .box h2 div.loz a:hover{background:transparent url(/_img/btn/lozenge-light-hover.gif) no-repeat top left;} #mainContent .box h2 div.lozBack a{background-image:url(/_img/btn/lozenge-light-back.gif);} #mainContent .box h2 div.lozDark a{background-image:url(/_img/btn/lozenge-dark.gif);} #mainContent .box h2 div.lozDarkBack a{background-image:url(/_img/btn/lozenge-dark-back.gif);} #mainContent .box h2 div.lozBack a:hover{background-image:url(/_img/btn/lozenge-light-back-hover.gif);} #mainContent .box h2 div.lozDark a:hover{background-image:url(/_img/btn/lozenge-dark-hover.gif);} #mainContent .box h2 div.lozDarkBack a:hover{background-image:url(/_img/btn/lozenge-dark-back-hover.gif);} #mainContent .box p.pad{margin: 4px 10px;} #mainContent .box ul.genList, #mainContent .box ul.genList li{margin:0; padding:0;list-style:none;width:100%;} #mainContent .box ul.genList{float:left;padding:5px 10px 0 12px;} #mainContent .box ul.genList li{padding:0 0 12px 0;} #mainContent .box ul.genList li .thumb{float:left; margin: 3px 12px 15px 0;border:solid 1px #623227;} #mainContent .box ul.genList li .title{font-weight:bold;} #mainContent .box ul.genList li .titleBig{font-family:Arial;color:#f25822;font-weight:bold;font-size:120%;} #mainContent .box ul.genList li span{font-size:90%;} #mainContent .box ul.genList li span em{display:block;margin:5px 0 0 0;} #mainContent .box ul.genList li p{font-size:85%;clear:both;margin:0;} #mainContent .box ul.genList li p a{color:#f25822;text-decoration:none;} #mainContent .box ul.genList li p a:hover{text-decoration:underline;} #mainContent .zoneOne ul.genList{width:600px;clear:both;} #mainContent .threeCol1 ul.genList{width:275px;clear:both;} #mainContent .threeCol2 ul.genList{width:285px;clear:both;} /*----- Box Specific Styles ------------------ - News - Audio Player - Sign up - Pre-Order - Gallery - Videos - Biog & other copy -----------------------------------*/ /* == News ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .boxNews{} #mainContent .boxNews .view{float:left;padding: 5px 10px 20px 10px;font-family:Arial;font-size:90%;width:95%;} #mainContent .boxNews .view .thumb{float:left;border:solid 1px #5c6165;padding:2px;margin:0 12px 8px 0;} #mainContent .boxNews .view h1{padding:0;} /* == Audio Player ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .logoSml{float:left;margin:5px 0 10px 17px;} #mainContent .boxAudio{} #mainContent .boxAudio p{padding:0 0 5px 10px;margin-top:4px;font-size:90%;} #mainContent #divPlayer{height:35px;background:#0e0e0e url(/_img/bg/audio-player.gif) repeat-x top left; width:300px;padding: 0 0 0 7px;} #mainContent .boxAudio .audioList{float:left;overflow:hidden;} #mainContent .boxAudio ul, #mainContent .boxAudio ul li{float:left;margin:0;padding:0;list-style:none;display:inline;} #mainContent .boxAudio ul{border-top: dashed 1px #2c2123; margin:5px 10px;} #mainContent .boxAudio ul li{border-bottom: dashed 1px #2c2123;width:290px;} #mainContent .boxAudio ul li a{padding: 7px 0 7px 45px;display:block;text-decoration:none;font-size:90%;background: url(/_img/ico/bullet-arrow.gif) 15px 6px no-repeat;} #mainContent .boxAudio ul li a:hover{text-decoration:underline;background-color:#311218;} #mainContent .boxAudio .scanHolder{float:left;width:285px;font-size:85%;padding:10px 0 0 10px;} #mainContent .boxAudio .scanHolder a{color:#fff;margin:0 0 0 0;} #mainContent .boxAudio .scanHolder div{float:left;width:94px;} #mainContent .boxAudio .scanHolder div.floatRight{float:right;} #mainContent .boxAudio .currentAudioClip{font-weight:bold;} /* == Sign up ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .boxSignup{background:#152231 url(/_img/bg/sign-up.jpg) no-repeat top left;} #mainContent .boxSignup label{color:#fff;font-family:Arial;} #mainContent .boxSignup select, #mainContent .boxSignup .select, #mainContent .boxSignup input{width: 140px; border: 1px #888 solid;} #mainContent .boxSignup select, #mainContent .boxSignup .select{width: 146px;} #mainContent .boxSignup .submit{float: right; width: 75px; height: 16px; border: 0; margin: 5px 25px 0 0; background: url(/_img/btn/submit.gif) no-repeat top left;} #mainContent .boxSignup a{color: #fff; font-size: 90%;} #mainContent .boxSignup ul, #mainContent .boxSignup ul li{margin:0; padding:0;color:#fff;font-family:Arial;list-style:none;} #mainContent .boxSignup ul{font-weight:bold;margin: 5px 0 0 20px;} #mainContent .boxSignup input{background:#e3e3e3;color:#3e3e3e;margin-bottom:4px;} #mainContent .boxSignup p{text-align: center;color:#f25822;font-weight:bold;font-size:100%;margin: 10px 25px 0 20px;} #mainContent .boxSignup .form{margin:10px 0 0 65px;} /* == Pre-Order ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .boxPreOrder h2{margin-bottom:2px;} #mainContent .boxPreOrder .mainLink{float:left;margin: 0 0 0 22px;} /* == Gallery ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .boxGallery .hold{float:left;width:298px;height:259px;overflow:hidden;margin:-11px 0 0 2px;display:inline;} #wrap #mainContent .threeCol2 .hold{margin-left:6px;} #mainContent .boxGallery .hold .frame{float:left;width:298px;height: 6000px;} #mainContent .boxGallery .hold .frame img{float:left;} #mainContent .boxGallery .scan{width:302px;position:absolute;margin-top: -40px;z-index: 10;opacity:.95;filter: alpha(opacity=95);-moz-opacity: 0.95;} #mainContent .boxGallery .scan{margin: 225px 0 0 0;} #wrap #mainContent .threeCol2 .scan{margin: 225px 0 0 4px;} #mainContent .boxGallery .scan .info{float:left;width:225px;background:#111a25;height: 34px;margin: 0 0 0 5px;font-size:80%;} #mainContent .boxGallery .scan .info div{float:right;padding: 8px 12px 0 0;} #mainContent .boxGallery .scan .info span{color:#3b5877;} #mainContent .boxGallery .scan a{float:left;height: 34px;width: 34px;background:#111a25;} #mainContent .boxGallery .scan a img{margin: 9px 0 0 14px;background: url(/_img/ico/arrow-left.gif) top left no-repeat;height:13px;width:6px;} #mainContent .boxGallery .scan a:hover img{background: url(/_img/ico/arrow-left-hover.gif) top left no-repeat;} #mainContent .boxGallery .scan a.right img{background: url(/_img/ico/arrow-right.gif) top left no-repeat;} #mainContent .boxGallery .scan a.right:hover img{background: url(/_img/ico/arrow-right-hover.gif) top left no-repeat;} #mainContent .boxGallery .scan a.right{float:right;} /* Gallery Page */ #mainContent .gallery{width:595px;background: #101C29; padding: 5px 0 15px 35px; text-align: center;margin:10px 0;} #mainContent .gallery .window, #mainContent .gallery .controls{float:left;width: 95%; background: #15283c; margin: 5px auto ; padding: 10px 0;} #mainContent .gallery .window img{border: 1px #551414 fff;} #mainContent .gallery .window .title, #mainContent .gallery .window .fantitle{float: left; display: inline; width: 75%; height: 25px; text-align: left; margin: 0 0 0 32px; font-weight: bold; font-size: 130%; color: #fff;} #mainContent .gallery .window .num{float: right; display: inline; width: 10%; height: 25px; text-align: right; margin: 0 32px 0 0; color: #f25822; padding-top: 3px;} #mainContent .gallery .main {float:left;width:510px;height:344px;overflow:hidden;display: inline;margin: 4px 0 0 30px;border:solid 1px #0a121b;} #mainContent .gallery .main .int{float:left;width:1080px;height:10000px;background-color:#101C29;} #mainContent .gallery .main .int ul{float:left;width:100%;margin:0;padding:0;list-style:none;} #mainContent .gallery .main .int ul li{float:left;width:510px; height:344px;text-align:center;overflow:hidden;padding:0;margin:0;list-style:none;background: transparent url('/_img/ico/loading.gif') no-repeat center center;} #mainContent .gallery .main .int ul li img{float:left;} #mainContent .gallery .main img.portrait{border:solid 1px #101C29;} #mainContent .gallery .main img.landscape{border:solid 1px #101C29;} #mainContent .gallery .controls .prev, #mainContent .gallery .controls .next{float: left; display: inline; width: 26px; margin: 20px 0 0 28px;} #mainContent .gallery .controls .next{margin: 20px 0 0 0;} #mainContent .gallery .controls .thumbs{float:left;width:448px;padding: 0 0 10px 0;margin: 0 5px;display: inline;overflow:hidden;} #mainContent .gallery .controls .thumbs a{margin: 0 2px;} #mainContent .gallery .controls .info{text-align:left; padding: 5px 20px 0 30px;} #mainContent .gallery .thumbs .fullthumbs {float:left;width:90000px;margin: 5px 0 0 0;} #mainContent .gallery .thumbs .scrollInd{float:left;width:448px;background-color:#101c29;border-bottom:solid 1px #101c29;border-top:solid 1px #101c29;} #mainContent .gallery .thumbs .scrollInd .current{float:left;width:80px;height:5px;line-height:5px;background-color:#f25822;font-size:1px;} #mainContent .gallery .thumbs ul, #mainContent .gallery .thumbs ul li {float:left;margin:0;padding:0;} #mainContent .gallery .thumbs ul li {display:inline;} #mainContent .gallery .thumbs ul{padding: 0 10px 4px 0;} #mainContent .gallery .thumbs ul li a, #mainContent .gallery .thumbs ul li img{float:left;} #mainContent .gallery .thumbs ul li a{margin:2px 0 0 2px;height: 50px; width: 50px;border:solid 1px #fff;} #mainContent .gallery .thumbs ul li a:hover{border:solid 1px #f8bc74;} /* == Videos ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .boxVideos .gallery .window{} #mainContent .boxVideos .gallery .main{margin-left:27px;} #mainContent .boxVideos .gallery .controls{padding:0 0 8px 0;} #mainContent .boxVideos .gallery .controls .scroll img{margin-top:10px;} /* Video Page */ #mainContent .videos .main{height:364px;} #mainContent .videos .main .int{width:510px;padding:10px 0;} #mainContent .videos .thumbs ul {padding-top:7px;} #mainContent .videos .controls .thumbs{margin-left:1px;} #mainContent .videos .thumbs ul li a{height: 40px; width: 70px;overflow:hidden;} /* == Biog & other copy ----------------------------------------------------------------------------------------------------------------------*/ #mainContent .zoneOne .box p {padding: 0 10px} /*----- Widgets ------------------ - Paging -----------------------------------*/ /* == Paging ----------------------------------------------------------------------------------------------------------------------*/ .paging .text, .pagingbase .text{float: left;margin: 5px 0 10px 0;font-family:Arial;} .paging .pg, .pagingbase .pg{float: right;margin-right:10px;display:inline;} .paging .pg ul, .pagingbase .pg ul{margin: 5px 0 10px 0;list-style: none;} .paging .pg ul li, .pagingbase .pg ul li{float: left;} .paging .pg ul li.det, .pagingbase .pg ul li.det{padding: 2px 8px 0 0;font-size:90%;} .paging .pg ul li a, .pagingbase .pg ul li a{float: left;padding: 1px 5px;text-decoration: none;font-size: 90%;margin: 0 0 0 3px;color: #00b4ff;} .paging .pg ul li a:hover, .pagingbase .pg ul li a:hover, .paging .pg ul li a.on, .pagingbase .pg ul li a.on{background: #f25822;font-weight: bold;color: #fff;} .paging .pg ul li a:hover, .pagingbase .pg ul li a:hover{background: #f57c52;} .paging .text .divLoading{color:#fff;} /* == Store Pages ----------------------------------------------------------------------------------------------------------------------*/ .store{float: left;margin: 0 11px;width: 957px;} .store .prodListing{float: left; width: 100%;margin: 10px 0; list-style: none;clear: left;} .store .prodListing li{float: left; width: 300px;margin: 0 15px 5px 0;} .store .prodListing li p{margin: 0;} .store .prodListing li a img{float: left;border: solid 1px #fff; padding: 0;margin-right: 8px;} .store .prodListing li a.description{font-size: 140%; text-decoration: none;display: block; font-weight: bold;text-transform: uppercase;letter-spacing: -1px;float: left;width: 280px;background: #161616; color: #f35822; padding: 3px 10px; text-align: center;} .store .prodListing li div.summary{margin: 10px 0;line-height: 1.7em; padding: 5px;} .store .prodListing li div.stockTitle{padding-bottom: 5px;} .store .prodListing li div.stockTitle em{font-style: normal;font-weight: bold;color: #fff;} .store .prodListing li span.price{display: block;font-size: 150%; font-weight: bold; color: #fff;} .store .prodListing li .infoLink{padding-top: 5px;} .store .prodListing li .infoLink a, .store .prodListing li .productInfo a{float:left;margin: 3px 5px 0 0;background:transparent url(/_img/btn/lozenge-light.gif) no-repeat top left;width:122px; height:25px;text-align: center;letter-spacing:0.01px;text-decoration:none;line-height: 25px;clear: left;font-size: 90%;} .store .prodLanding .prodListing li a img{border: solid 27px #161616;border-bottom: solid 5px #161616;padding: 1px; background: #fff;margin-right: 0;} .store .relatedProds .prodListing li p.prodListP span a{float:left;margin: 3px 5px 0 0;background:transparent url(/_img/btn/lozenge-light.gif) no-repeat top left;width:122px; height:25px;line-height: 25px;letter-spacing:0.01px;text-decoration:none;text-align: center;font-size: 90%;} .store .images{float: left;clear: left;} .store .images img{float: left;border: 3px #fff solid;margin: 0 10px 5px 0;} .store .info{float: left;width: 680px;line-height: 1.7em;} .store .info h3{font-size: 120%;} #mainContent .zoneOne .store p{padding: 0;} #mainContent .zoneOne .store .info p{margin: 0 0 10px 0;} .store .info br{height: 1px; line-height: 1px;} .store .info .price{font-size: 150%; font-weight: bold;} .store .info .actionBuyNow{float:left;margin: 3px 5px 0 0;background:transparent url(/_img/btn/lozenge-light.gif) no-repeat top left;width:122px; height:25px;text-align: center;letter-spacing:0.01px;text-decoration:none;line-height: 25px;clear: left;font-size: 90%;} .store .btn{margin: 3px 5px 0 0;background:transparent url(/_img/btn/lozenge-light.gif) no-repeat top left;width:122px; height:25px;text-align: center;letter-spacing:0.01px;text-decoration:none;line-height: 25px;clear: left;font-size: 90%;color: #fff;border: 0;padding: 0;} #mainContent .store h2{font-size: 130%;color: #f35822;background: 0;margin: 0 0 15px 0;} #store .left50percent, #store div.fifty{float: left; width: 48%;margin: 0 3px 0 3px;} #store .left50percent h3, div.fifty h3{color: #f35822;background:transparent url(/_img/bg/box-fade-light.gif) no-repeat bottom left;padding: 0 0 10px 0;margin: 0 0 10px 0;} body#shop h2{color: #726d65;} div.fifty fieldset{margin: 0px;} div.fifty fieldset label{width: 40%;} #mainContent .box h1.top span{width: auto;} /* =Tooltips --------------------------------------------------------------------------------------------------------------------*/ a.tooltip {color:#fff;text-decoration: none; cursor:help;} a.tooltip b {display:none;} a.tooltip:hover {border:0; position:relative; z-index:500; text-decoration:none;} a.tooltip:hover b {display:block; position:absolute; top:8px; left:20px; padding:5px; font-weight:normal; color:#fff; border:2px solid #d3cac1; background:#0f110e; width:170px;text-decoration: none;font-size: 85%;} ul.error{border-left: solid 3px #cc0000; color: #cc0000; font-weight: bold;margin: 10px 0; font-style: italic; list-style: none;} ul.error li{margin: 0 0 0 15px;}