/*******************************************************************

	Trance Awards Stylesheet
	(c) Trance Awards 2008
	Author: Kris Noble

*******************************************************************/

/*******************************************************************
	
	General Styles 

*******************************************************************/

* {
padding:0; 
margin:0; 
}

html {
min-height:100%;
background:#222 url(bottom_strip.jpg) bottom center no-repeat; 
width:100%;
}

body {
position:relative;
height:auto;
min-height:100%; 
background: url(top_strip.gif) top center no-repeat; 
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
width:100%;
color:#ddd
}

#wrapper {
height:auto;
min-height:100%; 
width:790px; 
margin:0 auto; 
}

p {margin-bottom:1em;}

a, a:visited, a:active{color:#999;}
a:hover{color:#fff;}

/*******************************************************************
	
	Header Styles 

*******************************************************************/

#header {
position:relative; 
height:130px; 
margin-bottom:20px;
}

h1 {
height:86px; 
width:263px; 
position:absolute; 

}

h1 a {
background:url(ta_logo_h1.png) top left no-repeat; 
height:86px; 
width:263px; 
display:block; 
text-indent:-9999px;
-moz-outline:none; 
}

h2 {
font-size:2em;
border-bottom: 1px solid #666;
margin-bottom:20px;
line-height:1;
}

h3 {
font-size:1.5em;
line-height:1;
}

h3 a{color:#ddd !important; text-decoration:none;}

ul#nav {
position:absolute; 
right:0; 
bottom:0; 
}

ul#nav li {
float:left; 
height:44px; 
width:90px; 
list-style:none; 
margin-left:1px; 
}

ul#nav li a {
height:44px; 
width:90px; 
text-indent:-9999px; 
background-position:top left; 
background-repeat:no-repeat; 
display:block; 
-moz-outline:none; 
}

ul#nav li a:hover  {
background-position:top center;
}

html body ul#nav li a.current  {
background-position:top right !important; 
}

ul#nav li a#vote {
background-image:url(vote_li.png); 
}

ul#nav li a#djcomp {
background-image:url(djcomp_li.png); 
}

ul#nav li a#myyear {
background-image:url(myyear_li.png); 
}

ul#nav li a#event {
background-image:url(event_li.png); 
}

ul#nav li a#partners {
background-image:url(partners_li.png); 
}

ul#nav li a#about {
background-image:url(about_li.png); 
}

ul#nav li a#press {
background-image:url(press_li.png); 
}

ul#nav li a#store {
background-image:url(store_li.png); 
}

div#banner {
background-color:#222; 
position:absolute; 
right:0; 
top:12px; 
height:60px; 
width:468px; 
}

/*******************************************************************
	
	Front Page Styles 

*******************************************************************/

.front_page_row{
float:left;
clear:both;
border-bottom:1px solid #282828;
margin-bottom:20px;
padding-bottom:20px;
width:100%;
}

html body .only {
border-bottom:none !important;
}

.front_page_col, .trance_story_col{
width:243px; 
float:left; 
padding-right:20px; 
cursor:pointer;
}

.mid{width:244px;} /* extra pixel for middle column */

.front_page_col h3 {
border-bottom:1px solid #666;
}

div#lead_article {
border-bottom:none;
padding-bottom:0;
background:#333 url(lead_image.jpg) top left no-repeat;
min-height:263px;
}

div#lead_article:hover{
cursor:pointer;
}

div#lead_article .front_page_col {
width:223px;
padding:20px;
min-height:223px;
background:transparent url(top_row_col_bg.png) top left repeat;
color:#fff;
}

/*******************************************************************
	
	Two Column Content Styles 

*******************************************************************/

div#main_content{
margin-left:263px;
width:507px;
}

div#main_content.vote_main_content{
margin-left:263px;
width:527px;
}

div#secondary_content{
float:left;
width:243px;
padding-right:20px;
margin-bottom:20px;
}

div#main_content.alt_main{
float:left;
margin-left:0;
}

div#secondary_content.alt_secondary{
float:right;
width:263px;
padding:0 0 0 20px;
}

#secondary_content ul li {
list-style:none;
background:#666 url(secondary_li_top.jpg) top left no-repeat;
padding-top:7px;
margin-bottom:1px;
}


#secondary_content ul li a {
background:transparent url(secondary_li_bottom.jpg) bottom left no-repeat;
padding:0 0 7px 10px;
display:block;
line-height:1;
color:#eee;
}

#secondary_content ul li.current{
background:#1072BA url(current_secondary_li_top.jpg) top left no-repeat;
color:#fff
}

#secondary_content ul li.current a {
background:transparent url(current_secondary_li_bottom.jpg) bottom left no-repeat;
}

p.last_year {
padding-bottom:268px;
background:transparent bottom left no-repeat;
margin-top:20px;
}

p#last_year_best_dj {
background-image:url(last_year_best_dj.jpg);
}

p#last_year_best_track {
background-image:url(last_year_best_track.jpg);
}

p#last_year_best_producer {
background-image:url(last_year_best_producer.jpg);
}

p#last_year_best_label {
background-image:url(last_year_best_label.jpg);
}

p#last_year_best_live_act {
background-image:url(last_year_best_live_act.jpg);
}

p#last_year_best_track {
background-image:url(last_year_best_track.jpg);
}

p#last_year_best_remixer {
background-image:url(last_year_best_remixer.jpg);
}

p#last_year_best_resident {
background-image:url(last_year_best_resident.jpg);
}

p#last_year_best_new_face {
background-image:url(last_year_best_new_face.jpg);
}

p#last_year_best_club {
background-image:url(last_year_best_club.jpg);
}

p#last_year_best_event {
background-image:url(last_year_best_event.jpg);
}

p#last_year_best_album {
background-image:url(last_year_best_album.jpg);
}

p#last_year_best_radio_show {
background-image:url(last_year_best_radio_show.jpg);
}

p#last_year_best_website {
background-image:url(last_year_best_website.jpg);
}

form.vote_form {
margin-top:10px;
}

form.vote_form input {
padding:3px;
border:1px solid #333;
font-size:1em;
width:255px;
display:block;
margin-bottom:20px;
}

form.vote_form select {
border:1px solid #333;
font-size:1em;
display:block;
margin-bottom:20px;
width:263px;
padding:3px;
}

form.vote_form textarea {
padding:3px;
border:1px solid #333;
font-size:1em;
width:255px;
display:block;
margin-bottom:20px;
font-family:"Trebuchet MS", Verdana, Arial, Helvetica, Sans-Serif;
}

form.vote_form input.oneline{
display:inline;
margin-bottom:0;
}

form.vote_form input.error{
border-color:#c00;
border-width:1px;
}

form.vote_form label{
display:block;
}

span.error{background-color:#c00; color:#FFFFFF; border-color:#900; padding:0 5px; font-size:0.8em;}
body label span.error{margin-top:0;}

form.vote_form #tidsub, form.vote_form #tasub {
width:auto;
float:left;
margin-top:0.3em;
margin-bottom:0;
}

form.vote_form input#submit {
background-color:#CCCCCC;
margin-left:-1px;
padding:2px 3px;
width:auto;
}

div.trance_story img {float:right; margin: 0 0 20px 20px;}

ul.lineup li {list-style:none; line-height:1;}

ul.lineup li strong {font-size:1.2em;}

h4 {border-bottom:1px solid #282828;}

div.event_details p {margin-bottom:0;}
div.event_details {margin-bottom:20px;}


/*******************************************************************
	
	One Column Content Styles 

*******************************************************************/

div.one_col_row {
min-height:150px;
margin-bottom:10px;
padding-bottom:10px;
border-bottom:1px solid #282828;
background:transparent top right no-repeat;
padding-right:263px;
}

div.alt{
background-position:top left;
padding-right:0;
padding-left:263px;
}


p#success {padding:5px; background-color:#333; text-align:center; border:1px solid #666;}


/*******************************************************************
	
	Footer Styles 
	(hidden by css, because we're using the footer image)

*******************************************************************/

#footer {
margin-top:50px;
height:88px;
clear:both; 
}

#footer p {
color:#666; 
font-size:0.7em; 
padding-top:30px; 
font-weight:bold;
display:none;
}

html body img.mytrancestory_img{
/*float:right;*/
margin: 0 0 20px 20px;
}

.trance_story_row{
float:left;
clear:both;
border-bottom:1px solid #282828;
margin-bottom:20px;
padding-bottom:20px;
width:100%;
}

.trance_story_col{
width:243px; 
float:left; 
padding-right:20px; 
cursor:pointer;
}

.mid{width:244px;} /* extra pixel for middle column */

.trance_story_col h3 {
border-bottom:1px solid #666;
margin-bottom:10px;
}

.trance_story_col a {
clear:both;
}

p.question {
margin-bottom:0;
font-weight:bold;
color:#fff;
}

.trance_story_thumb{
float:right; 
margin:0 0 5px 5px;
}

div#more_content {background-color:#333; border:1px solid #e12c7a; padding:10px; clear:both}

#socialbookmarking{
	clear:left;
	position:relative;
	border:1px solid #444;
	padding:5px;
	margin:15px 0 5px 0;
	background-color:#282828;
}

#socialbookmarking h2 {
	font-size:1em;
	font-weight:bold;
	padding:0;
	margin:0;
	text-align:right !important;
	border-bottom:none;
	float:right;
	width:100%;
}

#socialbookmarking ul{
	text-align:center;
	list-style:none;
	margin:6px 0 4px 0;
	padding:0;
}

#socialbookmarking ul li{
	text-align:center;
	display:inline;
	padding:0 4px 6px 0 ;
}

#socialbookmarking ul li#delicious{
	background:url("http://www.tranceawards.com/css/delicious.gif") no-repeat;
}

#socialbookmarking ul li#digg{
	background:url("http://www.tranceawards.com/css/digg.gif") no-repeat;
}

#socialbookmarking ul li#magnolia{
	display:none;
}

#socialbookmarking ul li#facebook{
	background:url("http://www.tranceawards.com/css/facebook.gif") no-repeat;
}

#socialbookmarking ul li#stumbleupon{
	background:url("http://www.tranceawards.com/css/stumbleupon.gif") no-repeat;
}

#socialbookmarking ul li a{
	padding:0 0 0 18px;
	margin:0 5px 0 0px;
}

p.back {margin-top:10px;}

div#top_trumps {width:241px; border:1px solid #666; background-color:#fff; color:#222; margin: 0 0 20px 20px; padding:10px; font-size:0.9em;}

div#top_trumps h2{font-size:1em;}
