/*
File: lukestone.css
Created On: 06/17/09
Created By: Evan Culver for LukeStoneMusic.com
Details: Main layout styles for Luke Stone Music

Palette Colors: 
	Yellow: #ffc200
	Light Gray: #eaeaeb
	Gray: #808184
	Cream: #f5f9f3
	Black: #312d2e
--
    Blue: #00a0c6
    Orange: #ff8f05
    Red Orange: #ff3d1a
    Red Violet: #b80028
    Violet: #861259
    Blue Violet: #7f27a0
    Red: #c21b45
*/

* { padding:0; margin:0; }

body {
	background: url(../images/body_bg.jpg) repeat; 
    /*background-color: #808184; */
	color: #312d2e; /* black */
	font: 14px Arial, Verdana, sans-serif;
} 

h1 { font-size: 28px; }
h2 { font-size: 24px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }

h1, h2, h3, h4, h5, h6 { margin: 4px 0; }

p { margin: 0 0 10px 0; }

ul { padding-left: 20px; }

a, a:visited { color: #313d2e; }
a:hover { text-decoration:none; }

a img { border: none; }

.tcenter { text-align: center; }
.tleft { text-align: left; }
.tright { text-align: right; }
.vtop { vertical-align: top; }
.vcenter { vertical-align: middle; }
.vbottom { vertical-align: bottom; }
.fleft { float: left; }
.fright { float: right; }
.clear { clear: both; }
.dinline { display: inline; }

.hr { height: 2px; border-bottom: 1px solid #312d2e; }

/* Base containers */
#wrap {
	width: 750px;
	margin: 0 auto;
}

#header {
    width: 100%;
	height: 380px;
	margin-top: 20px;
	background-color: #312d2e; /* Black */
}

#header-logo {
	margin: 10px 0 0 -20px;
	cursor: pointer;
}

#header-logo-content {
	width: 495px;
	height: 60px;
	padding-top: 5px;
	background-color: #ffc200; /* Yellow */
}

#header-contact {
	margin: 10px -10px 0 0;
	cursor: pointer;
}

#header-contact-content {
	width: 125px;
	height: 35px;
}

#header-nav {
	width: 300px;
	margin: 10px 0;
}

.header-nav-item {
	height: 45px;
	margin-left: -10px;
	cursor: pointer;
}

.header-nav-item-content {
	width: 220px;
	height: 35px;
}

#content {
	width: 100%;
	/*height: 400px;*/
    margin-top: 20px;
	padding-bottom: 20px;
	background-color: #eaeaeb; /* Light Gray */
}

#content-wide { 
    width: 100%; 
    padding: 0px 0 0 0;
}

.content-wide-header {
    width: 100%;
    margin: 15px 0 0 -10px;
}

.content-wide-header-content {
    width: 700px;
    height: 25px;
}

.content-wide-content {
    clear: both;
    padding: 0 10px 10px 10px;
}

#content-left {
	width: 530px;
}

.content-left-header {
	width: 100%;
	margin: 15px 0 0 -10px;
}

.content-left-header-content {
	width: 520px;
	height: 25px;
}

.content-left-content {
    clear: both;
    padding: 0 20px 10px 10px;
}

#content-right {
	width: 220px;
	/*padding-left: 20px;*/
}

.content-right-header {
    width: 100%;
    margin: 15px 0 0 10px;
}

.content-right-header-content {
    width: 200px;
	height: 25px;
	padding-left: 10px;
}

.content-right-content {
    clear: both;
    padding: 0 20px;
}

#content-right ul { padding: 0; }
#content-right li { 
    list-style-type: none; 
    margin: 0 0 10px 5px; 
    padding: 0 0 10px 5px; 
    border-bottom: 1px dotted #FF8F05;
}

#footer {
	width: 100%;
	/*height: 50px; */
	margin: 20px 0;
    background-color: #312d2e;
}

#error-404, #error-500 { padding: 20px 0 0 0; }

#recording-header { 
	padding: 15px 10px 0 10px;
}

/* Sprites */
.sprite { background: url(../images/lukestone_ui.png) no-repeat top left; }

.sprite-header { width: 9px; height: 34px; }
.sprite-header-bio { background-position: 0 0; } 
.sprite-header-cart { background-position: 0 -336px; } 
.sprite-header-contact { background-position: 0 -84px; } 
.sprite-header-error { background-position: 0 -336px; }
.sprite-header-gallery { background-position: 0 -168px; } 
.sprite-header-glass-gallery { background-position: 0 -252px; } 
.sprite-header-home { background-position: 0 -336px; }
.sprite-header-music { background-position: 0 -336px; } 
.sprite-header-recording { background-position: 0 -420px; } 
.sprite-header-tour-dates { background-position: 0 -504px; } 

.sprite-nav { width: 9px; height: 44px; }
.sprite-nav-bio { background-position: 0 -588px; } 
.sprite-nav-contact { background-position: 0 -682px; } 
.sprite-nav-contact-off { background-position: 0 -776px; } 
.sprite-nav-gallery { background-position: 0 -871px; } 
.sprite-nav-glass-gallery { background-position: 0 -965px; } 
.sprite-nav-home { background-position: 0 -1059px; width: 19px; height: 84px; } 
.sprite-nav-home-off { background-position: 0 -1193px; } 
.sprite-nav-music { background-position: 0 -1327px; } 
.sprite-nav-off { background-position: 0 -1421px; } 
.sprite-nav-recording { background-position: 0 -1515px; } 
.sprite-nav-tour-dates { background-position: 0 -1609px; } 

.sprite-sidebar-header-bio { background-position: 0 -1703px; } 
.sprite-sidebar-header-cart { background-position: -70px -85px; }
.sprite-sidebar-header-contact { background-position: 0 -1788px; } 
.sprite-sidebar-header-error { background-position: -70px -85px; } 
.sprite-sidebar-header-gallery { background-position: 0 -1873px; } 
.sprite-sidebar-header-glass-gallery { background-position: -69px 0; } 
.sprite-sidebar-header-home { background-position: -70px -85px; } 
.sprite-sidebar-header-music { background-position: -69px -85px; } 
.sprite-sidebar-header-recording { background-position: -69px -170px; } 
.sprite-sidebar-header-tour-dates { background-position: -69px -255px; } 

.sprite-stone-lab-records { background-position: -69px -340px; width: 139px; height: 57px; }

/* Typography */
.logo-text { font-size: 48px !important; }
.header-nav-item-text { font-size: 28px !important; }
.footer-text { font-size: 14px !important; color: #fff; padding: 10px; }
.stone-lab-records-text { font-size: 40px !important; padding: 10px 0 0 0; }
.album-track-title-text { font-size: 12px !important; font-weight: bold; display: block; padding-top: 3px; }
.album-track-links { font-size: 11px !important; }
.confirm-email-text { margin: 10px 0; }
.confirm-email-text span { background-color: #fff; padding: 4px; }

/* Header background images */
.header-bio { background: url(../images/header/header_bio.jpg) no-repeat top left; }
.header-cart { background: url(../images/header/header_music.jpg) no-repeat top left; }
.header-contact { background: url(../images/header/header_music.jpg) no-repeat top left; }
.header-error { background: url(../images/header/header_music.jpg) no-repeat top left; }
.header-gallery { background: url(../images/header/header_gallery.jpg) no-repeat top left; }
.header-glass-gallery { background: url(../images/header/header_glass_gallery.jpg) no-repeat top left; }
.header-home { background: url(../images/header/header_home.jpg) no-repeat top left; }
.header-music { background: url(../images/header/header_music.jpg) no-repeat top left; }
.header-recording { background: url(../images/header/header_recording.jpg) no-repeat top left; }
.header-tour-dates { background: url(../images/header/header_tour_dates.jpg) no-repeat top left; }

/* Nav colors */
.header-nav { background-color: #fff; /*opacity: .8;*/ } /* White */
.header-nav-bio { background-color: #861259; } /* Violet */
.header-nav-contact { background-color: #00a0c6; } /* Blue */
.header-nav-gallery { background-color: #7f27a0; } /* Blue Violet */
.header-nav-glass-gallery { background-color: #c21b45; } /* Red */
.header-nav-music { background-color: #ff8f05; } /* Orange */
.header-nav-recording { background-color: #b80028; } /* Red Violet */
.header-nav-tour-dates { background-color: #ff3d1a; } /* Red Orange */

/* Content header colors */
.content-header-bio { background-color: #861259; } /* Violet */ 
.content-header-cart { background-color: #ff8f05; } /* Orange */
.content-header-contact { background-color: #00a0c6;} /* Blue */
.content-header-gallery { background-color: #7f27a0; } /* Blue Violet */
.content-header-glass-gallery { background-color: #c21b45; } /* Red */
.content-header-home { background-color: #ff8f05; } /* Orange */
.content-header-music { background-color: #ff8f05; } /* Orange */
.content-header-recording { background-color: #b80028; } /* Red Violet */
.content-header-tour-dates { background-color: #ff3d1a; } /* Red Orange */

/* Misc */
.album { margin: 0 0 15px 0; }
.album h2 { margin: 0 0 15px 0; border-bottom: 1px dotted #ff8f05; }
.album-left { width: 215px; }
.album-right { width: 285px; }

.album-art { width: 25%; }
.large-album-art { margin: 0 15px 15px 0; }
.album-track-list { padding: 0 0 0 15px; }
.album-track-list li { margin: 0 0 5px 0; padding: 0 0 5px 0; border-bottom: 1px dotted #ff8f05; }
.album-track-list table { width: 100%; }
.album-track-title { display: block; }

.add-to-cart-link { margin: -13px 0 0 0; font-size: 9px !important; }
.add-to-cart-button { cursor: pointer; padding: 5px; border: 1px solid #808184; background-color: #ff8f05; font-weight: bold; }
.remove-from-cart-link { cursor: pointer; font-size: 9px !important; }

.media { padding: 0 5px 0 0; }

.gallery-image { width: 20%; margin: 0 0 15px 0; }

/* Cart */
#cart-table { width: 100% }
#cart-table thead td { border-bottom: 1px dotted #ff8f05; }
#cart-table tr.alt td { background-color: #fff; }
#cart-table td { padding: 5px; }

#cart-count { display: none; }
#cart-total { font-weight: bold; }

#checkout-button, #confirm-button { cursor: pointer; padding: 5px; border: 1px solid #808184; background-color: #ff8f05; font-weight: bold; }


/* Contact Form */
#contact_form .errorlist { padding: 0; }
#contact_form .errorlist li { list-style-type: none; color: red; }
#contact_form td { padding: 0 10px 10px 0; }
#contact_form input, #contact_form textarea { padding: 2px; border: 1px solid #00A0C6; background-color: #fff; }
#contact_form textarea { font-family: inherit; }

/* Webkit Hacks */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .album-track-list li { margin: 0 0 5px -20px; padding: 0 0 5px 25px; }
}