/* ---------->>> the following classes govern the style of general page elements, such as 
 text, links, images, etc. <<--------------------------------------------------------------------------------*/
 
/* ---------->>> general layout styles: <<<-------------------------------------------------------------------*/
/* ---------->>> the following styles govern the style of general layout elements that are relevant to all
layouts and are not specific to a certain type (either interior, index, flash layouts, etc.) <<---------------*/

.footerCopy {   	
	padding-left:40px;
	padding-right:50px;
	font-size:11px;
	color:#000000;
	text-decoration:none;
}

div.footerCopy p {
	color:#000000;
	padding-top:5px; 
}

/*
.imgLarge {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	width: 260px;
	text-align: right;
}
*/

.imgSmall {
	position:relative;
	float:left;
	vertical-align:top;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	width:70px;
	text-align: right;
}

/* ---------->>> sub-menu positioning styles: <<<------------------------------------------------------------------*/
/* ------------  the following styles govern the position/style/layer order of dhtml sub-menus --------------------*/	

/* [currently none] */

/* #subNav {	
	position:relative;
	top:0px;
	left:0px;
	float:left;
	text-align:left;
	width:183px;
	height:auto;	
	border:2px solid #cccccc; 
} */

/* ---------->>> sub-nav styles: <<<-------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of the sub-navigation links in the left column -----------*/	

.navPrimary {
	font-size:12px;
	font-weight:bold;
	background-image: url(../graphics/layout/icon_arrow_down.gif);
	background-repeat: no-repeat;
	background-position: left center;
	margin-left:0px;
	padding-left:15px;
	padding-bottom:0px; 
	float:left;
	border:0px solid #cccccc;
}

.navSecondary {
	font-size:12px;
	background-image: url(../graphics/layout/icon_arrow.gif);
	background-repeat: no-repeat;
	background-position: left center;
	margin-left:20px;
	padding-left:15px;
	padding-bottom:0px;
	float:left;
	border:0px dotted #666666;
}

.navSecondarySelect {
	font-size:12px;
	background-image: url(../graphics/layout/icon_arrow_down.gif);
	background-repeat: no-repeat;
	background-position: left center;
	margin-left:20px;
	padding-left:15px;
	padding-bottom:0px; 
	float:left;	
	border:0px dotted #666666;
}

/* this style below only works because the primary 'a' tag doesn't have an explicit text-decoration set. if it did,
we wouldn't be able to change it here. so instead, let's just create a fresh new '.nav' class so we can
also override the basic link color */
/* .navPrimary a, .navSecondary a, .navSecondarySelect a {
	text-decoration:none;	
} */

/* regular sub nav link styles */
a.nav:link, a.nav:visited, a.nav:active {
	text-decoration:none;	
 	color:#296DC0;
} 

a.nav:hover {
	text-decoration:none;
	color: #043167;
}
	
/* selected (on same page as this nav) sub nav link styles */
a.navSelected:link, a.navSelected:visited, a.navSelected:active, a.navSelected:hover {
	text-decoration:none;
	font-weight:bold;
	color:#296DC0;
}
	
/* ---------->>> text styles: <<<----------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of text for paragraphs, bold text, etc. ------------------*/	

div {					
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px; 
}

p {	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	padding-left:1px;
	padding-bottom:15px; 
}	
											
.bold {					
	font-style:inherit;
	font-weight:bold; 
}
						
.italic {				
	font-weight:inherit; 
	font-style:italic;
}

h1 {
	font-size:14px;
	font-weight:bold;
	color: #6999d3;
	padding-top:0px;
	padding-bottom:5px;
	border:0px #cccccc solid;
}

h2 {
	font-size: 12px;
	font-weight: bold;
	color: #666666;
	padding-bottom:5px;
}

h3 {
	font-size: 11px;
	font-weight: bold;
	color: #666666;
	padding-bottom:5px;
}

.detailText {			
	font-size: 11px; 
	color: #999999;
}						
						
.errorText {			
	font-size: 11px; 
	font-weight:bold;
	color: #cc0000;
}
															
/* regular link styles */
a:link, a:visited, a:active {
	color: #296DC0;
	text-decoration:underline;
}

a:hover {
	color: #043167;
}

a.footer {
	text-decoration:none;
	font-weight:bold;
}

/* ---------->>> news teaser styles: <<<----------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance and positioning of news teasers on index page -------------------*/	

/* styles for index pages */

.feature {
	position:relative;
	top:10px;
	width:auto;
	height:auto;
	margin-bottom:0px;
}

.eventDate {
	color: #296DC0;
}

.eventTitle {
	font-size: 12px;
	font-weight: bold;
	color: #296DC0;
}

/* styles for interior pages */
.teaser {
	position:relative;
	top:30px;
	width:255px;
	height:auto;
	padding:5px 5px 5px 5px;
	border:1px solid #296DC0; /* decorative border - don't turn off */
}

.teaserText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
}

.teaserImgLeft {
	float:left; 
	margin-right:15px;
	border:0px solid #cccccc;
}

.moreLeft, moreRight a {
	text-decoration: none;
}

/* ---------->>> list styles: <<<----------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of ordered/unordered lists -------------------------------*/	

/* global white space reset forces us to style lists manually */
ul {	
	margin-left:10px;
	/* padding-left:20px; */
	text-indent:0px;
	padding-bottom:15px;
	color: #666666;
}

li {	
	list-style-type: none;
	background-image: url(../graphics/layout/icon_diamond.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 25px;
	padding-bottom: 15px;
}
		
/* ---------->>> form element styles: <<<--------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of form fields, selects, etc. ----------------------------*/			
		
div.row {
  clear: both;
  height:25px;
  overflow:visible;
  padding-top:3px;  
  border:0px dashed #ffffcc;
}

div.rowHeading {
  clear: both;
  height:15px;
  overflow:visible;
  padding-top:15px;  
  padding-bottom:2px;
  margin-bottom:3px;  
  color: #043167;
  border-bottom:2px dotted #5191cd;
}

div.rowInfo {
  clear: both;
  height:10px;
  overflow:visible;
  padding-top:15px;  
  padding-bottom:2px;
  margin-bottom:3px;  
  color: #043167;
  border-bottom:2px dotted #5191cd;
}

div.row span.formField {
  float:right;
  width:275px;
  text-align:left;
  border:0px solid #ffcccc;
} 

div.row span.formLabel {
  float:left;
  width:125px;
  padding-top:3px;
  text-align:right;
  color:#333333;
  font-weight:normal;
  border:0px solid #000000;
}

div.row span.formInfo {
	font-weight:normal; 
	font-size:11px;
	color:#333333;
}

input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#000000;
	margin-top:0px;
	margin-bottom:0px;
}

input.inputSizeReg {
	width:225px; /* size of regular input field (instead of using 'size=40' in input tag) */
}

input.inputSizeSm {
	width:75px;  /* size of small input field */
}

select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width:auto;  /* don't set size of drop-down menus - let them adjust automatically to width of contents */
	color: #000000;
	margin-top:0px;
	margin-bottom:0px;
}

.radio {
	margin-top:0px;
	margin-bottom:0px;
	width:25px;
	color: #333333;
	height:100px; /* since ie pads radio buttons but ff doesn't, set height to space them the same */
	size:100px
}	

.check {
	margin-top:0px;
	padding-top:2px;
	margin-bottom:0px; 
	color: #333333;
	height:20px; /* since ie pads radio buttons but ff doesn't, set height to space them the same */
}

.formButton {			
	font-size: 12px;
	font-weight: bold;
	background-color: #666666;
	color: #ffffff;
	border: 2px solid #999999;
	margin-bottom:5px;
}
						
.popFormText {			
	font-size: 11px; 
	margin-bottom:5px;
}

/* ---------->>> table styles: <<<---------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of formatted tables for charts, etc. ---------------------*/	

/* [currently none] */	

/* ---------->>> calendar styles: <<<------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of horizontal rules other misc stuff ---------------------*/

table.calendarContainer {
	position:relative;
	width:100%;
	border:0px solid #043167;
}

td {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}
	
td.header {
	width:100%;
	height:40px;
	vertical-align:middle;	
	/* color:#296DC0; */
	color:#000000;
	font-size:16px;
	font-weight:bold;
	border:0px;
}
	
td.subheader {
	/* width:80px; */
	width:14%;
	height:30px;
	vertical-align:middle;
	font-size:12px; 
	/* color:#ffffff; */
	color:#000000;
	/* background-color:#296dc0; */
	background-color:#ffffff;
	font-weight:bold;
	border:0px solid #043167;			
}
	
td.day {
	vertical-align:top;
	left:0px;
	/* width:80px; */
	width:14%;
	height:75px;
	padding:2px;
	background-color:#ffffff;	
	/* border-top-color:#043167; */
	border-top-color:#000000;
	border-top-style:solid;
	border-top-width:1px;
	/* border-left-color:#043167; */
	border-left-color:#000000;
	border-left-style:solid;
	border-left-width:1px; 
}
	
td.today {
	vertical-align:top;
	left:0px;
	/* width:80px; */
	width:14%;
	height:75px;
	padding:2px;
	/* background-color:#d2e1ba;	*/
	/* background-color:#cccccc; */
	background-color:#ffffff; /* we don't need to highlight today on print version */
	/* border-top-color:#043167; */
	border-top-color:#000000;
	border-top-style:solid;
	border-top-width:1px;
	/* border-left-color:#043167; */
	border-left-color:#000000;
	border-left-style:solid;
	border-left-width:1px; 
}
	
td.emptyDay {
	vertical-align:top;
	left:0px;
	/* width:80px; */
	width:14%; 
	height:75px;
	padding:2px;
	background-color:#ffffff;	
	/* border-top-color:#043167; */
	border-top-color:#000000;
	border-top-style:dashed;
	border-top-width:1px;
	/* border-left-color:#043167; */
	border-left-color:#000000;
	border-left-style:dashed;
	border-left-width:1px; 
}
	
.dayNumber {	
	/* color:#296DC0; */
	color:#000000;
	padding-bottom:20px;
	font-weight:bold;
}
	
.calendarEvent {
	padding-top:10px;
	border:0px dashed #999999;
}	

.calendarEventTitle {
	font-size:10px;
	font-weight:bold;
	color:000000;
}

/* why don't these styles actually set the link color to black? it's still blue!!! */
a.eventLink:link, a.eventLink:visited, a.eventLink:active   {
	text-decoration:none;
	color:000000;
}

a.eventLink:hover {
	text-decoration:none;
	color:000000;
}

.time {
	font-size: 9px;
	font-weight: normal;
	color:#000000;	
}		

/* don't display directions link for print view (doesn't make sense) */
a.directions {
	display:none;
}						
		
/* ---------->>> miscellaneous styles: <<<-------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of horizontal rules other misc stuff ---------------------*/
	
div.rule hr { 			
	/* take out the hr element; its top/bottom margin properties are completely
	different in ff and ie. (it will display for non-css browsers.) */
	display:none;
}
			
div.ruleFooter hr { 			
	/* take out the hr element; its top/bottom margin properties are completely
	different in ff and ie. (it will display for non-css browsers.) */
	display:none;
}

/* this div wraps around and replaces the hr. */
div.rule { 				
	color:#296DC0;
	background-color: #296DC0;
	height:1px;
	margin-top:5px;
	margin-bottom:15px;
} 

div.ruleFooter { 				
	color:#000000;
	background-color: #000000;
	width:auto;
	height:1px;
	margin-top:5px;
	margin-bottom:5px;
}