/* MAIN CONTENT STYLESHEET */

/* Any content that is in the mainbox div, in the center column, is styled here */


/* ! FERNBAR STYLING */

 /* spacing between tabs & fernbar */
#mainbox {
	margin-top: 5px;
}

/* fernbar across top, under tabs */
#mainbox p.fernbar_longer {
	clear: both;
	text-indent: -9999px;
	display: block;
	width: 313px;
	height: 10px;
	margin: auto;
	background: url(/css_img/layout/fernbar_longer_faded.gif) no-repeat 0 0;
	padding-bottom: 12px;
}



/* ! HEADLINE STYLING */

/* pads the page headline (h1) */
#mainbox h1 {
	padding: 0 0 11px;
}

/* styles the lead paragraph (h2) */
#mainbox h2 {
	padding-bottom: 10px;
	font-size: 1.15em; /* same as bump class */
}

#mainbox h3 {
	padding-bottom: 9px;
	font-size: 1.075em; /* half of bump class */
}




/* ! BODY TEXT STYLING */

/* styles the body text */
#mainbox p {padding-bottom: 8px;}

/* styles the tagline text, usually found above lower graphic or copyright */
#mainbox h4.tagline {
	clear: both;
	margin: 8px 0;
	font-size: 1.15em; /* bump */
	text-align: center; /* center */
	color: #4c4c4c; /* grayer */
	font-weight: bold; /* bold */
	font-style: italic; /* italic */
	text-shadow: 0px 2px 3px white; /* letterpress */
}




/* ! LINK STYLING */
/* add graphics and rollovers to links */

/* adds onsite link icon to links or spans classed with "onsite" */
#mainbox a.onsite, #mainbox span.onsite {
	padding-right: 19px;
	background: url(/css_img/layout/onsite_link.gif) no-repeat 100% 1px;
}

/* adds offsite link icon to links or spans classed with "offsite" */
#mainbox a.offsite, #mainbox span.offsite {
	padding-right: 15px;
	background: url(/css_img/layout/offsite_link2.gif) no-repeat 100% 2px;
}

/* adds zoom icon to links or spans classed with zoom */
#mainbox a.zoom, #mainbox span.zoom {
	padding-right: 17px;
	background: url(/css_img/layout/zoom_link.gif) no-repeat 99% 2px;
}

/* adds download icon to links or spans classed with "download" */
#mainbox a.download, #mainbox span.download {
	padding-right: 17px;
	background: url(/css_img/layout/download_link.gif) no-repeat 100% 1px;
}

/* styles main body links & rollover states*/
#mainbox a {color: navy;}
#mainbox a:visited {color: navy;}
#mainbox a:hover {color: red; background-color: #FFFF99;} /* must go after other link stuff to display! */

/* removes all link styling for "secret" links */
#mainbox a.nolink, a.nolink:visited, a.nolink:hover, a.nolink:active {
	color: inherit;
	background-color: inherit;
}



/* INSET GRAPHC STYLING */

/* places an inset graphic */
#mainbox h4#insetgraphic {
	display: block;
	text-indent: -9999px;
}

#insetgraphic.twocans {width: 127px; height: 144px; background: url(/css_img/tacky/twocans.gif) no-repeat 0 0;}
#insetgraphic.facebook {width: 71px; height: 72px; background: url(/css_img/layout/facebook_logo_1in.png) no-repeat 0 0;}
#insetgraphic.tacky {width: 108px; height: 85px; background: url(/css_img/tacky/tacky_1p5.gif) no-repeat 0 0;}
#insetgraphic.bigsound {width: 150px; height: 131px; background: url(/css_img/tacky/bigsound_color_150.gif) no-repeat 0 0;}
h4.toucanberry {width: 190px; height: 266px; background: url(/css_pix/toucanberry.gif) no-repeat 0 0;}
h4.ramphastus {width: 144px; height: 239px; background: url(/css_pix/ramphastus.gif) no-repeat 0 0;}


/* ! BODY GRAPHIC STYLING */

/* places the main body graphic (e.g. bigsound, etc.), just above the footer */
#mainbox h4#bodygraphic {
	text-indent: -9999px;
	display: block;
	margin: 5px auto 0;
}

/* chooses bodygraphic image specified by class */
#mainbox h4#bodygraphic.bigsound {width: 165px; height: 144px; background: url(/css_img/tacky/bigsound_color_165.gif) no-repeat 0 0;}
#mainbox h4#bodygraphic.twocans  {width: 127px; height: 144px; background: url(/css_img/tacky/twocans_color_small.gif) no-repeat 0 0;}
#mainbox h4#bodygraphic.tacky  {width: 144px; height: 112px; background: url(/css_img/tacky/tacky_2in.gif) no-repeat 0 0;}
#mainbox h4#bodygraphic.atplay {width: 272px; height: 143px; background: url(/css_img/tacky/at_play.gif) no-repeat 0 0;}
#mainbox h4#bodygraphic.panorama {width: 400px; height: 181px; background: url(/css_pix/panorama.jpg) no-repeat 0 0;}


/* ! COMMENT BOX STYLING */

/* styles the div called "usernotes" generated by ScriptsMill Comments script */
div#usernotes {display: block; border: 1px solid silver; margin: 10px 5% 0; text-shadow: #e0e0e0 1px 1px;} /* comment div styling */
div.head>h3 {text-align: center; font-size: 1.15em; color: maroon; font-weight: bold;} /* comment header styling */
div.note>strong {color: navy; font-size: .75 em;} /* commenter name styling */
div.note>small {color: gray; font-size: .75em;} /* comment date color */
div.text {color: #800000;} /* comment text styling */
div.foot table {margin: auto;} /* text field centering */
div.foot td:first-child {vertical-align: top; font-size: .9em; text-align: right; padding-right: 3px;} /* box label styling */
div.foot tbody+tr td {vertical-align: bottom;}



/* ! GIGLIST STYLING */

/* styles the list with ID=giglist for the info_schedule page */
ul#giglist {
	display: block;
	clear: both;
	width: 400px;
	margin: 10px auto;
}

/* styles each list item block */
ul#giglist li {
	display: block;
	outline: 1px solid gray;
	margin: 9px 0;
	background-color: white;
}

/* hides items classed as "hidden" */
ul#giglist li.hidden {
	display: none;
}

/* styles the list item text in giglist */
ul#giglist p.event {background-color: #e3e5e4; font-weight: bold; font-size: 1em; padding: 3px 0 4px 11px;}
ul#giglist p.location {font-size: .9em; padding: 1px 0 1px 20px;}
ul#giglist p.date {font-style: italic; font-size: .8em; padding: 0 0 5px 20px;}



/* ! ARROWLIST STYLING */
/* arrow-bulleted list, found on Toucan Bird (etc?) page */

/* styles the arrowlist ul */
ul.arrowlist {
	list-style: inside url(/css_img/layout/tiny_arrow.gif);
	margin: 0 15px;
}

/* styles the arrowlist items */
ul.arrowlist li {
	padding-bottom: 4px;
	line-height: 1.2em;
}



/* ! MOREINFO STYLING */
/* a smaller text box (used with frame class) */

/* styles the moreinfo class (ul, p, etc.) */
.moreinfo {
	font-size: .85em;
	line-height: 1.25em;
	padding: 7px 10px 3px 10px; 
	margin: 6px 30px 14px;
}

/* styles the moreinfo list items */
.moreinfo li {
	padding-bottom: 6px;
}

/* styles the nested stats list */
.moreinfo .stats {
	display: block;
	padding: 5px 5px 5px 153px;
	font-family: "Gill Sans", sans-serif;
	font-size: 1.2em;
}



/* ! DEFINITION LIST STYLING */
/* a term/definition list */


dl {
	display: block;
	width: 90%;
	margin: 8px auto;
}

dt {
	font-size: 1.2em;
	color: maroon;
	padding: 0 0 3px 0;
}

dd {
	padding: 0 0 10px 18px;
	line-height: 1.2em;
	font-size: .95em;
}

/* ! REPERTOIREBOX STYLING */
/* a three-column vertical system for booking_music repertoire lists */

/* sets up a containing box (repbox) */
#repertoirebox {
	display: block;
	width: 90%;
	margin: 10px auto;
}

/* sets up a columnar floating box */
#repertoirebox ul {
	display: block;
	width: 33%;
	float: left;
	text-align: center;
}

#repertoirebox ul li.header {
	font-size: 1.2em;
	font-weight: bold;
	color: navy;
	font-style: italic;
	margin-bottom: 13px;
}

#repertoirebox ul li.song {
	margin-bottom: 9px;
}

#repertoirebox ul li.song span {
	font-size: .9em;
	color: gray;
	font-style: italic;
}



/* ! EXTERNAL LINK LIST STYLING */
/* sets up the boxes & styles for the pan_links page */

/* styles the containing ul (extbox) */
ul.extbox {
	display: block;
	width: 66%;
	height: 60px;
	border: 1px solid gray;
	background-color: white;
	margin: 8px auto;
}

/* styles the link graphic (extpic) */
ul.extbox li.extpic {
	display: block;
	float: left;
	width: 52px;
	height: 52px;
	margin: 5px;
}

/* styles the link name */
ul.extbox li.extname {
	padding: 8px 0 4px;
	font-size: 1em;
	text-indent: 3px;
	font-weight: bold;
	background-color: #e3e5e4;
	margin-bottom: 3px;
}

/* styles the link description */
ul.extbox li.extdesc {
	line-height: 1.2em;
	font-size: .8em;
	padding-left: 70px;
	font-style: italic;
	color: #333333;
}





/* ! GALLERYBOX STYLING */
/* for photo gallery displays */

/* styles the containerbox div (entire gallery area frame) */
#containerbox {
	display: block;
	margin-left: 5%;
}

/* clears the category titles of float */
#containerbox p {
	clear: both;
}

/* styles the outerbox ul (holds photo & caption) */
#containerbox ul.outerbox {
	display: block;
	float: left;
	width: 117px;
	height: 148px;
	padding: 2px;
	margin: 0 3px 11px;
	text-align: center;
}

/* styles the photocaption li (text) */
#containerbox ul.outerbox li.photocaption {
	font-size: .9em;
	color: maroon;
	margin-bottom: 4px;
}

/* styles the photobox li (imageholder) */
#containerbox ul.outerbox li.photobox {
	display: block;
	margin-bottom: 2px;
}

/* styles the photobox image outline*/
#containerbox ul.outerbox li.photobox img {
	padding: 4px;
	border: 1px solid #333333;
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;
	background-color: white;	
	vertical-align: middle;
}

/* styles the photobox image hover*/
#containerbox ul.outerbox li.photobox img:hover {
	padding: 4px;
	border: 1px solid #999999;
	border-right: 1px solid #333333;
	border-bottom: 1px solid #333333;
	background-color: white;	
}