/******************************************************************************************************
Title:			base.css
Author: 		Staffan Estberg
Created: 		03.25.2008
Last modified: 	06.14.2008
******************************************************************************************************/


/* _BASE
-----------------------------------------------------------------------------------------------------*/

*
{ vertical-align: baseline ; border: 0 ; outline: 0 ; padding: 0 ; margin: 0 ; }

body
{ text-align: left ; margin-top: 25px ; background: #000 url(../img/bg.jpg) no-repeat; background-position: center top ; font: 11px Arial, Helvetica, sans-serif ; color: #ccc ; }

a, a:visited
{ color: #3399cc; text-decoration: none ; }

a:hover
{ color: #fff ; }

hr
{ clear: both ; width: 698px ; color: #413f3f ; background-color: #413f3f ; height: 1px; border: 0 ; margin-bottom: 5px ; }

h1
{ font-size: 16px ; color: #fff ; font-weight: normal ; margin-bottom: 15px ; }

h2
{ font-size: 13px ; color: #fff ; font-weight: normal ; }

h3
{ font-size: 13px ; color: #999 ; font-weight: normal ; }

h4
{ font-size: 11px ; font-weight: bold ; color: #fff ; }

#content
{ width: 935px ; margin: 0 auto ; }

#menu
{ float: left ; width: 193px ; height: 250px ; }

#box
{ float: right ; width: 728px ; height: 250px ; background-color: #000 ; }

#logo
{ float: left ; width: 193px ; height: 90px ; margin-bottom: 20px ; }

#ads
{ float: right; width: 728px ; height: 90px ; margin-bottom: 20px ; text-align: right;  }

#ads span
{ margin-left: 4px; }

#base
{ float: right ; width: 728px ; background-color: #2b2929 ; }

.left
{ float: left ; }

.right
{ float: right ; }

#leftCol
{ float: left ; width: 309px ; margin: 15px 0 15px 15px ; padding: 0 15px 15px 15px ; background-color: #252323 ; border: 1px solid #413f3f ; }

#rightCol
{ float: right ; width: 311px ; margin: 15px 15px 15px 0 ; padding: 0 15px 15px 15px ; background-color: #252323 ; border: 1px solid #413f3f ; }

#single, #about, #bookings, #offer, #history, #artists, #folder, #newsletter, #partners, #thankyou, #error
{ margin: 15px 0 15px 15px ; padding: 15px ; float: left ; width: 666px ; background-color: #252323 ; border: 1px solid #413f3f ; }

#thankyou p
{ text-align: center ; margin-top: 71px ; margin-bottom: 72px ; }

#error h1
{ margin-left: 50px ; margin-top: 50px; }

#error p
{ margin-left: 50px ; margin-bottom: 60px ; }

p.sublink
{ margin: 10px 0 0 15px ; font-size: 11px ; }


/* HOME + ABOUT
-----------------------------------------------------------------------------------------------------*/

ul#array
{ list-style-type: none; }

#video
{ text-align: center ; margin-bottom: 10px ; }

#poster
{ float: left ; margin: 15px 0 15px 15px ; width: 341px ; height: 476px ; }

#news
{ float: right ; margin: 15px 15px 15px 0 ; }

#schedule h2, div.post h2
{ margin: 0 ; }

#posts
{ background-color: #252323 ; padding: 15px ; width: 309px ; height: 418px ; overflow: auto ; overflow-x: hidden ; border-left: 1px solid #413f3f ; border-bottom: 1px solid #413f3f ; border-top: 0 ;  border-right: 1px solid #413f3f ;  }

div.post
{ line-height: 15px ; padding-bottom: 15px ; }

div.post span
{ color: #999 ; font-size: 10px ; }

#schedule
{ float: left ; margin-top: 15px ; width: 193px ; height: 476px ; background: url(../img/transparent.png) ; }

#schedule div.show
{ clear: both ; float: left ; margin-top: 12px ; }

#schedule div.date
{ margin: 2px 0 0 10px ; float: left ; width: 45px ; }

#schedule div.artist
{ float: right; width: 125px; }

#schedule div.link
{ clear: both ; float: left ; margin-top: 12px ; margin-left: 10px ; }

#about p
{ line-height: 15px ; }


/* TOURS AND BOOKINGS
-----------------------------------------------------------------------------------------------------*/

#tours
{ margin: 15px 0 15px 15px ; }

#tours h1, #tours h2, #bookings h1
{ margin: 0 ; }

#tours img
{ margin-right: 10px ; }

#tours div.artist
{ margin: 15px 15px 0 0 ; float: left ; width: 221px ; border-right: 1px solid #333 ; }

#bookings
{ height: 476px ; overflow: auto ; overflow-x: hidden ; font-size: 12px ; margin: 15px 15px 0 15px ; padding: 15px 15px 0 15px ; }

#bookings h3
{ clear: both ; float: left ; color: #3399cc; margin: 0 0 0 15px ; font-size: 16px; font-weight: normal ; }

#bookings div.month
{ margin: 0 15px 0 15px ; }

#bookings div.artist
{ float: left ; width: 100% ; height: auto ;  }

#bookings hr
{ float: left ; width: 621px ; margin: 15px ; }

#bookings p
{ float: left ; line-height: 16px ; }

#bookings div.image
{ width: 150px ; height: 100px ; float: left ; }

#bookings div.texts
{ float: left ; }

#bookings p.date
{ clear: both ; float: left ;  width: 75px ; }

#bookings p.location
{ float: left ; width: 175px ; }

#bookings p.venue
{ float: left ; width: 200px ; }
#history
{ font-size: 12px ; height: 476px ; overflow: auto ; overflow-x: hidden ;  }

#history hr
{ float: left ; margin: 15px ; width: 621px ;  }

#history h1
{ margin: 0 ; }

#history h3
{ float: left ; color: #3399cc; margin: 0 15px 5px 15px ; font-size: 16px; font-weight: normal ; }

#history div.row
{ margin: 0 15px 0 15px ; clear: both ; float: left ; width: 621px ; height: 15px ; }

#history div.odd
{ margin: 0 15px 0 15px ; clear: both ; float: left ; width: 621px ; height: 15px ; background-color: #2b2929 ; } 

#history p.name
{ float: left ; width: 150px ; }

#history p.type
{ float: left ; width: 75px ; }

#history p.venue
{ float: left ; width: 125px ; }

#history p.city
{ float: left ; width: 100px ; }

#history p.country
{ float: left ; }


/* GALLERY
-----------------------------------------------------------------------------------------------------*/

#gallery
{ margin: 15px ; }

#folder div.image
{ height: 65px; overflow: hidden; float: left; margin: 0 15px 15px 0 ; }

#gallery h1
{ margin: 0 ; }

#folder
{ height: 476px ; overflow: auto ; }

#list
{ height: 200px ; overflow: auto ; }

#list div.album
{ margin: 15px 15px 0 0 ; float: left ; width: 210px ; height: 80px ; overflow: hidden ; border-right: 1px solid #333 ; }

#list h2
{ margin: 0 ; width: 95px ; float: left; }

#list p
{ float: left ; margin: 0 ; width: 95px ; }

#list img
{ margin-right: 10px ; float: left ; }

#folder h1
{ margin-bottom: 15px ; }


/* MAKE OFFER + NEWSLETTER
-----------------------------------------------------------------------------------------------------*/

#offer hr
{ width: 666px ; margin-top: 15px ; }

#offer form, #newsletter form
{ border-collapse: collapse ; line-height: 20px ; margin-top: 15px ; }

#offer input, #newsletter input
{ font-family: Arial, Helvetica, sans-serif ; font-size: 11px ; color: #fff ; background-color: #2b2929 ; border: 1px solid #413f3f ; height: 16px ; }

#offer input:hover, #newsletter input:hover
{ background-color: #2b2929 ; border: 1px solid #666 ; cursor: pointer ; }

#offer input.submit, #newsletter input.submit
{ border: 0 ; width: 63px ; height: 21px ; margin-top: 15px ; }

#offer td, #newsletter td
{ width: 165px ; }

#newsletter span
{ color: #666 ; font-style: italic ; }


/* MERCHANDISE
-----------------------------------------------------------------------------------------------------*/

#merchandise
{ height: 476px ; overflow: auto ; margin: 15px 0 15px 15px ; padding: 15px 0 15px 15px ; float: left ; width: 666px ; background-color: #252323 ; border: 1px solid #413f3f ; }

#merchandise h2.red
{ color: #ff3300; }

#merchandise div.product
{ float: left; margin-right: 15px; width: 146px; overflow: hidden; }

#merchandise div.image
{ height: 100px; overflow: hidden; position: relative; margin-top: 1px; }

#merchandise div.sale
{ position: absolute; top: 0; left: 0; z-index: 2; }

#merchandise div.details
{ clear: both; padding: 5px 10px 5px 10px; background: #000; width: 126px; height: 25px; }

#merchandise div.details h2
{ float: left; margin-top: 5px; }

#merchandise div.details p
{ border-left: 1px dotted #666; float: left; padding: 5px 0 5px 10px; float: right; }

#merchandise table
{ table-collapse: collapse; clear: both; width: 636px; border-spacing: 0; }

#merchandise table h2
{ margin: 0; }

#merchandise td
{ padding: 5px; width: 150px; }

#merchandise tr.odd
{ background-color: #2b2929; }

#merchandise tr.black
{ background-color: #000; }

#merchandise .quantity
{ width: 25px; text-align: center; }

#merchandise input, #merchandise select
{ font-family: Arial, Helvetica, sans-serif ; font-size: 11px ; color: #fff ; background-color: #2b2929 ; border: 1px solid #413f3f ; height: 16px ; }

#merchandise input:hover
{ background-color: #2b2929 ; border: 1px solid #666 ; cursor: pointer ; }

#merchandise input.button, #merchandise input.button:hover
{ border: 0; height: auto; }

#merchandise h3
{ color: #3399cc; }

#merchandise hr
{ width: auto; margin-right: 15px; }

#merchandise p.shipment
{ padding: 0 15px 15px 0; }

#merchandise tr.separator td
{ border-top: 1px solid #413f3f; }

#merchandise p.thankyou
{ width: 650px; margin-top: 200px; text-align: center; vertical-align: middle; }


/* PARTNERS + ARTISTS
-----------------------------------------------------------------------------------------------------*/

#partners hr, #artists hr
{ float: left ; width: 666px ; margin: 15px 0 15px 0 ; }

#partners p, #artists p
{ line-height: 15px ; }

#partners h2, #artists h2
{ margin: 0 ; }

#partners div.logo, #artists div.photo
{ float: left ; text-align: center ; width: 200px ; }

#partners div.about, #artists div.info
{ float: left ; width: 450px ; }

#artists span
{ font-size: 12px ; color: #999 ; }


/* CONTACT
-----------------------------------------------------------------------------------------------------*/

#contact h1, h2, h3
{ margin-top: 15px ; }

#contact hr
{ width: 309px ; margin-top: 15px ; }


/* FOOTER
-----------------------------------------------------------------------------------------------------*/

#footer
{ clear: both ; margin: 0 15px 0 15px ; color: #413f3f ; }

#footer hr
{ width: 698px ; }

#jukebox
{ float: left ; }

a.mtv:hover, a.op:hover
{ background-position: 0 -22px ; }

#footer div.copy
{ float: left ; margin-bottom: 10px ; }

#footer div.partners
{ float: right ; }

p.text
{ float: left ; }

p.icons
{ float: left ; }

a.mtv
{ margin: 0 5px 5px 5px ; float: left ; display: block ; overflow: hidden ; width: 28px ; height: 22px ; background: url(../img/icon-mtv.gif) no-repeat ; }

a.op
{  float: left ; display: block ; overflow: hidden ; width: 50px ; height: 22px ; background: url(../img/icon-op.gif) no-repeat ; }
