/*
 COLORS
 white
 #8a8a8a
 #F67A20
 black
 
*/


/*---------------------------------------------------------------*/
/* =Reset CSS
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
-------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {outline: 0;}
ol, ul {
	list-style: none;
}
ol, ul li {
	
}
#img.background-image {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
strong, em {font-weight:bold; color:#F67A20;}

/*blockquotes*/
blockquote {
	font-size:1.2em;
	font-weight:bold;
	color:#ed1c24;
	text-align:justify;
	margin:0px;
}
blockquote:before {
	content: no-open-quote;
}
blockquote:after {
	content: no-close-quote;
}
blockquote p:before {
	content: open-quote;
}
blockquote p:after {
	content: close-quote;
}
/* =Forms
-------------------------------------------------------------*/

/* Removes fieldset borders. even on Opea 7 */
fieldset {border: 1px solid transparent;}
label {display:block;}
input {display:block; font-size:1.1em;}
select {font-size:1.1em;}

/* =Tables
-------------------------------------------------------------*/

table { 
	border-spacing: 0;
	border-collapse: collapse;
}

td {
	text-align: left;
	font-weight: normal;
}

/*Fonts
-------------------------------------------------------------*/

body {
	overflow: hidden;
    font-family:sans-serif;
    font-size:67.2%;
    font-weight:normal;
    font-style:'arial';
    letter-spacing:0.1em;
    color:#d9dbe4;
}

a, a:visited {color:#FFFFFF;text-decoration:none;}
a:hover, a:active {color:#F67A20;text-decoration:none;}

/*Headings
-------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {}
h1 {
    display:none;
}
h2 {
    font-size:1.3em;
    font-weight:normal;
    color:#d9dbe4;
}


/*CORE LAYOUT*/
body {
    width:100%;
    /*background:#000000 url('../images/backtest.jpg') no-repeat top left;*/
}

div#wrapper {
    width:980px;
    margin:0px auto;
    padding-bottom:28px;
}
div#main {
    width:977px;    
}
div#main div#left {
    width:233px;
    float:left;
    clear:left;
}
div#main div#right {
    width:744px;
    float:right;
    clear:right;
}
div#footer {
    width:977px;    
}

/*HEADER*/
div#header {
    position:relative;
    width:982px;
    height:170px;
}
div#header-lines {
    position:absolute;top:26px;left:0px;
    display:block;
    width:982px;
    height:144px;
    background:transparent url('../images/header-lines.png') no-repeat top left;
}
span a#offkey {
	position:absolute;top:25px;left:25px;
    display:block;
    width:254px;
    height:144px;
    text-indent:-9999px;
    background:transparent url('../images/logo-voodoo.png') no-repeat top left;
}
div#advertisement {
    position:absolute;top:70px;right:140px;
}
div#sampler {
    width:100px;
    height:100px;
    background:black url('') no-repeat top left;
}
/*TOP NAV*/
div#nav {
    background:transparent url('../images/nav-bk.gif') no-repeat top right;
    width:937px;
    height:56px;
}
div#nav ul {
    height:39px;
    background:none;
    padding:14px 28px 14px 17px;
}
div#nav ul li {
    display:block;
    float:left;
    width:114px;
    height:39px;
    padding:0px 11px;
}
div#nav ul li a {
    display:block;
    background:transparent url('') top left no-repeat;
    width:114px;height:28px;
    line-height:32px;
    font-size:1.3em;
    font-weight:normal;
    text-align:center;
}
div#nav ul li a.selected, div#nav ul li a:hover, div#nav ul li a:active {
    background:#6f1200 url('../images/nav-hoverv.gif') top left repeat-x;
    border-top:1px solid black;
    border-bottom:1px solid black;
}

/*SIDEBAR*/
div#left-nav {
	padding:4px 0px 0px 0px;
    width:233px;
}
div#left-nav div#ln-top {
    width:233px; height:20px;
    background:transparent url('../images/') no-repeat top left;
}
div#left-nav div#ln-mid {
    width:233px;
    background:transparent url('../images/') repeat-y top left;
    padding:0px 0px 0px 0px;
}
div#left-nav div#ln-mid ul {
    width:233px;
    padding:0px 12px 0px 13px;
    background:transparent url('../images/') no-repeat top left;
}
div#left-nav div#ln-mid ul li {
    width:203px; height:31px;
    padding:0px 0px 0px 0px;
    margin:0px 0px 0px 0px;
    background:transparent url('') no-repeat top left;
}
div#left-nav div#ln-mid ul li.first { margin-top:0px; }
div#left-nav div#ln-mid ul li.last { margin-bottom:0px; }
div#left-nav div#ln-mid ul li a {
    display:block;
    width:203px; height:31px;
    line-height:31px;
    padding:0px 0px 0px 0px;
    font-size:1.3em;
    font-weight:bold;
}
div#left-nav div#ln-mid ul li a.selected, div#left-nav div#ln-mid ul li a:hover, div#left-nav div#ln-mid ul li a:active {
    background:transparent url('../images/snav-hoverv.gif') repeat-x top left;
}
div#left-nav div#ln-bot {
    width:233px; height:16px;
    background:transparent url('../images/') no-repeat top left;
}

/*MAIN CONTENT*/
div#content {
    
}

/*FOOTER*/
div#footer {
	text-align:center;
}
div#footer-lines {
    width:982px;
    height:6px;
    background:transparent url('../images/footer-lines.png') no-repeat top left;
}
div#footer p {
    margin-top:6px;
    color:black;
}
div#footer p a, div#footer p a:visited {
    border-left:0px solid black;
    margin-left:0px;
    padding-left:0px;
    color:black;
}
div#footer p a:hover, div#footer p a:active {
    color:#FFFFFF;
}



/*PAGE CONTENT~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*one third*/
div.third-wrapper {
    width:255px;
    float:left;
    clear:none;
}
div.third-wrapper div.top {
    width:255px; height:39px;
    background:transparent url('../images/third-top.png') no-repeat top left;
}
div.third-wrapper div.top h2 {
    height:39px;
    line-height:52px;
    padding-left:26px;
    font-size:1.2em;
}
div.third-wrapper div.middle {
    width:255px;
    background:transparent url('../images/third-mid.png') repeat-y top left;
}
div.third-wrapper div.middle div.gradient {
    width:202px;
    padding:14px 26px 0px 26px;
    background:transparent url('../images/third-grad.png') no-repeat top left;
}
div.third-wrapper div.middle div.gradient img {
    width:203px; height:104px;
    margin-bottom:8px;
    border:0px solid black;
}
div.third-wrapper div.middle div.gradient h3 {
    font-size:1.1em;
    line-height:1.3em;
}
div.third-wrapper div.middle div.gradient p {
    font-size:1.1em;
    padding:8px 0px;
}
div.third-wrapper div.middle div.gradient a {
    font-size:1.1em;
    float:right;
}
div.third-wrapper div.bottom {
    width:255px; height:26px;
    background:transparent url('../images/third-bot.png') no-repeat top left;
}
/*hover*/
div.third-wrapperh {
    width:255px;
    float:left;
    clear:none;
    color:#F67A20;
    cursor:pointer;
}
div.third-wrapperh div.top {
    width:255px; height:39px;
    background:transparent url('../images/third-toph.png') no-repeat top left;
}
div.third-wrapperh div.top h2 {
    height:39px;
    line-height:52px;
    padding-left:26px;
    font-size:1.2em;
}
div.third-wrapperh div.middle {
    width:255px;
    background:transparent url('../images/third-midh.png') repeat-y top left;
}
div.third-wrapperh div.middle div.gradient {
    width:202px;
    padding:14px 26px 0px 26px;
    background:transparent url('../images/third-gradh.png') no-repeat top left;
}
div.third-wrapperh div.middle div.gradient img {
    width:203px; height:104px;
    margin-bottom:8px;
    border:0px solid black;
}
div.third-wrapperh div.middle div.gradient h3 {
    font-size:1.1em;
    line-height:1.3em;
}
div.third-wrapperh div.middle div.gradient p {
    font-size:1.1em;
    padding:8px 0px;
}
div.third-wrapperh div.middle div.gradient a {
    font-size:1.1em;
    float:right;
}
div.third-wrapperh div.bottom {
    width:255px; height:26px;
    background:transparent url('../images/third-both.png') no-repeat top left;
}


/*half modules*/
div.half-wrapper {
    width:360px;
    float:left;
    clear:none;
    color:#FFFFFF;
    cursor:pointer;
}
div.half-wrapper div.top {
    width:360px; height:16px;
    padding:0px 0px 0px 0px;
    background:transparent url('../images/half-top.png') no-repeat top left;
}
div.half-wrapper div.top h2 {
    height:16px;
    line-height:18px;
    padding-left:0px;
    font-size:1.2em;
}
div.half-wrapper div.middle {
    width:360px;
    background:transparent url('../images/half-mid.png') repeat-y top left;
}
div.half-wrapper div.middle div.gradient {
    width:350px;
    padding:0px 10px 0px 10px;
    background:transparent url('../images/half-grad.png') no-repeat top left;
}
div.half-wrapper div.middle div.gradient ul {
    width:360px;
    padding:14px 0px 0px 0px;
}
div.half-wrapper div.middle div.gradient ul li {
    width:334px;
    padding:0px 0px 0px 0px;
    margin:14px 0px 0px 0px;
}
div.half-wrapper div.middle div.gradient ul li.first {
    margin-top:0px;
}
div.half-wrapper div.middle div.gradient ul li.hover, div.half-wrapper div.middle div.gradient ul li.hover a {
    color:#F67A20;
}
div.half-wrapper div.middle div.gradient ul li img {
    width:115px; height:74px;
    float:left;
    border:0px solid black;
    margin-right:10px;
}
div.half-wrapper div.middle div.gradient ul li h3 {
    font-size:1.1em;
    line-height:1.3em;
}
div.half-wrapper div.middle div.gradient ul li p {
    display:block;
    float:left;
    width:204px;
    clear:right;
    font-size:1.1em;
    padding:6px 0px;
}
div.half-wrapper div.middle div.gradient a {
    font-size:1.1em;
    float:right;
}
div.half-wrapper div.bottom {
    width:360px; height:24px;
    background:transparent url('../images/half-bot.png') no-repeat top left;
}



/*full modules and page styles~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.full-wrapper {
    width:740px;
    color:#FFFFFF;
}
div.full-wrapper div.top {
    width:740px; height:18px;
    padding:0px 0px 0px 0px;
    background:transparent url('../images/full-top.png') no-repeat top left;
}
div.full-wrapper div.top h2 {
    height:18px;
    line-height:20px;
    padding-left:0px;
    font-size:2em;
	font-weight:bold;
}
div.full-wrapper div.middle {
    width:769px;
    background:transparent url('../images/full-mid.png') repeat-y top left;
}
div.full-wrapper div.middle div.gradient {
    width:731px;
    margin:0px 12px 0px 12px;
    padding:0px 7px 0px 7px;
    background:transparent url('../images/full-grad.png') repeat-x top left;
}
div.full-wrapper div.bottom {
    width:769px; height:31px;
    background:transparent url('../images/full-bot.png') no-repeat top left;
}

/*NEW STYLE FOR WELCOME SCREEN ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.full-welcome {
    width:740px;
	padding:4px 0px 4px 10px;
}
/*full width formatting*/
div.full-content {
    font-size:1.1em;
    line-height:1.4em;
    position:relative;
    padding:14px 0px 0px 0px;
    }
div.full-content-page {
    font-size:1.1em;
    line-height:1.4em;
    position:relative;
    padding:14px 14px 0px 14px;
    }


/*show list style content*/
/*full width list style*/
div.list {}


div.listitem {width:686px;position:relative;padding:14px 14px 13px 14px;margin:0px 0px 14px 7px;border:0px solid #F67A20;}
div.listitem img {float:left;clear:none;margin-right:14px;}
div.listitem a.more {float:right;}
div.listitem li.p {padding:4px;}
div.listitemh {width:686px;position:relative;padding:14px 14px 13px 14px;margin:0px 0px 14px 7px;border:0px solid #F67A20;cursor:pointer;}
div.listitemh img {float:left;clear:none;margin-right:14px;}
div.listitemh a.more {float:right;}
div.listitemh li.p {padding:4px;}

/*half width list style*/
div.listblock {width:196px;position:relative;padding:14px 14px 14px 14px;margin:7px 0px 7px 14px;float:left;clear:none;border:0px solid #F67A20;}
div.listblock ul {line-height:1.6em;}
div.listblock ul li.p {line-height:1.3em;}
div.listblock a.more {float:right;}
div.listblock h3, div.listblock h4 {line-height:1.6em;font-weight:bold;}
div.listblockh {width:196px;position:relative;padding:14px 14px 14px 14px;margin:7px 0px 7px 14px;float:left;clear:none;border:0px solid #F67A20;cursor:pointer;}
div.listblockh ul {line-height:1.6em;}
div.listblockh ul li.p {line-height:1.3em;}
div.listblockh a.more {float:right;}
div.listblockh h3, div.listblockh h4 {line-height:1.6em;font-weight:bold;}

div.listblock-feature {width:676px;padding:14px 14px 14px 14px; margin:0px 0px 7px 14px; overflow: hidden;border:0px solid #F67A20;}
div.listblock-feature img {float:left;margin:0px 0px 0px 0px;}
div.listblock-feature h3, div.listblock-feature h4 {line-height:1.6em;font-weight:bold;}
div.listblock-feature p {margin:0px 0px 0px 0px;padding:0px 0px 10px 0px;}
div.listblock-feature a {line-height:1.6em;float:right;font-weight:bold;}
div.listblock-feature div.lb-feat-right {width:397px;float:right;}
div.listblock-featureh {width:676px;padding:14px 14px 14px 14px; margin:0px 0px 7px 14px; overflow: hidden;border:0px solid #F67A20;cursor:pointer;}
div.listblock-featureh img {float:left;margin:0px 0px 0px 0px;}
div.listblock-featureh h3, div.listblock-featureh h4 {line-height:1.6em;font-weight:bold;}
div.listblock-featureh p {margin:0px 0px 0px 0px;padding:0px 0px 10px 0px;}
div.listblock-featureh a {line-height:1.6em;float:right;font-weight:bold;}
div.listblock-featureh div.lb-feat-right {width:397px;float:right;}

/*show one style content*/
div.feature {padding:7px 14px 14px 14px; margin:0px 0px 0px 0px; overflow: hidden;}
div.feature img {float:left;margin:0px 0px 0px 0px;}
div.feature h3, div.feature h4 {line-height:1.6em;font-weight:bold;}
div.feature h3 span, div.feature h4 span {line-height:1.6em;font-weight:normal;}
div.feature p {margin:0px 0px 0px 0px;padding:0px 0px 10px 0px;}
div.feature a {line-height:1.6em;float:right;font-weight:bold;}

div.article {padding:14px 14px 14px 0px; margin:0px 0px 0px 0px; overflow: hidden;}
div.article {font-size:1.2em;}
div.article img {margin:0px 14px 0px 0px;float:left;}
div.article h3 {font-size:1.4em;padding:0px 0px 2px 0px;margin:0px;}
div.article h4 {border-top:1px solid #F67A20;padding:8px 0px 6px 0px;font-size:1.6em;}
div.article p {padding:0px 0px 14px 0px;}
div.article br {padding:0px 0px 7px 0px;}
div.article a {padding:0px;margin:0px;line-height:1.4em;float:none;color:#F67A20;}
div.article a:hover {padding:0px;margin:0px;line-height:1.4em;float:none;color:#FFFFFF;text-decoration:underline;}


/*pagination*/
ul.pagination {margin:0px 8px 10px 0px;padding:0px;float:right;}
ul.pagination li {list-style-type:none;font-size:1.1em;font-weight:bold;display:inline;}
ul.pagination li a {display:block;float:left;padding:2px 8px;margin-right:3px;color:#d9dbe4;border:0px solid #F67A20;}
ul.pagination li a:hover, ul.pagination li.selected a {display:block;float:left;padding:2px 8px;margin-right:3px;color:white;border:0px solid #F67A20;background-color:#9496a0;}
/*ul.pagination li a.page {background-color:#9FA19F;color:#ddd;}
ul.pagination li a.page:hover {text-decoration:none;color:#fff;}
ul.pagination li.selected a.page {background-color:#545C5F;color:#fff;}*/
ul.pagination li.disabled a {display:none;}

/*specifics~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*ARTISTS*/
 
div.artist-images {padding:10px 0px 10px 10px;border:0px solid #F67A20;margin:0px 0px 0px 0px;
    /*background-color:#000018;
    border:0px solid #F67A20;*/}
div.artist-images img {margin-right:10px;}

div.artist-links {width:230px;float:left;padding:14px 0px 0px 0px;}
div.artist-links ul {width:230px;}
div.artist-links ul li {display:block;margin:0px;padding:0px;}
div.artist-links ul li a {display:block;border:0px solid #F67A20;width:217px;margin:0px 0px 10px 0px;padding:6px 5px 6px 6px;line-height:14px;text-align:right;}
div.artist-links ul li a:hover {url() no-repeat left top;}

div.artist-bio {width:436px;float:right;padding:10px 10px 10px 14px;margin:14px 0px 0px 10px;border:0px solid #F67A20;}

/*LABELS*/
div.label-desc{width:425px;float:right;}
body#offkey a.button {float:right;margin:0px 11px 0px 0px;}

/*PODCASTS*/
div.tracklist {width:230px;border:0px solid #F67A20;float:left;padding:14px;margin:7px 0px 0px 0px;}
div.tracklist ul {line-height:1.3em;}
div.tracklist ul li {padding:3px 0px;}
div.podcast-links {width:260px;float:left;padding:14px 0px 0px 0px;}
div.podcast-links ul {width:260px;}
div.podcast-links ul li {display:block;width:260px;height:38px;margin:0px;padding:0px 0px 6px 0px;}
div.podcast-links ul li a {display:block;border:0px solid #F67A20;width:253px;height:34px;padding:0px 5px 0px 0px;line-height:36px;text-align:right;}
div.podcast-links ul li a:hover { url() no-repeat left top;}
div.podcast-links ul li a {width:253px;}

/*RELEASES*/
div.tracks strong {float:left;}
div.tracks ol {float:left;display:block;height:150px;margin:0px 0px 0px 10px;}
div.tracks ol li {display:block;}

/*INTERVIEWS*/
body#interviews div.full-content dl {}
body#interviews div.full-content dl dt {font-weight:bold;padding:6px 0px 3px 0px;border-top:1px solid #F67A20;}
body#interviews div.full-content dl dd {padding:3px 0px 10px 0px;}

/*COMPANY*/
body#company div.article {width:400px;clear:none;float:left;}
body#company form {float:right;width:270px;clear:none;}
body#company form {}
body#company form {}


/* =Clearing
-------------------------------------------------------------*/


/* Class for self clearing - use this where ever possible */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/* Class for clearing floats */
.clear {
	clear: both;
}

a span {
    display:none;
}
a.button {display:block;width:130px;height:28px;padding:0px 10px 0px 0px;border:0px solid #F67A20;line-height:26px;text-align:right;}
a.button:hover {url() no-repeat left top;}
h3.in-page {padding:10px 0px 10px 25px;}

/* Class for MP3 player container */
table.pla {float:left;}
table.pla td {vertical-align:middle;}
