/* @override http://angelsthemusical.com/css/angels.css */

/* general */

body {margin:0;padding:0;background:#392C1B url(/images/angels/page-bgnd.jpg) top center no-repeat;font-family:georgia, times, serif;text-align:center;}
body.header-body {background-image:none;}

.to-left {float:left;}
.to-right {float:right;}

/* p.i.e. clearfix */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* easy clear fix for IE 7 - see 456bereastreet.com for details */
.clearfix {display:inline-table;}

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

/* top & bottom nav */

#nav-wrapper {margin:0 auto;margin-top:17px;width:780px;height:46px;position:relative;}
#nav-bgnd {position:absolute;top:0;left:0;height:36px;width:775px;z-index:1;padding:5px 4px 3px 3px;background-color:#fff;opacity:0.85;filter:alpha(opacity=85); -moz-opacity: 0.85;}
#nav {position:absolute;top:0;left:0;width:775px;padding:14px 4px 7px 3px;font-size:13px;z-index:2;font-weight:bold;color:#362600;text-transform:uppercase;}
#nav a {color:#362600;text-decoration:none;}
#nav a:hover {color:#fff;text-decoration:none;}
#nav a:visited {color:#362600;}
#nav ul, #nav li, #nav-footer ul, #nav-footer li {display:inline;padding:0;margin:0;}
#nav li {padding-left:8px;padding-right:5px;background:url(/images/angels/nav-div.gif) top left no-repeat;}
#nav li.first, #nav-footer li.first {padding-left:0;background-image:none;}
#nav li.last, #nav-footer li.last {padding-right:0;}

#footer {margin-top:60px;height:171px;background:#000 url(/images/angels/footer-bgnd.gif) repeat-x;} /* NEED TOP GRAD FOR CONTENT PAGES*/

#nav-shadow {font-size:0;position:absolute;bottom:0;left:4px;height:2px;width:772px;margin:0 auto;background-color:#000000;opacity:.20;filter: alpha(opacity=20);-moz-opacity: 0.2;}

#nav-footer {color:#C4B385;font-size:11px;font-weight:bold;text-transform:uppercase;padding:15px 0 15px 0;letter-spacing:0.05em;}
#nav-footer a, #nav-footer a:visited {color:#C4B385;} 
#nav-footer a:hover {color:#fff;}
#nav-footer ul {margin:0;padding:0;}
#nav-footer li {margin:0;padding-left:7px;padding-right:3px;background:url(/images/angels/nav-footer-vdiv.gif) center left no-repeat;}

/* the selector below is used with the css-browser-selector.js script. 
   unfortunately its the only way to hack around safari's inconsistent letter-spacing rendering (its less than it should be).
	 im padding out the elements a little more instead. 
	 obviously hacks are bad and should be avoided, but i'm a perfectionist darnit! */
.webkit #nav-footer li {padding-left:8px;padding-right:5px;}
.webkit #nav li {padding-left:9px;padding-right:8px;}


/* header */

#header {height:164px;background: #000 url(/images/angels/header-bgnd.gif) repeat-x;text-align:center;}
#header img {margin-top:9px;border:0;}
#header #now-playing {width:300px;margin:0 auto;margin-top:11px;text-align:left;}
#header #now-playing, #header #now-playing a, #header #now-playing a:visited {font-weight:bold;color:#BDA975;font-size:12px;}
#header #now-playing a:hover {color:#fff;}
#header #now-playing #music-player {line-height:0;display:inline;position:absolute;top:138px;} 
/* ^^ absolute positioning used above to IE, FF and safari positioning object/embed differently :\ */
/* line-height:0; on containing div makes FF height positioning consistent with others */
.opera #header #now-playing #music-player {margin-left:5px;}
/* ^^ weird opera positioning fix using browser selector js */
#header #now-playing #download-samples {display:inline;padding-left:203px;}


/* content pages */

#content-wrapper {position:relative;width:680px;padding:25px 30px;margin:4px auto;overflow:hidden;}
#content-bgnd {position:absolute;top:0;left:0;padding-bottom:3000px;/* ie hack with overflow:hidden above*/
							 width:770px;height:100%;z-index:1;background-color:#fff;opacity:.85;filter: alpha(opacity=85); -moz-opacity: 0.85;}
#content {position:relative;z-index:5;width:680px;text-align:justify;font-size:13px;line-height:22px;color:#856400;}
#content h2 {margin:3px 0;padding:0;color:#362600;padding-bottom:5px;font-size:38px;/*letter-spacing:0.05em;*/font-weight:normal;text-align:left;line-height:46px;}
#content h3 {margin:0;padding:0;color:#362600;margin-top:15px;font-size:20px;font-weight:normal;}
#content h3.sub {margin-top:-15px;}
#content h4 {margin:0;padding:0;color:#362600;margin-top:15px;margin-bottom:-10px;font-size:16px;font-weight:bold;}
#content a {font-weight:bold;color:#856400;}
#content img {border:10px solid #fff;}
#content img.left {margin-right:15px;float:left;}
#content img.right {margin-left:15px;float:right;}
#content .more {text-align:right;}
#content .more-top {text-align:right;margin:-25px 0 -10px 0;}

#content .centered {text-align:center;}
#content .bold {font-weight:bold;}


#news-content p {margin:0;padding:0;}

#artwork {text-align:center;}

#rhs {position:relative;z-index:2;width:230px;margin-top:-10px;}
#rhs .box-wrapper {position:relative;width:200px;padding:15px;margin:15px 0;overflow:hidden;}
#rhs .box-bgnd {position:absolute;top:0;left:0;margin:0 auto;padding-bottom:1000px;/* ie hack with overflow:hidden above*/
          width:250px;height:100%;z-index:3;background-color:#fff;opacity:.80;filter: alpha(opacity=80); -moz-opacity: 0.80;}
#rhs .box {position:relative;z-index:6;margin:0 auto;width:0px;text-align:center;font-size:11px;color:#533A00;line-height:1.4;}
#rhs .box a, #rhs .box a:visited {color:#533A00;}
#rhs .box a:hover {color:#000;}
#rhs .box h4 {font-size:12px;margin:3px 0px;padding:0;text-transform:uppercase;color:#362600;}
#rhs .box p {margin:0;padding:3px 0;margin-top:10px;}
#rhs .more {margin-top:5px;}

#footer #credit, #footer #credit a, #footer #credit a:visited {font-size:11px;letter-spacing:0.05em;color:#C4B385 /* 9B8E6C */;font-weight:normal;text-decoration:none;padding:10px 0px 5px 0;font-weight:bold;}
#footer #credit a:hover {color:#fff;}
#footer #credit img {border:0;}

/* front page adjustments */
#front-page #nav-bgnd {opacity:.40;filter: alpha(opacity=40); -moz-opacity: 0.4;}

#front-page-content {width:730px;font-size:18px;letter-spacing:-0.06em;color:#362600;margin:0 auto;margin-top:235px;line-height:20px;}
#front-page-content a, #front-page-content a:visited {color:#362600;font-weight:bold;}
#front-page-content a:hover {color:#fff;}
#front-page-content #story {text-align:right;padding:10px 0;padding-left:80px;}
#front-page-content #performances {text-align:left;padding:10px 0;padding-left:10px;margin-left:10px;background:url(/images/angels/fp-vdiv.gif) repeat-y;}
#front-page-content h2 {text-transform:uppercase;color:#fff;font-size:12px;letter-spacing:0.2em;font-size:12px;margin:0;padding:0;margin-bottom:2px;}
#front-page-content .small {font-size:12px;letter-spacing:-0.01em;}

#front-page #footer {margin-top:200px;}