@charset "utf-8";
/* CSS Document - Base CSS after browser reset */
/* Author: Scratch Web Design */

/* Ref. style_reset.css for browser CSS reset styles */
/* --------------------------------------------------------- IMPORT ADDITIONAL CSS */
@import url("style_access.css");

/* --------------------------------------------------------- DOCUMENT */
body {
	background-color: #000;;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  text-align: center; /* Centers the page content container in IE 5 browsers. */
	color: #888;
	background-position: center top;
	background-repeat: no-repeat;
	}
body.studio {
	background-image: url(../images/bg_outer-wrap-studio.jpg);
	}
body.composition {
	background-image: url(../images/bg_outer-wrap-composition.jpg);
	}	

/* --------------------------------------------------------- BASE STRUCTURAL LAYOUT & WRAPS */
#outer-wrap {	/* Outer container */
  text-align: left; /* Redefines the text alignment defined by the body element. */
  width: 100%;
	}
	
#inner-wrap {	/* Inner container */
  width: 1000px;
	margin-left: auto;
	margin-right:auto;
	}	

#header-wrap {	/* Header container */
  width: 100%;
	height: 145px;
	}

#content-wrap {  /* Content container */
  margin-left: 120px;
	margin-top: -10px;
	height: auto;
	background-image: url(../images/bg_content-wrap.png);
	background-repeat: repeat-y;
	}	

#content-body-s,
#content-body-c { 
  width: 830px;
	min-height: 350px;
	}	
	
#content-top {
	width: 100%;
	}
#content-left {
	float: left;
	width: 50%;
	border-right: 0px solid #111;
	height: auto;
	}

#content-right {
	float: left;
	width: 49%;
	height: auto;
	border-left: 1px solid #111;	
	}

#content-biog {
	width: 80%;
        width: 100%;
	float: left; 
	}
.biog-images {
	width: 15%;
        width: 768px;
	margin: 0 auto;
	}
#content-contact {
  width: 830px;
	clear: both;
	padding-top: 15px;
	}

#content-endorse {
       padding: 50px 0; 
       }
#content-end {
  width: 830px;
	height: 30px;
	background-image: url(../images/bg_content-end.png);
	background-repeat: no-repeat;	
	}

/* --------------------------------- LISTS LAYOUT */

#list-div1 {	
	float: left;
	}
#list-div2 {	
	float: left;
	}
#list-div3 {
	float: left;
	padding: 10px 0 0 50px; 
	}		
#list-div4 {
	float: left;
	clear: both;
	width: 700px;
	margin: 10px 30px 0 50px; 
	}	
#list-div5 {
	float: left;
	clear: none;
	padding-left: 30px;
	}			

/* --------------------------------------------------------- FLASH CONTENT */
#audio-player {
	float: right;
	clear: none;
	width: 162px;
	height: 280px;
	margin-right: 50px;
	border: 1px solid #222;
	background-color: #000000;
	margin-right: 40px;
	}		

#show-reel {
	width: 750px;
	height: 360px;
	margin-left: 36px;
	}

#bg-audio {
	float: left;
	width: 433px;
	color: #999;
	font-size: 0.8em;
	font-family: sans-serif;
	}
/* --------------------------------- NO SCRIPT */
#outer-wrap p.no-script {
	padding: 10px;
	color: #222; 
	text-align: justify; 
	line-height: 1.2em;
	}
p.no-script span {
	color: #990000;
	}
p.no-script a {
	color: inherit;
	}	
p.no-script a:hover {
	color: #444;
	}	


		
/* --------------------------------- GALLERY */
#gallery {
	margin-left: 70px;
	}	
#gallery img {
	padding: 5px;
	}				
#gallery a { /* Kill default link borders */
	border:none;
	}
/* --------------------------------- FOOTER */
#footer {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
	font-size: 0.75em;
	text-align: center;
	clear: both;
	padding-left: 70px;
	}	

/* ---------------------------------------------------------  NAVIGATION */
/* ---------------------------------  HELP & HOME NAV LAYOUT */		
#nav-home {
	position: absolute; right: 20px; top: 0px;
  width: 99%;
	text-align: right;
	}

#nav-home ul {
	width: 100%;
	margin: 0;
	}	
#nav-home li {
	display: inline; 
	line-height: 25px;
	padding: 2px 0 5px 0;
	padding-left:30px;
	list-style: none;
	font-size: 0.85em;
	color: #BBB;
	font-weight: bold;
	background-repeat: no-repeat;
	}
.bg_help {
	background-image: url(../images/nav-ico_help.gif);
	}
.bg_home {
	background-image: url(../images/nav-ico_home.gif);
	z-index: 10;
	}	
.bg_links {
	background-image: url(../images/nav-ico_links.gif);
	}
.bg_email {
	background-image: url(../images/nav-ico_email.gif);
	}
.bg_tel {
	background-image: url(../images/nav-ico_tel.gif);
	}		
/* ---------------------------------  HELP & HOME NAV LINKS */			
#nav-home a,  #nav-home a:link {
  color: #BBB;
  font-weight: bold;
  text-decoration: none;
	padding: 2px;
	z-index: 0;
	}
#nav-home a:visited {
  color: #BBB;
  font-weight: bold;
	}
#nav-home a:hover {
	color: #FF9933;
  text-decoration: underline;
	}
#nav-home a:focus, #nav-home a:active {
	outline: none;
	color: #FF9933;
	background: none;
  text-decoration: none;
	border-top: 1px dotted #FF9933;
	border-bottom: 1px dotted #FF9933;
	}

/* --------------------------------- NAV2 LAYOUT */
#nav2-wrap-s {
	width: 1000px;
	height: 90px;
	background-image: url(../images/bg_nav2-wrap_studio.jpg);	
	background-repeat: no-repeat;
	background-position: 0 0;
	}

#nav2-wrap-c {
	width: 1000px;
	height: 90px;
	background-image: url(../images/bg_nav2-wrap_composition.jpg);
	background-repeat: no-repeat;
	}


ul#nav-studio {
	float: left;
	margin-top: 30px;
	margin-left: 170px;
	padding-bottom: 3px;
	border-bottom: 1px solid #151515;
	}

ul#nav-studio li {
	display: inline; 
	padding: 5px 0 5px 0;
	list-style: none;
	}
	
/* --------------------------------- NAV2 LINKS */

.current {
	color: #EEE;
	text-decoration: none;
	font-size: 0.85em;
	font-weight: bold;	
	}	
	
ul#nav-studio a, ul#nav-studio a:link,
ul#nav-studio a:visited {
  color: #EEE;
  text-decoration: none;
	font-weight: bold;
	font-size: 0.85em;
	}

ul#nav-studio a:hover {
	color: #FF9933;
  text-decoration: none;	
	}

ul#nav-studio a:focus, ul#nav-studio a:active {
	outline: none;
	color: #FF9933;
  text-decoration: none;
	border-top: 1px dotted #FF9933;
	border-bottom: 1px dotted #FF9933;
	}	


/* --------------------------------- FOOTER NAV LAYOUT*/	
#nav-foot {
  width: 90%;
	margin-left: auto;
	margin-right: auto;
	clear: both;
	color: #AAA;
	text-align: center;
	padding: 0.5em 0 0.5em 70px;
	}		
#nav-foot ul {
	width: 100%;
	margin: 0;
	}	
#nav-foot li {
	display: inline; 
	margin: 0 0.3em 0 0.5em;
	list-style: none;
	font-size: 0.80em;
	}

/* ---------------------------------  FOOTER NAV LINKS */
.sep2 {color: #666; padding: 0 0.2em 0 1.8em; font-size: 10px; }

#nav-foot a,  #nav-foot a:link {
  color: #666;
  text-decoration: none;
	}
#nav-foot a:visited {
  color: #666;
	}
#nav-foot a:hover {
	color: #EEE;
  text-decoration:  underline;
	}
#nav-foot a:focus, #nav-foot a:active {
	outline: none;
	color: #EEE;
  text-decoration: none;
	border-top: 1px dotted #EEE;
	border-bottom: 1px dotted #EEE;
	}	

/* ---------------------------------------------------------  LINKS */	

/* --------------------------------- LINKS: GENERAL */
a,  a:link {
  color: #BBB;
  text-decoration: underline;
	font-style: inherit;
	}

a:visited {
  color: #888;
  text-decoration: underline;
	}

a:hover {
	color: #FF9933;
  text-decoration: underline;	
	}

a:focus, a:active {
	outline: none;
	color: #FF9933;
  text-decoration: none;
	border-top: 1px dotted #FF9933;
	border-bottom: 1px dotted #FF9933;
	}	

/* ---------------------------------  LINKS: FOOTER */

#footer a,  #footer a:link {
  color: #333;
  font-weight: bold;
	outline: none;
  text-decoration: underline;
}
/* Sets the style for visited links. */
#footer a:visited {
  color: #333;
  font-weight: bold;
  text-decoration: underline;
}
/* Sets the style for links on hover, focus and active */
#footer a:hover {
	color: #AAA;
  text-decoration: underline;
}
/* Additional style for link focus and active */
#footer a:focus, #footer a:active {
	color: #AAA;
  text-decoration: none;
	border-top: 1px dotted #AAA;
	border-bottom: 1px dotted #AAA;
}


/* ---------------------------------------------------------  LISTS */	

ul.studio-list {
	float: left;
	list-style:  square;
        padding: 0.5em 0 1.2em 0;
        line-height: 2em;
	}

ul.gear-list {
	list-style:  none;
	padding-bottom: 1.2em;
        line-height: 2em;
	}	

ul.inline-list {
	list-style: none;
	}	
ul.inline-list li {
	display: inline;	
	}	
#list-div4 .inline-list {
        line-height: 2em; 
        }
ul#links-list {
	margin-left: 100px;
	list-style: none;
	line-height: 2.5em
	}



/* ---------------------------------------------------------  HEADERS */	

/* --------------------------------- H1 HEADER IR */
#header-logo { 
  width: 100%;
	height: 120px;
  position: relative; left: 0; top: 25px; 
	color: #EEE;
	font-weight: bold;
	font-size: 1.5em;
	line-height: 1.1em;
	padding-top: 10px; /* Drop IR text */
	}

#header-logo span {
	background-repeat: no-repeat;
  position: absolute; /*left: 0; top: 0;*/
	margin-top: -10px; /* offset #header-logo padding-op */
	width: 100%;
	height: 120px;
	}	
#header-logo.studio span {
	background-image: url(../images/bg_h1_studio.jpg);
	}
#header-logo.composition span {
	background-image: url(../images/bg_h1_composition.jpg);
	}
	
/* --------------------------------- H2 HEADER IR */
#h2-image { 
  width: 320px;
	height: 50px;
	float: right;
  position: relative; right: 10px; top: 0; 
	color: #EFEFEF;
	font-weight: bold;
	font-size: 1.5em;
	padding-top: 20px; /* Drop IR text */
	}

#h2-image span {
	background-repeat: no-repeat;
  position: absolute; /*left: 0; top: 0;*/
	margin-top: -20px; /* offset #header-logo padding-op */
	width: 100%;
	height: 50px;
	}	
#h2-image.home span {
	background-image: url(../images/bg_h2-home.jpg);
	}
#h2-image.links span {
	background-image: url(../images/bg_h2-links.jpg);
	}				
#h2-image.studio span {
	background-image: url(../images/bg_h2-studio.jpg);
	}
#h2-image.composition span {
	background-image: url(../images/bg_h2-composition.jpg);
	}	
#h2-image.access span {
	background-image: url(../images/bg_h2-access.jpg);
	height: 90px;
	}	
#h2-image.dave span {
	background-image: url(../images/bg_h2-dave.jpg);
	}			

#content-wrap h3 {
	padding: 0 0 10px 50px;
	color: #FFFF99;
	font-size: 1.1em;
	font-weight: bold;
	}	

#content-wrap h3.comp-clients {
	padding: 0 0 0.5em 30px;
	}		

#content-wrap h4 {
	padding: 0;
	color: #FF9933;
	font-size: 1em;
	font-style: italic;
	}	

#content-biog h4, #content-top h4 {
	padding: 0 0 10px 50px;
	color: #FFFF99;
	font-size: 1em;
	font-weight: normal;
        font-style: normal;
        }
#list-div1 h4, #list-div2 h4, #list-div3 h4, #list-div4 h4 {
        padding-left: 0;
        }
#content-left h4 {
	padding: 0 0 0.5em 50px;
	color: #FF9933;
	font-size: 1em;
	font-weight: bold;
	font-style: normal;
	}
#content-right h4 {
	padding: 0 0 0.5em 30px;
	color: #FF9933;
	font-size: 1em;
	font-weight: bold;
	font-style: normal;
	}
#content-contact h4, #content-endorse h4 {
	color: #333;
	margin-left: 50px;
	font-weight: bold;
        border-bottom: 1px solid #111;
	}
#content-endorse h4 {
        margin-bottom: 30px;
        }

/* ---------------------------------------------------------  TEXTUAL */	

.rd {
	font-weight: bold;
	color: #888;
	font-style: inherit;
}

p { 
 font-size: 1.1em;
 line-height: 1.7em;
 }
#content-top p {
	padding: 0 45px 20px 50px;	
	text-align: justify;
        text-align: left;
	}
#content-biog p {
	padding: 0 25px 20px 50px;	
	text-align: justify;
        text-align: left;
	}	
#content-left p {
	padding: 0px 30px 20px 50px;	
	text-align: justify;
        text-align: left;
	}	
#content-right p {
	padding: 0px 35px 20px 30px;	
	text-align: justify;
        text-align: left;
	}
#content-contact p {
	padding: 10px 0 0 0;	
	margin: 0 45px 0 50px;		
	font-style: italic;
	text-align: center;
        line-height: 50px;
	}
#content-endorse p {
        font-size: 0.8em;
        font-weight bold;
        font-style: normal;
        color: #FF9933;
        text-align: center;
        line-height: 50px;
        }
#audio-player p {
	padding: 5px;	
	text-align: left;
	font-style: italic;
	}


/* --------------------------------------------------------- IMAGES */

.tn-wrap5,
.tn-wrap1 img {
	float: right;
	clear: right;
	margin: 0 30px 10px 20px;
	background-color:#050505;
	padding:5px;
	margin-bottom:10px;
	border:solid 1px #222222;
	text-align: center;
	}
.tn-wrap6,
.tn-wrap2,
.tn-wrap2 img {
	float: right;
	clear: right;
	margin: 0 35px 10px 20px;
	background-color:#050505;
	padding:5px;
	margin-bottom:10px;
	border:solid 1px #222222;
	text-align: center;
	}
.tn-wrap3 img {
	float: right;
	clear: right;
	margin: 0 40px 10px 20px;
	background-color:#050505;
	padding:5px;
	margin-bottom:10px;
	border:solid 1px #222222;
	text-align: center;
	}	
.tn-wrap4 img {
	float: left;
	clear: left;
	margin: 0 50px 20px 50px;
	background-color:#050505;
	padding:5px;
	border:solid 1px #222222;
	text-align: center;
	}	
.tn-wrap7 {
	margin: 0 0 10px 0;
	background-color:#050505;
	padding:5px;
	margin-bottom:10px;
	border:solid 1px #222222;
	}
#content-endorse img {
        display: block;
        margin: 0 auto;
        border: 1px solid #333;
        }
.biog-images img {
       display: block;
       float: left;
       margin: 10px;
       margin-bottom: 50px;
       padding: 5px;
       border: solid 1px #222222;
      }

/* --------------------------------------------------------- MISC */

.sep1 {color: #EEE; padding: 0 1em 0 1.5em; font-size: 10px; }
.sep2 {color: #666; padding: 0 0.8em 0 1.5em; font-size: 10px; }

.italic {font-style: italic}
.bold {font-weight: bold}
.block {display: block}
.inline {display: inline}
.left {text-align: left}	
.clear-left {clear: left}
.clear-right {clear: right}
.clear-both {clear: both}	
.white {color: #efefef;}
.fl-left {float: left;}
/* EOF */