@import url("calendarstyletext.css");
@import url("menubar.css");
@import url("footer.css");

/* calendarstyle.css
/* layout style sheet for calendar pages
/* nmnaturalhistory.org
/* modified: June 30 2010

/*-- 0. RESET --*/

/* Normalize margin, padding */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin: 0;  padding: 0; }

/* Normalize header font-size */
h1, h2, h3, h4, h5, h6 { font-size: 100%; }

/* Remove list-styles */
ol, ul { list-style: none; }

/* Remove borders*/
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }

/* Left-aligns text in caption and th */
caption, th { text-align: left; }

/* Remove quotation marks from q */
q:before, q:after {content: '';}

/*-- End Reset --*/



/*--Begin Document Styles--*/

/*-- 1. BODY --*/

html { text-align: center; }

body {
	position: relative;
	width: 800px;
	margin: 0 auto;
	text-align: left;
}



/*-- 2. TOP OF THE PAGE --*/

/*-- h1: Museum Logo header from generalstyle.css --*/

/*-- search_form from generalstyle.css --*/

/*-- h2: Page header --*/
h2, #body h2 {
	height: 175px;
	margin-top: 53px;
	border-top: 3px solid #FFFFFF;
	font-family: Trebuchet, Trebuchet MS, sans-serif;
	text-indent: -9999px;
	color: #FFFFFF;
}



/*-- 3. MAIN BODY --*/

/*-- container: two column layout from generalstyle.css --*/



/*-- 4. LEFT COLUMN --*/

/*-- #leftside: left column div from generalstyle.css --*/

/*-- #relatedLinks: ul of links below the calendar listing --*/

#relatedLinks { }

#relatedLinks li a:hover { }


/*-- 4a. LEFT COLUMN EVENT CALENDAR --*/

table.events_calendar {
	width: 185px; margin: 0 0 22px 22px;
	font-family: Helvetica, Verdana, Arial, sans-serif;
}


table.events_calendar th.title {
	background-color: #FFFFFF;
	color: #294C5E;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.4em;
	text-transform: uppercase;
}

table.events_calendar th.monthname {
	padding: 4px;
	height: 6px;	
	color: #294C5E;
	text-align: center;
	font-size: 13px;
	background-color: #E9EEF2;
}

table.events_calendar th.dayname{
	padding: 2px;
	height: 18px;
	border-bottom: 2px solid #75838E;
	background-color: #FFFFFF;
	color: #294C5E;
	text-align: center;
	font-size: 11px;
	font-weight: bold;
}


table.events_calendar td {
	height: 15px;
	padding: 4px;
	background-color: #E9EEF2;
	border: 1px solid #ffffff;
	color: #5D6970;
	text-align: center;
	font-size: 12px;
}

table.events_calendar td.live {	background: #f9fff9; font-weight: bold; }

div#container div#leftside table.events_calendar td.live a, a:link, a:visited, a:active {
	color: #327296;
	text-decoration: underline;
	font-family: Helvetica, Arial, sans-serif;
}

div#container div#leftside table.events_calendar td.live a:hover {
	background: #f9fff9;
	color: #003366;
	text-decoration: underline;
	font-family: Helvetica, Arial, sans-serif;
}

table.events_calendar td.dead {	background: #E9EEF2; }

table.events_calendar td.instruct {
	padding-bottom: 5px;
	background-color: #FFFFFF;
	color: #5D6970;
	text-align: left;
	font-size: 11px;
	font-weight: bold;
}





/*-- 5. RIGHT SIDE --*/

/*-- rightside: main content div --*/

#rightside {
	width: 520px;
	float: right;
	padding: 15px 30px 70px 30px;
        list-style: none;
}




/*-- breadcrumbs: breadcrumb navigation div --*/
/*-- <div#breadcrumbs>
       <span.B_crumbBox>
           <span.BfirstCrumb />...<span.BlastCrumb />
       </span>
     </div>
--*/


div#container div#rightside div#breadcrumbs {
	margin-top: -9px;
	font-family: Trebuchet, Trebuchet MS, sans-serif;
	font-size: 11px;
}

#breadcrumbs a {
	color: #3E4549;
	text-decoration: underline;
        font-size: 11px;
}

#breadcrumbs a:hover {
	color: #660000;
	text-decoration: underline;
}




.ditto_thumbnail {
        float: left;
	margin: 0 15px 0 0;
        height: 125px;
        width: 125px;
}

table {
        margin: 0 0 0 0;
        padding: 0;
}




/*-- event_list: compilation of calendar events into an ordered list
#rightside ol {
        list-style: none;
}

div#container div#rightside ol.event_list a, a:link, a:active, a:visited {
	color: #3E4549;
	text-decoration: underline;
}

div#container div#rightside ol.event_list a:hover {
	color: #660000;
	text-decoration: underline;
}

#rightside ol.event_list li.date {
	margin-top: 20px;
	padding: 5px 0 5px 15px;	
	background-color: #CED4D8;
	border-top: 3px solid #75838E;
}

div#container div#rightside ol.event_list li.date a, a:link, a:active, a:visited {
	color: #294C5E;
	text-decoration: underline;
}



#rightside ol.event_list dl {
	padding: 0 10px 10px 10px;
	background-color: #FFFFFF;
}


#rightside ol.event_list dl dt {
	padding: 7px 5px 3px 5px;
	margin: 0;
	background-color: #FFFFFF;
	border-bottom: 1px dotted #555555;
}


#rightside ol.event_list dl dd.whenwhere {
	margin: 10px 0 10px 5px;
        width: 390px;
}


#rightside ol.event_list dl dd.short_desc {
	margin: 5px 20px 5px 5px;
}


#rightside ol.event_list dl dd.description {
	margin: 5px 20px 5px 5px;
        width: 390px;
}


#rightside ol.event_list dl dd.description p {
	margin: 10px 0 10px 0;
        width: 390px;
}


#rightside ol.event_list dl dd.cost {
	margin: 0 20px 0 5px;
        width: 390px;
}


#rightside ol.event_list dl dd.cost p {
	margin: 10px 0 10px 0;
        width: 390px;
}
 --*/
