/*=======================================================
 CSS Document for Scoundrel Records
=======================================================*/

@import url("global.css");
@import url("thickbox.css");
@import url("sIFR-screen.css");

.hidden { display: none; }
.show { display: block; visibility: visible; }

/*=============================================================
	Header - login + cart + nav + logo
=============================================================*/

#header-container { width: 100%; height: 200px; padding: 0; position: fixed; top: 0; left: 0; z-index: 90; }
#header { width: 970px; height: 200px; position: relative; z-index: 90; margin: 0 auto; top: 0;  background: url('../images/bg/header.jpg') no-repeat 50% 0;  display: block; }
#logo { background: url('../images/core/logo.gif') no-repeat 0 0; width: 160px; height: 200px; display: block; position: absolute; top: 0; left: 405px; z-index: 99; overflow: hidden; }
#logo:hover, #logo.logohover { background-position: 0 -200px!important; }
#logo h2 { display: none; background: none; padding: 0; margin: 0; }
#popup-logo { width: 136px; height: 140px; float: left; display: block; margin: 0 20px 0 0; background: url('../images/core/logo-s.jpg') no-repeat 0 0; }

/*login*/
.login-area { width: 370px; height: 40px; position: absolute; left: 0; top: 100px; z-index: 99; display: inline; padding-left: 60px; background: url('../images/bg/login.gif') no-repeat 0 0!important;}
.login-area form.cmxform label { width: 0!important; margin: 0!important; height: 40px; }
.login-area form.cmxform label span { text-indent: -9999em; }
.login-area form.cmxform li { margin: 0 5px 0 0!important; float: left; display:inline; }
.login-area form.cmxform li p { font-size: 1em; padding-top: 10px; margin: 0; }
.login-area form.cmxform input { margin: 10px 0!important; height: 17px; padding: 3px 5px 0 5px; color: #48dee4!important; }
.login-area form.cmxform input#username { width: 105px!important; }
.login-area form.cmxform input#member_name { width: 120px!important; margin-right: 5px; font-weight: bold!important; }
.login-area form.cmxform input#password { width: 80px!important; }
.login-area form.cmxform input#loginnow { margin: 0!important; padding: 0!important; background: url('../images/bg/login2.gif') no-repeat 0 0; text-indent: -9999em; width: 65px; height: 40px; }
.login-area form.cmxform input#loginnow:hover, #login-area form.cmxform input#loginnow.loginhover { background-position: 0 -40px!important; }
.login-area form.cmxform input#logoutnow { margin: 0!important; padding: 0!important; background: url('../images/bg/logout.gif') no-repeat 0 0; text-indent: -9999em; width: 65px; height: 40px; }
.login-area form.cmxform input#logoutnow:hover, #login-area form.cmxform input#logoutnow.logouthover { background-position: 0 -40px; }
body#checkout-page #not-login, body#members-page #not-login { display: none!important; }
#logged-in { display: none; }
body#checkout-page #logged-in, body#members-page #logged-in { display: block!important; padding: 0!important; background: none!important; width: 380px; }

.login-area form.cmxform li a#forgotten_password {width:49px; height:40px; display:block; text-indent:-999px; background:url('../images/core/forgotten.gif') no-repeat 0 0;}
.login-area form.cmxform li a#forgotten_password:hover {background-position:0 -40px;}


/*cart*/
#cart { width: 360px; height: 40px; position: absolute; left: 630px; top: 100px; z-index: 99; display: inline; }
#cart form.cmxform label { width: 60px; text-align: right; margin: 0!important; height: 40px; }
#cart form.cmxform li { margin: 0 5px 0 0!important; float: left; }
#cart form.cmxform input { margin: 10px 0!important; height: 17px; padding: 3px 5px 0 5px; color: #fad850!important; }
#cart form.cmxform input#totalprice { width: 90px!important; }
#cart form.cmxform input#totalitems { width: 20px!important; }
#cart form.cmxform input#viewcart { margin: 0!important; padding: 0!important; background: url('../images/bg/view.gif') no-repeat 0 0; text-indent: -9999em; width: 70px; height: 40px; }
#cart form.cmxform input#viewcart:hover, #login-area form.cmxform input#viewcart.viewhover { background-position: 0 -40px!important; }
body#cart-page #cart form { display: none!important; visibility: hidden!important; }
#cart-msg { display: none; }
body#cart-page #cart-msg { display: block; }

/*navigation*/
ul#nav { list-style: none!important; width: 970px; height: 50px; position: absolute; left: 0; top: 150px; z-index: 95; margin: 0!important; display: inline-block; }
ul#nav li { display: block; position: relative; float: left; line-height: 11px; font-family: "Arial"!important;  }
ul#nav a { height: 50px; overflow: hidden; text-indent: -9999em; display: block; float: left; }
ul#nav a:hover { background-position: 0 -50px!important; }
ul#nav li ul { width: 150px; height: auto; display: block; left: -9999px; position: absolute; top: 100%; margin: 0; padding: 0; }
ul#nav ul a { float: left; font-weight: normal; text-indent: 0!important; text-align: center!important; width: 130px; height: 12px; padding: 5px 10px; font-size: 0.9em; text-decoration: none; background: url('../images/bg/subnav.jpg') no-repeat 0 0!important; color: #fff!important; }
ul#nav ul a:hover { text-decoration: none; font-weight: bold; background-position: 0 -22px!important; }
/* hover actions */
ul#nav li:hover ul, ul#nav li.over ul { left: 0; }
ul#nav li.over a.onsection { background-position: 0 -50px; }
/* nav bg */
a#blank { background: none; width: 150px; }
a#navhome { background: url('../images/core/nav-home.jpg') no-repeat 0 0; width: 80px; }
a#navabout { background: url('../images/core/nav-about.jpg') no-repeat 0 0; width: 150px; }
a#navartists { background: url('../images/core/nav-artists.jpg') no-repeat 0 0; width: 90px; }
a#navnews { background: url('../images/core/nav-news.jpg') no-repeat 0 0; width: 90px; }
a#navgenres { background: url('../images/core/nav-genres.jpg') no-repeat 0 0; width: 100px; }
a#navmerchandise { background: url('../images/core/nav-merchandise.jpg') no-repeat 0 0; width: 125px; }
a#navgallery { background: url('../images/core/nav-gallery.jpg') no-repeat 0 0; width: 95px; }
a#navcontact { background: url('../images/core/nav-contact.jpg') no-repeat 0 0; width: 90px; }
/*on hover*/
body#home-page a#navhome, body#about-page a#navabout, body#artists-page a#navartists, body#news-page a#navnews, body#genres-page a#navgenres,
body#merchandise-page a#navmerchandise, body#gallery-page a#navgallery, body#contact-page a#navcontact { background-position: 0 -50px!important; }

/*=============================================================
	Main body - featured-area + contents-area
=============================================================*/

#main-container { width: 970px; height: auto; margin: 0 auto; display: block; margin-top: 200px; position: relative; z-index: 10; background: url('../images/bg/featured.gif') no-repeat 0 0;  }
#main-container:after, #container:after { height: 0; visibility: hidden; content: "."; display: block; clear: both; }
body.popup #container { width: 630px; height: auto; min-height: 160px; padding: 10px; margin: 10px auto; display: block; background: url('../images/bg/popup.gif') repeat-y 50% 0; }

/* featured + cta */
#featured-area { width: 250px; height: auto; padding: 0; display: block; float: left;  }
.ctas { height: auto; padding-top: 30px; display: inline; float: left; }
.ctas a { width: 230px; display: block; float: left; clear: both; text-indent: -9999em; }
.ctas a:hover { background-position: 10px -125px!important; }
a#online-download { height: 125px; padding: 0 20px; background: url('../images/core/online-download.gif') no-repeat 10px 0; }
a#sign-up { height: 80px; padding: 0 10px; background: url('../images/core/signup-now.gif') no-repeat 10px 0; }
a#sign-up:hover, a#sign-up.signuphover { background-position: 10px -80px!important; }
body#members-page .ctas { height: 125px; overflow: hidden!important; }
.featured { width: 210px; height: 210px; padding: 0 20px 15px 20px; clear: both; display: block; float: left; overflow: hidden; }
.featured h2 { text-indent: -9999em; height: 30px; background: none!important; padding: 0!important; }
.featured .feat-thumb { clear: both; float: left;width: 210px; height: 120px; display: block; overflow: hidden!important; position: relative; z-index: 15; }
.feat-thumb span.overlay { display: block; width: 210px; height: 120px; position: absolute; top: 0; z-index: 20; }

img.center-box {
    display: block;
    margin-left: auto;
    margin-right: auto }

#feat-artists span.overlay { background: url('../images/core/thumb-overlay-art.gif') no-repeat 0 0;}
#feat-release span.overlay { background: url('../images/core/thumb-overlay-rel.gif') no-repeat 0 0; }
#feat-merchandise span.overlay { background: url('../images/core/thumb-overlay-merch.gif') no-repeat 0 0 }
span.overlay:hover, span.overlay.overlayhover { background-position: 0 -120px!important; }
.featured span { font-size: 1.1em; text-align: center; font-weight: bold; clear: both; height: 35px; padding: 5px 0 0 0; display: block; }
.featured span a:hover { text-decoration: underline!important; }
#feat-artists { background: url('../images/bg/feat-art.gif') no-repeat 0 0; }
#feat-release { background: url('../images/bg/feat-rel.gif') no-repeat 0 0; }
#feat-merchandise { background: url('../images/bg/feat-merch.gif') no-repeat 0 0; }
#feat-artists span a, #feat-artists span a:hover { color: #e5982a!important; }
#feat-release span a, #feat-release span a:hover { color: #e5c82a!important; }
#feat-merchandise span a, #feat-merchandise span a:hover { color: #d0f427!important; }

#contents-area { width: 700px; height: auto; float: right; padding-top: 25px; display: inline; }
#contents-area p, #contents-area h3, #contents-area h4, #contents-area h5 { padding-left: 10px; }
.sub-contents { width: 200px; height: auto; float: right; margin: 0 0 15px 15px; display: inline; }

/* flash */
#flash-banner, object#flash-banner { background: url('../images/bg/flash.gif') no-repeat 0 0; width: 700px; height: 230px; display: block; clear: both; margin-top: -25px; }
#banner { width: 700px; height: 120px; display: block; clear: both; }

/* sub gallery */
#sub-gallery { float: left; display: block; clear: both; width: 152px; height: 350px; padding: 60px 24px 0 24px; background: url('../images/bg/gallery.jpg') no-repeat; }
body#contact-page #sub-gallery { background: url('../images/bg/cta.jpg') no-repeat; }
#sub-gallery ul.gallery-thumb { list-style: none!important; margin: 0; }
ul.gallery-thumb li { background-color: #000; width: 152px; height: 102px; display: inline; clear: both; margin: 5px 0; float: left; overflow: hidden; }
ul.gallery-thumb li a { width: 150px; height: 100px; border: 1px solid #333333; display: block; }
ul.gallery-thumb li a:hover { border: 1px solid #666666; }

/*contact */
.contact-details { font-size: 1.1em; text-align: center; width: 200px; height: 50px; padding: 57px 30px 33px 20px; margin: 10px 0; background: url('../images/bg/contact.gif') no-repeat 20px 0; float: left; clear: both; }
body#home-page .contact-details { padding: 57px 0 33px 0!important; background-position: 0 0; }
body#home-page #featured-area .contact-details, body#contact-page #featured-area .contact-details, body#contact-page .contact-details { display: none!important; visibility: hidden!important; }

/* listing pages */
ul.listings { list-style: none!important; margin: 0; padding: 0; }
ul.listings li { background: url('../images/bg/listing.gif') no-repeat 0 0; padding: 9px 14px; width: 662px; height: 122px; display: block; clear: both; float: left; margin-bottom: 10px; overflow: hidden; }
.condensed li { height: 102px!important; background: url('../images/bg/listing2.gif') no-repeat 0 0!important; padding: 7px 14px; }
.artist-thumb, .news-thumb { float: left; width: 182px; height: 122px; padding: 0 20px 0 0; border-right: 1px solid #121212; overflow: hidden; display: inline; }
.condensed .artist-thumb { height: 102px!important; width: 152px!important; background-color: #000; padding: 0; border: 0; }
.artist-thumb a, .news-thumb a { width: 180px; height: 120px; border: 1px solid #333333; display: block; }
.artist-thumb a:hover, .news-thumb a:hover { border: 1px solid #666666;  }
.condensed .artist-thumb a { width: 150px; height: 100px; border: 1px solid 333333; display: block; }
.condensed .artist-thumb a:hover { border: 1px solid #666666; }
.artist-info { display: block; float: right; width: 440px; }
.condensed .artist-info { display: block; float: right; width: 470px; border-left: 1px solid #022729; padding-left: 15px; }
.news-info { display: block; float: right; width: 440px; height:110px; padding: 5px 10px 5px 0; position: relative; overflow: auto; visibility: visible; /*for IE8*/ }
.artist-info a, { text-align: right; display: block; background-color: #171717; padding: 3px 5px; }
.condensed .artist-info a { background-color: #000; }
.artist-info a:hover, .news-info a:hover {text-decoration: none!important; font-weight: bold; }
.artist-info p, .artist-info h2, .artist-info h3, .artist-info h4, .artist-info h5, .artist-info span { font-size: 1em!important; background: none!important; margin: 0 0 3px 0!important; padding: 0 0 3px 0!important; border-bottom: 1px dotted #121212; display: block; clear: both; }
.news-info p, .news-info h2, .news-info h3, .news-info h4, .news-info h5, .news-info span { font-size: 1em!important; background: none!important; margin: 0 0 10px 0; }
.condensed .artist-info p, .condensed .artist-info h2, .condensed .artist-info h3, .condensed .artist-info h4, .condensed .artist-info h5, .condensed .artist-info span { padding: 0 0 2px 0;  margin: 0 0 2px 0; border-bottom: 1px dotted #022729; }

/*details page*/
ul.thumb-display { list-style: none!important; width: 182px; height: auto; float: right; margin: 0 10px 15px 15px; padding: 5px 10px; display: inline; background-color: #000; }
ul.thumb-display li { float: left; width: 182px; height: 122px; padding: 0; margin: 5px 0; clear: both; overflow: hidden; display: inline; }
ul.thumb-display li a { width: 180px; height: 120px; border: 1px solid #333333; display: block; }
ul.thumb-display li a:hover { border: 1px solid #666666; }
.itemise { margin: 0 10px 10px 0; padding: 5px 0; border-bottom: 1px dotted #555; display: block; width: auto; }
/*for artist music*/
table.panel { background: none; border: 0; }
table.panel td { background: none; padding: 0; vertical-align: top; font-size: 10px; width: 210px; padding: 10px; }
#music-sample { background-color: #060606; }
#track-download { background-color: #101010; border-right: 1px solid #161515; border-left: 1px solid #161515; }
#track-download li { height: auto; }
#album-download { background-color: #080808;  }
#album-download li { height: auto; }
.sub-title { padding: 5px; height: 30px; width: 300px; background: url('../images/bg/subtitle2.gif') no-repeat 0 0; margin-bottom: 15px; }

.popup_window {display:none; color:#fff;}
.popup img {float:right; margin-left:10px;}


/*panel listing*/
ul.sub-listing { list-style: none!important; margin: 0; padding: 0; }
ul.sub-listing li { position: relative; float: left; width: 300px; padding: 0 0 5px 0; border-bottom: 1px dotted #252525; margin-bottom: 5px; display: block; clear: both; }
ul.sub-listing li .album-pic { width: 47px; height: 47px; float: left; display: block; overflow: hidden; margin: 3px 10px 5px 0;}
ul.sub-listing li .album-pic a { width: 45px; display: block; height: 45px; border: 1px solid #fff; padding: 0; margin: 0; }
ul.sub-listing li span { padding: 0 0 1px 0px; display: inline; }
ul.sub-listing li span em { color: #92e045; font-style: normal; font-weight: bold; }
ul.sub-listing li form { float: left; }
ul.sub-listing input { font-size: 1.1em; width: 200px; height: 28px; display: block; clear: both; font-weight: normal; padding: 0 40px 0 5px; margin: 2px 0!important; float: left; text-align: right; color:#f68e12; }
ul.sub-listing input:hover, ul.sub-listing input.panelhover { text-align: left; background-position: 5px 1px!important; padding: 0 0 0 40px!important; color: #7eb845!important; text-decoration: underline!important; font-weight: bold;  }

ul.sub-listing li form.download_button input {display:none !important;}
ul.sub-listing li form.download_button { display:inline !important; }
ul.sub-listing li form.download_button a { float: left; display: block; }

td#music-sample li a, a#buy_download { width: 155px; height: 22px; display: block;padding: 3px 40px 3px 5px; margin: 2px 0; float: right; text-align: right; background: #000 url('../images/icons/music1.gif') no-repeat 97% 1px!important;  }
td#music-sample li a:hover, td#music-sample li a.samplehover { text-align: left; background-position: 5px 1px!important; padding: 3px 5px 3px 40px; font-weight: bold; }

form#playlist input.checkbox { width: 20px!important; float:right!important; border:none!important;}

/*td#album-download form {clear:left;}*/

body#artists-page td#track-download, body#artists-page td#album-download {width:320px;}
body#artists-page td#track-download li, body#artists-page td#album-download li {width:320px;}

/*icons*/
.download-track { background: #171717 url('../images/icons/music2.gif') no-repeat 170px 1px; }
.download-album { background: #111 url('../images/icons/cart.gif') no-repeat 170px 1px; }

/*extra artist links*/
#extra-links { width: 660px; height: auto; display: block; padding: 10px 15px; background-color: #000; clear: both; }

/*gallery detail*/
ul#gallery-listing { list-style: none!important; margin: 0 0 10px 10px; padding: 0; width: 680px; float: left; }
ul#gallery-listing li { width: 152px; height: 170px; overflow: hidden; background-color: #000; margin: 5px 8px; display: inline; float: left; }
ul#gallery-listing li .gallery-thumb { width: 152px; height: 102px; background-color: #000; overflow: hidden; }
ul#gallery-listing li a { width: 150px; height: 100px; display: block; border: 1px solid #333333; }
ul#gallery-listing li a:hover { border: 1px solid #666666; }
ul#gallery-listing li span { width: 140px; padding: 3px 0; margin: 0 auto; display: block;  text-align: center!important; line-height: 15px; }
.p-date { height: 12px; border-top: 1px dotted #252525; }
.p-caption { height: 35px; }

/*merchandise*/
.merchandise-listing { background: url('../images/bg/listing.gif') no-repeat 0 0; padding: 9px 14px; width: 662px; height: 122px; display: block; clear: both; margin-bottom: 10px; overflow: hidden; }
.merchandise-listing:after { height: 0; visibility: hidden; content: "."; display: block; clear: both; }
.merchandise-thumb { float: left; width: 182px; height: 122px; padding: 0 15px 0 0; border-right: 1px solid #121212; overflow: hidden; display: inline; }
.merchandise-thumb a { width: 180px; height: 120px; border: 1px solid #333333; display: block; }
.merchandise-thumb a:hover { border: 1px solid #666666; }
.merchandise-info { display: inline; float: right; width: 450px; }
.merchandise-info p { background: none!important; margin: 0 0 5px 0!important; padding: 0!important; clear: both; }
.item-desc { height: 55px; overflow: hidden; padding: 5px 10px 5px 5px; margin: 0; background-color: #080808; clear: both; border: 1px dotted #121212; }
.tem-desc span { font-size: 1.2em; }
.merchant ol { padding: 8px 0 0 0!important; margin: 0; width: 450px!important; }
.merchant li { float: left!important; display: inline; margin: 0 10px 5px 0!important; padding: 0; }
.merchant li.sizes { width: 140px; margin-top: -2px!important; font-size: 0.9em;  color:#51d5f6; }
.merchant li.sizes p { font-size: 1em; margin-bottom: 3px; line-height: 10px; color:#fff!important; }
.merchant label { width: 35px!important; margin: 3px 0 0 0!important; padding: 0;}
.merchant input.item-price { width: 75px!important; height: 20px!important; color:#51d5f6!important; padding: 3px 3px 0 3px!important; background-color: #141414!important; }
.merchant input.item-qty { margin-left: -8px; width: 20px!important; height: 20px!important; color:#51d5f6!important; padding: 3px 2px 0 2px!important; background-color: #141414!important; text-align: center; }
.merchant select { width: 60px!important; height: 23px!important; padding: 3px; background-color: #e2e2e2!important; color: #000!important; }
.merchant input.addnow { float: left; width: 100px!important; color: #f68e12!important; margin: 0!important; height: 25px; background: #171717 url('../images/icons/cart.gif') no-repeat 3px 0!important; padding: 3px 5px 3px 32px!important; text-align: left!important }
.merchant input.addnow:hover, .merchant input.addnow.addhover { color: #7eb845!important; background-color: #252525!important; }

/*members download*/
.download-section, .history { display: block; padding: 5px 10px; border: 1px solid #252525; background-color: #080808; margin: 0 10px 5px 10px; clear: both; }
.history { background-color: #011516!important; margin: 0 10px 10px 10px!important; }
.download-section span, .history span { font-size: 1.1em; display: block; height: 15px; padding: 5px 0; margin: 0; }
.download-section h4, .history h4 { margin: 0 0 5px 0!important; padding: 0 0 3px 0!important; border-bottom: 1px dotted #252525; }
span.download-link { font-weight: bold; background: url('../images/icons/download-link.gif') no-repeat 0 0; padding-left: 30px; }
span.download-time { background: url('../images/icons/download-time.gif') no-repeat 0 0; padding-left: 30px; }
span.download-count { background: url('../images/icons/download-count.gif') no-repeat 0 0; padding-left: 30px; }
.download-section input { width: 30px!important; background-color: #000!important; color: #7eb845; font-weight: bold; height: 20px; text-align: center!important; }
.history input { width: 30px!important; background-color: #011516!important; color: #7eb845; font-weight: bold; height: 20px; text-align: center!important; }
input.stretched { width: 130px!important; text-align: left!important; }

/*download tracks*/
ul#download-tracks {clear:both; list-style:none;}
ul#download-tracks li {float:left; width:190px; height:140px; padding:10px 20px 10px 10px; background:url('../images/core/track-background.gif') no-repeat 0 0;}
ul#download-tracks li .album-pic { width: 47px; height: 47px; float: left; display: block; overflow: hidden; margin: 3px 10px 5px 0;}
ul#download-tracks li .album-pic a { width: 45px; display: block; height: 45px; border: 1px solid #fff; padding: 0; margin: 0; }
ul#download-tracks li span {padding: 0 0 1px 5px; display: block;}
ul#download-tracks li span.artist_name {color: #92e045; font-style: normal; font-weight: bold;}
ul#download-tracks li span em {font-weight:normal; color:#fff;}
ul#download-tracks li span.track_name {color: #51d5f6; text-transform: uppercase; font-weight:bold; }
ul#download-tracks li span.price {color:#fff; }
ul#download-tracks li span a:hover {text-decoration: none!important; font-weight: bold; }
ul#download-tracks li div.track-info {float:right; width:130px;padding-bottom:5px;}
ul#download-tracks li span a { clear:both; text-align: right; display: block; background-color: #171717; padding: 3px 5px; margin-top:5px; }

.album_heading {padding:0; margin:0 0 10px 0;}
span.album_cost, span.music_style { line-height:30px;}
span.album_cost {color: #51d5f6; margin-left:10px;}
h4.track_heading {padding:0 0 10px 0; margin:0 !important;}
ol.track_listing li{padding-bottom:4px;}


/* ARTIST LOGIN */
ul#artist_login_details li {list-style:none; padding-bottom:10px; font-size:12px;}
table.tabular {width:100%;}
table.tabular tr th {padding:5px;}
table.tabular tr td {width:25%; text-align:center;}

/* Download Tracks */
table#download_tracks tr th {font-size:14px; padding:20px 0 5px 0; text-align:left;}
table#download_tracks tr td {vertical-align:top;}
table#download_tracks tr td#track-download, table#download_tracks tr td#album-download {padding-top:10px;}

/*=============================================================
	Footer
=============================================================*/

#footer { margin: 0 auto; width: 970px; height: 55px; padding: 55px 0 0 0; text-align: center; display: block; position: relative; z-index: 90; background: url('../images/bg/footer.gif') no-repeat 0 0; clear: both; }
#footer p { text-align: center; font-size:1.1em; font-family: "Arial"; color: #087787; height: 23px; margin: 0; }
#footer a { color: #087787; text-decoration: none; }
#footer a:hover { color: #7eb845; text-decoration: underline; }


/*=======================================================
 End of CSS Document for 
=======================================================*/
