/*
Green: #a7a8ac
Light green: #C8D1BE
Mid-green: #7A866C;
Buff: #EFE2C6
*/

html { height: 100%; margin-bottom: 1px; }

img, a img {
border: 0;
text-decoration: none;
}

ul {
margin: 0;
padding: 0;
}

li {
list-style-type: none;
padding: 0;
margin: 0;
}


/*=============================================================
Basic Layout
==============================================================*/

body {
margin: 0px;
font-family: helvetica, arial, sans-serif;
/* background: #eee url(http://www.aao.com.au/images/layout/music_background.gif) top left repeat; */
background: #f3f4f9;
color: #222;
}

#container {
margin: 0 auto;
padding: 0;
border: 10px solid #fff;
background-color: #fff;
width: 780px;
}

#titlebar {
/*background: url(/static/images/layout/logo.gif) bottom right no-repeat;*/
/*margin-bottom: 5px;*/
/*height: 85px;*/
}


#toggle {
font-size: 11px;
/* Hides from IE-mac \*/
padding-top: 70px;
/* End hide from IE-mac */
float: left;
width: 200px;
}

.title {
padding-top: 45px;
float: right;
font-size: 20px;
color: #a7a8ac;
font-weight: bold;
text-align: right;
line-height: 100%;
padding-bottom: 0;
}

.subtitle {
font-size: 14px;
color: #000;
font-weight: normal;
text-align: right;
}

img.logo {
float: right;
}

a#masthead {
background: #eee url(/static/images/crossing_roper_bar_banner.jpg) top left no-repeat;
margin-top: 8px;
display: block;
height: 220px;
padding: 10px;
/*margin-bottom: 8px;*/
}

#masthead p {
float: left;
color: #fff;
width: 220px;
font-size: 12px;
line-height: 170%;
padding: 8px;
/*border-right: 1px solid #fff;*/
}

#masthead p a {
color: #fff;
}


img#siteLogo {
border-top: 8px solid #fff;
border-left: 8px solid #fff;
width: 80px;
height: 80px;
display: block;
float: right;
margin-top: 110px;
}

img#logo {
/*float: right;*/
}


#content { /*This could have a background image for delineating columns*/
/*border: 1px solid red;*/
margin-bottom: 15px;
}



#main {
margin-right: 20px;
float: left;
width:358px; 
voice-family: "\"}\""; 
voice-family:inherit;
width:368px;
}

#main.nosub { /* if there's no 'sub' column */
width: 490px;
margin-right: 0;
/*margin-top: 9px;*/
voice-family: "\"}\""; 
voice-family:inherit;
width: 508px;
}

/* and then nosub can in turn be divided into two columns */

#main.nosub div.one {
width: 210px;
margin-right: 20px;
float: left;
voice-family: "\"}\""; 
voice-family:inherit;
width: 240px;
}

#main.nosub div.two {
width: 210px;
float: left;
voice-family: "\"}\""; 
voice-family:inherit;
width: 240px;
}



#sub {
width: 128px;
color: #333;
float: left;
font-size: 70%;
}


#extra {
width: 250px;
float: right;
margin-top: 8px;
}


#footer {
font-size: 10px;
padding-top: 8px;
margin-top: 15px;
line-height: 140%;
}

.sectionLabel { /*labels for the top of each page column*/
font-size: 9px;
text-transform: uppercase;
display: block;
margin: 0 0 15px 0;
width: 75px;
text-align: center;
background: url(/static/images/layout/tab.gif) top left no-repeat;
height: 21px;
padding: 6px 0 0 0;
letter-spacing: 1px;
font-weight: bold;
color: #444;
}



/*=============================================================
Navigation
==============================================================*/

#navigation {
border-top: 4px solid #a7a8ac;
border-bottom: 1px solid #a7a8ac;
padding: 0; /* used to be 8px top and bottom */
padding-top: 8px;
/*margin-top: 4px;*/
line-height: 100%;
}

#navigation ul {
list-style-type: none;
margin: 0;
padding: 0;
line-height: 100%;
}

ul#mainNav {
font-size: 13px;
line-height: 100%;
}

ul#mainNav li {
font-weight: bold;
display: block;
float: left;
margin-right: 8px;
padding-bottom: 10px;
width:115px; 
voice-family: "\"}\""; 
voice-family:inherit;
width:120px;
}

ul#mainNav li a {
padding-top: 8px;
text-decoration: none;
color: #222;
}

ul#mainNav li a:hover {
text-decoration: underline;
}

ul#mainNav li ul.subNav {
font-size: 12px;
line-height: 100%;
padding-top: 6px;
}

ul#mainNav li ul.subNav li {
line-height: 100%;
margin: 0 0 5px 0;
border: none;
/*border: 1px solid green;*/
background-image: none;
padding: 0;
}

ul#mainNav li ul.subNav li a {
line-height: 100%;
color: #222;
width: 100%;
float: none;
/*border: 1px solid red;*/
font-weight: normal;
padding: 0;
margin: 0;
}

ul#mainNav li ul.subNav li a:hover {
width: 100%;
float: none;
display: block;
font-weight: normal;
border: 0;
text-decoration: none;
padding: 0px;
color: #444;
}


ul#mainNav li.active a {
background: url(/static/images/layout/activenavdown.gif) top center no-repeat;
font-weight: bold;
}

ul#mainNav li.active ul.subNav a {
background-image: none;
font-weight: bold;
}



/*=============================================================
Section: MAIN
==============================================================*/

h1 { /* Main heading, might change*/
margin: 20px 0 8px 0;
color: #222;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
line-height: 90%;
letter-spacing: -1px;
font-size: 28px;		
}

h1.spacebelow {
margin-bottom: 15px;
}

h2.instrument {
font-size: 11px;
color: #7A866C;
margin: 0 0 10px 0;
font-weight: normal;
}

h2 {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 20px;
margin: 22px 0 4px 0;
font-weight: normal;
color: #222;
}

#main h3 {
margin-top: 8px;
}

a.go {
text-decoration: none;
background: url(/static/images/layout/arrow.gif) right 1px no-repeat;
padding-right: 17px;
}

h2 a.go {
background: url(/static/images/layout/arrow.gif) right 5px no-repeat;
}

a.go:hover {
text-decoration: underline;
}

hr {
border: 0;
border-top: 1px solid #eee;
margin: 15px 0;
}

object {
margin: 10px 0 20px 0;
}

ol { /* annoyingly used to connote key project info. change when possible */
padding: 0;
}

ol li {
padding: 0;
}

#main p, #main li, #main address {
font-size: 12px;
line-height: 150%;
margin: 0 0 8px 0;
font-style: normal;
}

#main.nosub p {
width: 420px;
}

#main p.small {
font-size: 11px;
}

a, a:link {
color: #666;
}

#main blockquote {
line-height: 140%;
color: #7A866C;
margin-left: 25px;
}

#main p.slug {
font-style: italic;
font-size: 11px;
margin-bottom: 4px;
}

div.reviewdetails { /* review details like reviewer, date, tagline */
font-size: 11px ! important;
line-height: 130%;
width: 160px;
/*padding: 5px;*/
margin: 0 0 15px 0px;
/*background-color: #E9E9E9;*/
}


#main ul.small li { /*for small lists that are dd/dl lists */
font-size: 11px;
line-height: 100%;
padding: 0;
}

#main ul.inlinetext { /* a horizontal 'quick list', used on Projects */
margin-top: 2px;
width: 420px;
}

#main ul.inlinetext li {
display: inline;
margin-right: 5px;
}

dl {
margin-top: 0;
font-size: 11px;
margin-right: 10px;
}

dl dd, dl dt  {
line-height: 100%;
width: 210px;
voice-family: "\"}\""; 
voice-family:inherit;
width: 230px;
}

dt {
font-weight: bold;
margin: 7px 0 2px 0;
}

dd {
margin: 0;
width: 180px;
}


.NextPrevious {
display: block;
margin-top: 20px;
font-size: 11px;
width: 350px;
}

a.next {
text-decoration: none;
float: right;
background: url(/static/images/layout/arrow.gif) right top no-repeat;
padding-right: 17px;
}

a.previous {
float: left;
text-decoration: none;
background: url(/static/images/layout/leftarrow.gif) left top no-repeat;
padding-left: 17px;
}


div.performance {
  margin: 15px 25px;
  padding-top: 7px;
  border-top: 1px solid #cccccc;
}

/*=============================================================
Section: SUB
==============================================================*/

h3 { /* Main heading in sub section*/
margin: 0 0 4px 0;
font-size: 11px;
/*letter-spacing: 1px;*/
font-weight: bold;
/*text-transform: uppercase;*/
}

#sub div.newsitem {
margin: 0 0 10px 0;
padding: 0 0 10px 0;
border-bottom: 1px solid #eee;
}

#sub p {
font-size: 11px;
line-height: 130%;
margin: 0 0 12px 0;
}

#sub ul, #extra ul {
font-size: 11px;
padding: 0;
margin: 0 0 15px 0;
}

#sub li, #extra li {
list-style-type: none;
line-height: 130%;
margin-bottom: 5px;
}

#sub dl dd, #sub dl dt  {
line-height: 100%;
width: 125px;
}



/*=============================================================
Section: EXTRA
==============================================================*/

.adbox {
display: block;
padding: 0 0 4px 0;
margin: 0 0 10px 0;
font-size: 12px;
text-align: center;
border-top: 4px solid #525553;
}

.adbox img {
width: 100%;
margin: 0 0 2px 0;
padding: 0;
}

#extra h4 {
padding: 5px 0;
margin: 0;
color: #444;
}

#extra p {
text-align: left;
margin: 5px;
margin-top: 0;
font-size: 11px;
}


form#mailinglist {
background: #E9E9E9 url(/static/images/ads/news2.jpg) top left no-repeat;
padding-top: 5px;
padding-bottom: 70px;
/*display: block;*/
font-size: 11px;
margin: 0;
}

form#mailinglist fieldset {
background: none;
border: 0;
padding: 12px;
padding-bottom: 0px;
margin: 0;
text-align: center;
}

form#mailinglist label {
font-size: 10px;
font-weight: bold;
display: block;
margin-bottom: 4px;
}

/*=============================================================
Section: FOOTER
==============================================================*/

#footer address {
font-style: normal;
float: left;
}

.footertext {
float: right;
margin-left: 20px;
text-align: right;
}

#footer a, #footer a:link {
font-weight: bold;
text-decoration: none;
color: #000;
}

#footer form {
margin: 0;
padding: 0;
}

#footer fieldset {
margin: 0;
padding: 0;
border: 0;
}

#footer fieldset input#search {
width: 120px;
}

/*=============================================================
Sitewide: IMAGES
==============================================================*/

img.headshot, div.biogimage img {
float: right;
margin: 0 0 10px 10px;
width: 186px;
/*border: 1px solid #444;*/
}

img.go {
margin: 0 0 -1px 1px;
}

img.gallerythumb {
height: 82px;
display: block;
margin: 0 0px 6px 0;
border: 1px solid #A0A0A0;
background-color: #eee;
width: 85px;
}

img.projectlarge {
float: right;
margin: 3px 0 10px 10px;
width: 300px;
}

img.photo {
margin: 15px 0;
}

.cdcover {
float: left;
margin: 12px 15px 15px 0;
}

#main ul.photos {
font-size: 11px;
}

#main ul.photos li {
float: left;
display: block;
font-size: 11px;
line-height: 120%;
padding: 0 0px 10px 0;
width: 185px;
margin-right: 11px;
}

#sub ul.verticalthumbs {
font-size: 11px;

}

#sub ul.verticalthumbs li {
display: block;
font-size: 11px;
line-height: 120%;
width: 85px;
padding: 0 0 15px 0;
}

ol.galleryNav {
  list-style:none;
  padding:0;
  position:relative;
  margin:14px 0 0 -12px;
}
ol.galleryNav li {
  display:block;
  padding:3px 12px;
  float:left;
  color:#444;
  cursor:pointer;
  font-size:11px;
}
.galleryNav li a {
  padding:3px 12px;
  color:#444;
}
.galleryNav li#activeThumb {
  color:#ed1556;
}

.slideshowMain .caption h2 {
  margin-top: 0px;
}



/*=============================================================
Hackery
==============================================================*/


.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {display: inline-block;}

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