﻿/* == 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:]

- Gallery
- News Listing
- Gig Listing
- Music Listing & Player
- Competition Listing
- Paging
- Signup Box
- Screen Messages
- Loaders
- Checkout Styles

----------------------------------------------------------------------------------------------------------------------*/


/* == Main Layout
----------------------------------------------------------------------------------------------------------------------*/

#wrap{background: #010101; width: 995px;margin: 0 auto;text-align: left;}
#wrap #head{float: left; width: 995px; height: 240px;background: url(../_img/head-graphic.gif) top left no-repeat;margin-bottom: 20px;}
#wrap #head a{float:left; width: 995px; height: 240px;}
#wrap #priNav{float: left;width: 120px;}
#wrap #mainContent{float: left; width: 875px; background: url(../_img/dot-vert.gif) top left repeat-y;min-height: 300px; height: auto !important; height: 300px;}
#wrap #foot{float: left; width: 995px;margin-bottom: 10px;}

/** content divisions **/
#wrap #mainContent #templateOne .zoneOne{float: left;width: 450px;padding: 0 30px;}
#wrap #mainContent #templateOne .zoneTwo{float: left;width: 305px;padding: 0 30px;background: url(../_img/dot-vert.gif) top left repeat-y;min-height: 300px; height: auto !important; height: 300px;}
#wrap #mainContent #templateTwo .zoneOne{float: left;width: 755px;padding: 0 30px;}

#wrap #mainContent #templateOne .zoneTwo .splitLeft{float: left;width:152px;}
#wrap #mainContent #templateOne .zoneTwo .splitRight{float: right;width:152px;}

/* == Head Content
----------------------------------------------------------------------------------------------------------------------*/


/* == Primary Navigation
----------------------------------------------------------------------------------------------------------------------*/

#wrap #priNav ul{margin: 0; list-style-image: none;}
#wrap #priNav ul li{margin: 0;float: left; width: 120px;margin: 0 0 7px 0;}
#wrap #priNav ul li a{float: left;background: url(../_img/sprite/main.gif) top left no-repeat;border-bottom: solid 3px #010101;height:0px !important; overflow: hidden; padding: 25px 0 0 0;}
#wrap #priNav ul li a:hover, #wrap #priNav ul li a.on{border-bottom: solid 3px #E0F0E3;}
#wrap #priNav ul li.navNews a{background-position: 0 -1px;width: 68px;}
#wrap #priNav ul li.navLive a{background-position: 0 -37px;width: 50px;}
#wrap #priNav ul li.navVideos a{background-position: 0 -71px;width: 82px;}
#wrap #priNav ul li.navPhotos a{background-position: 0 -107px;width: 86px;}
#wrap #priNav ul li.navBlog a{background-position: 0 -142px;padding-top: 30px;width: 53px;}
#wrap #priNav ul li.navMusic a{background-position: 0 -178px;width: 70px;}
#wrap #priNav ul li.navShop a{background-position: 0 -213px;padding-top: 30px;width: 60px;}
#wrap #priNav ul li.navForum a{background-position: 0 -248px;width: 76px;}
#wrap #priNav ul li.navComps a{background-position: 0 -283px;padding-top: 30px;width: 95px;}
#wrap #priNav ul li.navContact a{background-position: 0 -363px;padding-top: 30px;width: 100px;}

/* == Foot Content
----------------------------------------------------------------------------------------------------------------------*/

#wrap #foot ul{float: left;margin: 20px 0 20px 115px;display: inline;list-style-image: none;}
#wrap #foot ul li{float: left; height: 35px;margin: 0 50px 0 0;}
#wrap #foot ul li img{float: left;vertical-align: middle;}

/* == Gallery
----------------------------------------------------------------------------------------------------------------------*/

/** gallery list page **/
#wrap #mainContent .gallery ul, #wrap #mainContent .gallery ul li{margin:0;padding:0;list-style:none;}
#wrap #mainContent .gallery .list{float:left;width:100%;}
#wrap #mainContent .gallery ul.list {float:left;width:450px;margin:0;padding:0;list-style:none;}
#wrap #mainContent .gallery ul.list li{float:left;width: 428px;margin:0 0 12px 0; padding:10px;height:90px;border: solid 1px #2c2b2b;background: #181818;}

#wrap #mainContent .gallery ul.list li div.img {padding: 1px;float:left;margin:10px 0 0 0;border: solid 1px #2c2b2b;}
#wrap #mainContent .gallery ul.list li div.img a{padding:2px;margin-right:1px;}
#wrap #mainContent .gallery ul.list li div.img a:hover{padding:0;}
#wrap #mainContent .gallery ul.list li div.img a:hover img{height:74px;width:74px;}

#wrap #mainContent .gallery ul.list li div.txt{float:right;width: 330px;margin:8px 0 0 0}
#wrap #mainContent .gallery ul.list li div.txt h3{float:left;width:100%;font-size: 120%;padding: 0 0 4px 0;border-bottom: solid 1px #666;}
#wrap #mainContent .gallery ul.list li div.txt h3 a{text-decoration:none;}
#wrap #mainContent .gallery ul.list li div.txt h3 a:hover{text-decoration:underline;}
#wrap #mainContent .gallery ul.list li p{margin: 6px 0;width:100%;float:left;}
#wrap #mainContent .gallery ul.list li p.info{width:70%;}
#wrap #mainContent .gallery ul.list li a.right{float: right;font-size:90%;}

#wrap #mainContent .gallery h2 div{float:left; width:70%;}
#wrap #mainContent .gallery h2 a{float:right; font-size:80%;font-family: arial;padding:4px 10px 0 0;}
#wrap #mainContent .gallery h2 a:hover{color:Red;}
#wrap #mainContent .gallery .main {float:left;width:440px;height:333px;overflow:hidden;}
#wrap #mainContent .gallery .main .int{float:left;width:1000px;height:10000px;}
#wrap #mainContent .gallery .main .int ul{float:left;width:100%;border-top:solid 3px #fff;border-left:solid 3px #fff;}
#wrap #mainContent .gallery .main .int ul li{float:left;width:434px; height:327px;border-bottom:solid 3px #fff;border-right:solid 3px #fff;text-align:center;background: transparent url('/_img/bg/gallery.gif') no-repeat top left;overflow:hidden;}
#wrap #mainContent .gallery .main .int ul li img.show{background-color:#fff;}
#wrap #mainContent .gallery .main img.portrait{border-left:solid 3px #fff;border-right:solid 3px #fff;}
#wrap #mainContent .gallery .main img.landscape{border-top:solid 3px #fff;border-bottom:solid 3px #fff;}

#wrap #mainContent .gallery .thumbs {float:left;width:372px;padding: 0 0 10px 0;margin: 0 0 15px 30px;display: inline;overflow:hidden;}
#wrap #mainContent .gallery .thumbs .fullthumbs {float:left;width:90000px;}
#wrap #mainContent .gallery .thumbs .scrollLeft{float:left;margin-bottom: 5px;}
#wrap #mainContent .gallery .thumbs .scrollRight{float:right;}
#wrap #mainContent .gallery .thumbs .scrollLeft:hover,#wrap #mainContent .gallery .thumbs .scrollRight:hover{text-decoration:underline;}
#wrap #mainContent .gallery .thumbs .scrollInd{float:left;width:372px;background-color:#000;border-bottom:solid 1px #333;border-top:solid 1px #333;}
#wrap #mainContent .gallery .thumbs .scrollInd .current{float:left;width:80px;height:5px;line-height:5px;background-color:#fff;font-size:1px;}
#wrap #mainContent .gallery .thumbs ul,
#wrap #mainContent .gallery .thumbs ul li {float:left;margin:0;padding:0;}
#wrap #mainContent .gallery .thumbs ul li {display:inline;}
#wrap #mainContent .gallery .thumbs ul{padding: 0 10px 10px 0;}
#wrap #mainContent .gallery .thumbs ul li a,#wrap #mainContent .gallery .thumbs ul li img{float:left;}
#wrap #mainContent .gallery .thumbs ul li a{padding:2px;margin-right:0;}
#wrap #mainContent .gallery .thumbs ul li a:hover{padding:0;}
#wrap #mainContent .gallery .thumbs ul li a:hover img{height:74px;width:74px;}

#wrap #mainContent .gallerySnippet{border: solid 1px #2c2b2b;background: #181818; padding: 10px 10px 10px 23px;}
#wrap #mainContent .gallerySnippet a img{border: solid 1px #2c2b2b;padding: 3px;}
#wrap #mainContent .gallerySnippet a:hover img{border: solid 1px #ccc;}

/* == News List
----------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent ul.newsList{margin: 5px 0; list-style-image: none;}
#wrap #mainContent ul.newsList li{margin: 20px 0;}
#wrap #mainContent ul.newsList li p{margin: 0 0 10px 0;}

/* == Gig List
----------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent .gigsBasic br{height: 1px; line-height: 1px;}
#wrap #mainContent .gigsBasic ul{margin: 0;list-style-image: none;}
#wrap #mainContent .gigsBasic ul li{padding: 3px 0;}
#wrap #mainContent .gigsBasic ul li .date{padding-right: 10px; font-weight:bold;}
#wrap #mainContent .gigsBasic ul li .title{}

#wrap #mainContent .gigs ul,
#wrap #mainContent .gigs ul li{float: left; width:100%;margin: 0;list-style:none;}
#wrap #mainContent .gigs ul li{font-size:90%;border-bottom: dashed 1px #fff;margin: 0; padding: 10px 0;}
#wrap #mainContent .gigs ul li .btn{float: right;}

/* == Music Listing & Player
----------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent .musicPane{float:left; width: 100%;}
#wrap #mainContent .musicPane p{margin:0;padding:0;}
#wrap #mainContent .musicPane .list{float: left;width: 240px;}
#wrap #mainContent .musicPane .player{float: right;width: 200px;}
#wrap #mainContent .musicPane .list ul.listing, #wrap #mainContent .musicPane .list ul.listing li{list-style:none;margin:0;float:left;width:100%;}
#wrap #mainContent .musicPane .list ul.listing li{padding: 3px 0;min-height: 90px; height: auto !important; height:90px;}
#wrap #mainContent .musicPane .list ul.listing li a{font-weight:bold;}
#wrap #mainContent .musicPane .list ul.listing li div.img {padding: 1px;float:left;margin:0 0 2px 0;border: solid 1px #2c2b2b;}
#wrap #mainContent .musicPane .list ul.listing li div.img a{padding:2px;margin-right:1px;}
#wrap #mainContent .musicPane .list ul.listing li div.img a:hover{padding:0;}
#wrap #mainContent .musicPane .list ul.listing li div.img a:hover img{height:74px;width:74px;margin:0;}
#wrap #mainContent .musicPane .list ul.listing li div.txt{float:left;margin: 2px 4px;width:120px;}
#wrap #mainContent .musicPane .player .holder .top img{width: 200px;padding: 1px;float:left;margin:0 0 2px 0;border: solid 1px #2c2b2b;}

/* == Competition List
----------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent ul.compsList{margin: 5px 0; list-style-image: none;}
#wrap #mainContent ul.compsList li{margin: 0 0 20px 0;}
#wrap #mainContent ul.compsList li .img{float:left;padding: 1px;margin:0 15px 2px 0;border: solid 1px #2c2b2b;}
#wrap #mainContent ul.compsList li .txt{float:left;width:340px;margin: 10px 0 0 0;}
#wrap #mainContent ul.compsList li .txt a{font-weight:bold; font-size:170%;}
#wrap #mainContent ul.compsList li p{margin: 10px 0;font-size:120%;}
#wrap #mainContent .compsview .floatRight{margin: 10px 0 5px 10px;border: solid 1px #2c2b2b;padding:1px;}

#wrap #mainContent .compsview ul.entryList,
#wrap #mainContent .compsview ul.entryList li{margin: 5px 0; list-style-image: none;float:left;}
#wrap #mainContent .compsview ul.entryList li{width:90px; overflow:hidden; height: 110px;}
#wrap #mainContent .compsview ul.entryList li img{float:left;padding: 1px;margin:0 0 2px 0;border: solid 1px #2c2b2b;}

/* =Paging
--------------------------------------------------------------------------------------------------------------------*/
#wrap #mainContent .paging{float:left;width:98%;margin: 0;}
#wrap #mainContent .paging .inner{float:left;width:100%;}
#wrap #mainContent .paging .text{float:left;width:30%;font-weight: bold;font-size: 110%;}
#wrap #mainContent .paging .text span{font-weight: normal;font-size: 80%;}
#wrap #mainContent .paging .pg{float:right;width:65%;text-align:right;}
#wrap #mainContent .paging .pg ul{float:right;text-align:right;list-style:none;}
#wrap #mainContent .paging .pg ul li{float:left;list-style:none;width:auto;}
#wrap #mainContent .paging .pg ul li.det{padding: 2px 12px 2px 0;font-weight:bold;}
#wrap #mainContent .paging .pg ul li a{float:left;text-align:center;padding: 0 2px;margin: 0 1px;border: solid 1px transparent;color:#fff;font-weight:bold;}
#wrap #mainContent .paging .pg ul li a:hover,#content .paging .pg ul li a.on{text-decoration:none;border: solid 1px #fff;background-color: #fff;color:#000;}
#wrap #mainContent .paging .pg ul li a:hover{}
#wrap #mainContent .paging .divLoading{display:none; color: #666; font-weight:normal;font-size:90%;}
#wrap #mainContent .paging .divLoading img{vertical-align: 0;}

/* =Signup Box
--------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent .signup{border: solid 1px #2c2b2b;background: #181818; padding: 10px;}
#wrap #mainContent .signup label{width: 70px;}
#wrap #mainContent .signup input{margin:0 0 1px 0;}

/* =Screen Messages
--------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent .msgInfo{clear: both;border: solid 1px #2c2b2b;background: #181818; padding: 5px;}
#wrap #mainContent .msgError{clear: both;border: solid 1px #fe0000;background: #181818; padding: 5px;color: #fe0000;}
ul.error{color: #fe0000;}


/* =Loaders
--------------------------------------------------------------------------------------------------------------------*/

#wrap #mainContent .loading{display:none;}

/* == Store Pages
----------------------------------------------------------------------------------------------------------------------*/

.store .prodListing{float: left; width: 100%;margin: 10px 0; list-style: none;}
.store .prodListing li{float: left; width: 100%;margin: 0 0 5px 0;}
.store .prodListing li p{margin: 0;}
.store .prodListing li a img{float: left;border: 3px #4f3632 solid;margin: 0 10px 0px 0;}
.store .prodListing li a.description{font-size: 150%; color: #fff; text-transform: uppercase; text-decoration: none;display: block;}
.store .prodListing li div.summary{margin: 10px 0;line-height: 1.7em;}
.store .prodListing li div.stockTitle{padding-bottom: 5px;}
.store .prodListing li div.productInfo a, .infoLink a, .actionBuyNow{background-image: none;background: #010101; border: 1px #373636 solid; color: #fff; width: auto; cursor: pointer; text-decoration: none; font-weight: bold; font-size: 90%; letter-spacing: 0; padding: 5px 10px 7px 10px; float: left;}
.store .prodListing li div.productInfo a:hover, .infoLink a:hover, .actionBuyNow a:hover{background: #fff;color: #000;}
.store .prodListing li div.productInfo .price{font-weight: bold; padding-bottom: 5px; display: block;}
.store .prodListing .infoLink a{display:none;}
.store .prodListing li div.stockTitle em{font-style: normal;font-weight: bold;color: #92d4f6;}
.store .prodListing li .infoLink{padding-top: 5px;}

#store .left50percent, div.fifty{float: left; width: 49%;border: solid 4px #1d1d1d; background: #323232;}
#store .left50percent h3, div.fifty h3{background: #111;padding: 5px;color: #fff;font-size: 100%;}

div.fifty fieldset{margin: 10px;}
div.fifty fieldset label{width: 120px;}

/* =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; border:5px solid #323232; background:#000; width:170px;text-decoration: none;}


/* =Download Promo
--------------------------------------------------------------------------------------------------------------------*/

.downloadPromo{background:#f5ed7e url(/_img/download-promo-bg1.gif) top left no-repeat; width: 450px; padding-top: 220px; padding-bottom: 20px; color: #000; }
.downloadPromo a{font-weight:bold;}
.downloadPromo p{text-align: center;}
.downloadPromo label{color: #000; width: 60px; margin-left: 60px; margin-top: 3px;}
.downloadPromo .input{width: 230px;}


.downloadPromoTwo{background:#fff url(/_img/download-promo-bg3.gif) top left no-repeat; width: 780px; height: 315px; padding-top: 120px; color: #000; }
.downloadPromoTwo a{font-weight:bold; color: #000;}
.downloadPromoTwo p{text-align: left; font-size:120%}
.downloadPromoTwo label{color: #000; width: 35px; margin-left: 3px; margin-top: 3px;}
.downloadPromoTwo .input{width: 170px;}
.downloadPromoTwoEmail{width: 250px; margin-left: 520px; top: 0px;}