@charset "utf-8";
/* web page designed by Tristan Denyer (tristandenyer.com)
   for College Theatre Council of Greater St. Louis (collegetheatrecouncil.org & collegetheatrecouncil.com)
   (c) copyright 2009.  All rights reserved.
   
   Thanks goes out to SlideShowPro Flash component for making the gallery construction easier.
   - http://slideshowpro.net/  */

html,body{margin:0;padding:0;background:#FFF}

/* Controls the highlight color for when you highlight text with the cursor - does not work in all browser; just the good ones */
::-moz-selection{background:#046c75;color: #FFF;} 
::selection {background:#046c75;color: #FFF;} 

/* Removes that annoying dotted line from links */
a, img {outline:none; border:none;}

body{font: 85% arial,sans-serif;text-align:left;}

#wrapper {width:946px;margin:0 auto;}

#header {width:946px; height:112px;margin:0;}

.green_bar {clear:both;width:100%; margin:10px 0; height:8px;background-color:#046c75;}

/* for the [ view PDF ] text */
.pdf_text {font-size:70%;}

h1 {font-weight:500;font:200% "Trebuchet MS", Arial, Helvetica, sans-serif;color:#999;margin:10px;}
h1 a:link, h1 a:visited, h1 a:visited {text-decoration:none;color:#999;}
h1 a:hover {text-decoration:none;color:#666;}
h2 {font:130% Arial, Helvetica, sans-serif;color:#999;margin:10px 0 10px 12px;}
h3 {font:95% Arial, Helvetica, sans-serif;color:#333;margin:10px 0 10px 0;font-weight:bold;}
h4 {font:95% Arial, Helvetica, sans-serif;color:#C00;margin:10px 0 10px 0;font-weight:bold;}

#menu {width:100%; margin:0; height:40px;background-color:#046c75;}
#menu ul {margin:0;padding:5px 0 0 0;width:946px;list-style-type:none;font:80% Arial, Helvetica, sans-serif;}
#menu li {display:inline;margin:0;padding:0;}
#menu a:link, #menu a:visited {color:#FFF;background-color:#046c75;margin:0 -3px 0 0;padding:5px 28px 21px 7px;text-decoration:none;border-right:3px solid #FFF;}
#menu a:hover, #menu a:active {color:#FFF;background-color:#82b5b9;padding:5px 28px 21px 7px;text-decoration:none;border-right:3px solid #FFF;color:#333;}

/* This is the backup image for when Flash does not load or is blocked */
#gallery {width:946px;height:256px;margin:1px 0;background:#FFFFFF url(../images/gallery_1.jpg);}

#column_right {width:313px;margin:0;float:right;background:#FFF;}

.questions a:link, .questions a:visited {color:#333;text-decoration:none;line-height:1.7em;}
.questions a:hover, .questions a:active {color:#046c75;text-decoration:underline;line-height:1.7em;}
.questions span {color:#F00;}

/* cheap fix to push the "share" box down on the Contact page */
.spacer {height:7px;}

#column_left {width:606px;margin:0 0 10px 0;padding:0;background:#FFF;}
.section_header_who {width:606px;height:49px;margin:8px 0 0 0;padding:0;background:#FFF url(../images/who_hdr.gif) top no-repeat;}
.section_header_projects {width:606px;height:48px;margin:8px 0 0 0;padding:0;background:#FFF url(../images/projects_hdr.gif) top no-repeat;}
.section_header_members {width:313px;height:48px;margin:8px 0 0 0;padding:0;background:#FFF url(../images/members_hdr.gif) top no-repeat;}
.section_header_questions {width:313px;height:48px;margin:8px 0 0 0;padding:0;background:#FFF url(../images/questions_hdr.gif) top no-repeat;}
.section_header_share {width:313px;height:48px;margin:0;padding:0;background:#FFF url(../images/share_hdr.gif) top no-repeat;}

#bit_url {padding:20px 11px;color:#666;font: 65% Arial, Helvetica, sans-serif;text-align:left;}
#bit_url textarea:focus {background-color:#FF9;}
#bit_url button {float:right;margin:5px;}
#bit_url img{float:right;margin:10px 10px;}
#bit_url textarea {margin:7px 0 0 0;padding:4px;}

.who p, .questions p {margin:10px 12px 22px 13px;}

/* style for the plays names when italicized */
p i {line-height:1.8em;font-family:Georgia, "Times New Roman", Times, serif;}

#column_right ul {margin:10px 0 22px 0;}
#members_list li {margin:0;padding:0 0 0 5px;list-style-image:url(../images/list_arrow_gray.gif);line-height:1.7em;color:#666;}
#members_list li:hover {margin:0;padding:0 0 0 5px;list-style-image:url(../images/list_arrow_green.gif);line-height:1.7em;}
#members_list a:link, #members_list a:visited {text-decoration:none;color:#666;}
#members_list a:hover, #members_list a:active {text-decoration:underline;color:#046c75;}

.event_box_wrapper {width:560px;margin:0 0 25px 0;float:right;border-top:2px solid #ccc;border-bottom:2px solid #ccc;}
.event_box_left {width:475px;float:right;}
.event_box_left a:link, .event_box_left a:visited {color:#666;}
.event_box_left a:hover, .event_box_left a:active{color:#046c75;}
.event_box_sidebar {width:85px;float:right;}

/* creates and styles the Google Map button - there is no image for this, pure CSS */
.google_map a:link, .google_map a:visited {width:80px; margin:8px 0;padding:2px;background:#84a1c2;font:9px Arial, Helvetica, sans-serif;color:#FFF;float:right;text-align:center;text-decoration:none;}
.google_map a:hover, .google_map a:active {width:80px; margin:8px 0;padding:2px;background:#094485;font:9px Arial, Helvetica, sans-serif;color:#FFF;float:right;text-align:center;text-decoration:none;}

/* creates and styles the Campus Map button - there is no image for this, pure CSS */
.campus_map a:link, .campus_map a:visited {width:80px; margin:0 0 8px 0;padding:2px;background:#cc7f7f;font:9px Arial, Helvetica, sans-serif;color:#FFF;float:right;text-align:center;text-decoration:none;}
.campus_map a:hover, .campus_map a:active {width:80px; margin:0 0 8px 0;padding:2px;background:#990000;font:9px Arial, Helvetica, sans-serif;color:#FFF;float:right;text-align:center;text-decoration:none;}

#footer {clear:both;width:946px;height:50px;}
#footer span {font-size:70%;color:#666;}
#footer .span2 {font-size:70%;color:#666;float:right;}
#footer .span2 a:link, #footer .span2 a:visited {color:#666;}
#footer .span2 a:hover, #footer .span2 a:active {text-decoration:none;background-color:#900;color:#FFF;}
#footer span a:link, #footer span a:visited {text-decoration:none;color:#666;}
#footer span a:hover, #footer span a:active {text-decoration:none;background-color:#046c75;color:#FFF;}

/* Share button sprite/rollover class */ 
.rollover { margin:10px 0 0  0;display:block; height:48px; } 
a.rollover:link, a.rollover:visited, a.rollover:active { background:url(../images/share_sprite.gif) no-repeat; } 
a.rollover:hover { background-position:0 -48px;}

/* Lightbox controls - leave alone unless you really know what you are doing*/
#lightbox{position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center;	line-height: 0;}

#lightbox a img{border: none;}

#outerImageContainer{position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;}

#imageContainer{padding: 10px;}

#loading{position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0;}

#hoverNav{position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10;}

#imageContainer>#hoverNav{left: 0;}

#hoverNav a{outline: none;}

#prevLink, #nextLink{width: 49%; height: 100%; background: transparent url(../images/blank.gif) no-repeat;
    /* Trick IE into showing hover */
	display: block;}
	
#prevLink {left: 0; float: left; border:none;}

#nextLink {right: 0; float: right; border:none;}

#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; border:none; }

#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; border:none; }

#imageDataContainer{font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em;}

#imageData{padding:0 10px; color: #666;}

#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	

#imageData #caption{ font-weight: bold;	border:none; }

#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}	

#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	border:none; }	
		
#overlay{position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000;}	


/* Min-Width */
.lbWidth { 
    /* most browsers */
	position: absolute;	top: 0px; left: 0px; width: 100%; min-width: 790px;}

* html .lbContent { 
    /* IE6 */
	margin-left: -790px; position:relative;}

* html .lbMinWidth { 
    /* IE6 */
	padding-left: 790px;}


/* Clearfix */	
.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 */ 
	
<!--[if lte IE 6]>
#nav {position:absolute; z-index:1;}
<![endif]-->
/* END lightbox */

/* All form elements are within the definition list for this example */
dl {font:normal 12px/15px Arial; position: relative; width: 350px;}
dt {clear: both;float:left; width: 130px; padding: 4px 0 2px 0; text-align: left;}
dd {float: left; width: 200px; margin: 0 0 8px 0; padding-left: 6px;}