/* CSS Document styles for home page  */
/* Keep footer at bottom of window - the settings in THIS css work when there is LOTS of text in the document
   If there's not much text, then check out 'home_shortText.css'  */

/* ZERO MARGINS 
--------------------------------------------------------*/
html, body, p, img, h1, h2, h3, h4, ul, ol, li { margin: 0; padding: 0; border: 0;}
/* sets document size so footer can be stuck at bottom of window */
/* from http://www.sitepoint.com/forums/showpost.php?p=1239966&postcount=3 */
/* commented backslash hack \*/
html, body { height: 100%; }
/* end hack*/	
html, body { margin: 0; padding: 0; }
body { text-align: center; }
/* this defines the document, which holds all other divs */
#document { min-height: 100%; width: 100%; margin: auto; position: relative; text-align: left;} 	
* html #document { height: 100%;
	width: 100%;/* box model hack for ie5.+*/
	w\idth:100%; }

/* LAYOUT
--------------------------------------------------------------------------- */
/* put images in, center layout */
body { text-align: center; min-width: 1010px; background-color: #Ffffff;  
	font-family: Verdana, Arial, Helvetica, sans-serif;	 	
	}
/* unfortunately I've got a div that does nothing but put the shadow in */
#shadow { background-image: url(../images/shadow1.png); background-position: 50%; background-repeat: repeat-y; 
	}
/* holds everything; probably a duplicate of 'document' div */
#container { margin: 0 auto; width: 910px; text-align: left; background-color: #Ffffff;
	} 


/* HEADER 
--------------------------------------------------------------------------------- */
#header { padding: 20px 0 0 0; height: 55px; background-color: #Ffffff;} 
#header .strapline { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color: #999999; text-align: right; display: block;	}
#header .logo {	float: left;}

 
/* HEADER LINKS */	
#header a { text-decoration: none;}
#header a:link { color: #666666;}
#header a:visited { color: #999999;}
#header a:hover, #header a:focus { color: #004d5b; outline: 0;}	


/* BANNER (banana) and NEWS
-------------------------------------------------------------------------------*/

#banana { margin: 20px 0 20px 0; clear: both; overflow: hidden;	}

.special { margin-left: 20px; margin-top: 5px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 0.95em; }
.special a { text-decoration: none;}
.special a:link { color: #666666;}
.special a:visited { color: #999999; }
.special a:hover, .special a:focus { color: #63989d;}

#newshead { width: 60px; height: 25px; padding: 5px 5px 0px 5px; 
	background:#eed777 url(../images/background_news.jpg) repeat-x;
	color: #000000; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; text-align:right;
	float:left;	}

#news { width: 835px; height: 25px; padding: 5px 0 0 5px;  margin-bottom: 20px;
	background:#eed777 url(../images/background_news.jpg) repeat-x;
	color: #000000; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; 
	float:right;}
	
.news {color: #000000; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; }
	
/* JS TICKER STYLES for news div  */
/* if dropcontentsubject div isn't present, then the ticker text doesn't display */
/* these are redefined for IE7, conditional comments in home page */
#dropcontentsubject{ width: 1px; height:0px; } 
.dropcontent{ width: 835px; height: 20px; background: transparent; color: #FFFFFF; display:block; overflow: hidden; }

#news a, #news a:link, #news a:visited, #news a:hover, #news a:active { color: #000000; }
#news a:hover { color: #FFFF00; }



/* BODY  -- this will be for the middle column
------------------------------------------------------------- */
#body {
	width: 490px; /*490px-125px=340px;*/
	float: right;
	margin: 0 0 20px 0;
	}
#body .heading {
	background-image: url(../images/background_heading.jpg); height: 33px;
	background-repeat: repeat-x;
	background-color: #004d5b;
	color:#FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	letter-spacing: 0.25em;
	padding: 8px 0 1px 1em;
	margin-bottom: 12px;
	}
#body p {
	font-family: Verdana, Arial, Helvetica, sans-serif;	color: #666666;
	font-size: 9pt;
	line-height: 1.5;
	margin-bottom: 12px;
	padding-left: 1em;
	width: 450px;
	}
#body h2 {
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 11pt;
	letter-spacing: 0.15em;
	color: #666666;	
	padding: 1.5em 0 0.5em 0;
	}	
.space {padding: 0 10px 5px 0;}
	
/* BODY & FOOTER LINKS 
----------------------------------------------------------- */
#body a, #footer a, #shows a { text-decoration: none;}
#body a:link, #footer a:link, #shows a:link { color: #666666;}
#body a:visited, #footer a:visited, #shows a:visited { color: #999999; border-bottom: 1px dashed #999999;}
#body a:hover, #footer a:hover, #shows a:hover,
#body a:focus, #footer a:focus, #shows a:focus { color: #63989d; border-bottom: 1px dashed #63989d; outline: 0;}	

/* trying to get the RSS feed buttons to NOT have the dashed underline */
#rss { }
#rss a:link, #rss a:visited, #rss a:hover, #rss a:active {border: 0 none; !important }

/* MENU -- in left column
------------------------------------------------------------- */
#menu {
	width: 185px;
	margin-right: 25px;
	float: left; 
	}
#menu ul {	padding: 0; margin: 0;	list-style: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt; font-weight: bold;
	color: #63989d;
	}
#menu li {	padding-bottom: 5px;	}
#menu li a:link { text-decoration: none; color: #666666; border-bottom: 1px dashed #666666; outline: 0;} 
#menu li a:visited { text-decoration: none; color: #999999; border-bottom: 1px dashed #999999; outline: 0;	}
#menu li a:hover,#menu li a:focus {	color: #63989d; border-bottom: 1px dashed #63989d; outline: 0;	}

/*for submenu*/
#menu ul ul {
	list-style: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt; font-weight: normal;
	}
#menu ul ul li { padding-bottom: 5px; }
#menu ul ul ul li {           /* added for 3rd level list */
	padding-left: 15px;       /* nov 3 2008 */
	}						  /* just watch the word length! */
	
#menu ul ul a:link, #menu ul ul a:visited { text-decoration: none; color: #999999; }
#menu ul ul a:hover { color: #63989d; outline: 0; }


/* HH -- left side in the Menu div under menu
--------------------------------------------------------------------------------- */
#hh { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 0.8em; color: #666; }

#hh .caps { margin-top: 50px; padding: 5px; }
#hh img, #hh a { border:0; text-decoration: 0; outline: 0;}

#hh li.first { margin-top: 50px;}
#hh li { padding-bottom: 5px; font-size:0.8em; }
#hh li a:link, #hh p a:link { text-decoration: none; color: #999; }
#hh li a:visited, #hh p a:visited { text-decoration: none; color: #CCC; }
#hh li a:hover, #hh li a:focus, #hh p a:hover, #hh p a:focus { text-decoration: none; color: #004d5b; outline: 0; }



/* SHOWS -- in right column
--------------------------------------------------------------------------------- */
#shows {
	width: 185px;
	margin-left: 25px;
	float: right;
	/*border-left: dashed 1px #ccc;*/
}
#shows p { 
	font-family: Verdana, Arial, Helvetica, sans-serif;	color: #666666;
	font-size: 8pt;
	line-height: 1.5;
	margin-bottom: 12px;
}

#shows .heading {
	background-image: url(../images/background_heading.jpg); height: 33px;
	background-repeat: repeat-x;
	background-color: #004d5b;
	color:#FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12pt;
	letter-spacing: 0.25em;
	padding: 8px 0 1px 1em;
	margin-bottom: 12px;
}

#shows .name { 
	font-weight: bold; 
	margin: 20px 1px 0 1px;
	padding: 3px;
	background-color: #FFF;
	display: block;
}

#shows a { text-decoration: none;	}
#shows a:link { color: #63989d; border-top: 1px dashed #63989d; border-bottom: 1px dashed #63989d;}
#shows a:visited { color: #004d5b; border-top: 1px dashed #63989d; border-bottom: 1px dashed #63989d;}
#shows a:hover, #shows a:focus { color: #63989d; outline: 0; background-color: #FFF; border-top: 1px dashed #63989d; border-bottom: 1px dashed #63989d;}	



/* SPECIALS
--------------------------------------------------------------- */
.clearit { clear: both; width: 100%; }
/* #body .drupa { font-size: 8pt; line-height: 1.3;}
.drupaname { font-size: 20pt; display: block;} */
.spaceright { padding-right: 10px;}
#box {
	width: 400px;
	border: dashed 1px #999999;
	padding: 5px;
	}
#box .wide { width: 400px; !important }
/* When DR&D is used in heading font, it's ugly. Use this as span to set font for ampersand to verdana  */
.ampfont { font-family: Verdana, Arial, Helvetica, sans-serif; }

.floatRight { float: right; padding-left: 10px; }
.floatLeft { float: left; padding-right: 10px; }

/* NO PRINT elements
-----------------------------------------------------------*/
/* I don't actually have a class defined. I just add 'noprint' to the class of an element that I don't want to print. Then in the print.css, .noprint is set to display:none, so those items don't print. */
.noprint { }

/*FOOTER 
------------------------------------------------------------ */
#clearfooter { clear: both; width: 100%; }
#footer { 
	width: 100%; 
	position: relative;
	border-bottom: solid 5px #004d5b;
	padding-top: 20px;

	}	
#footer p { 
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 8pt; color: #666666; 
	text-align: center; 
	padding: 0 0 5px 0;
	}
#aboutus { margin: 0 auto; width: 580px; text-align: left; }
#aboutus .about{
	padding-bottom: 20px;
	text-align: left;
	font-size: 9pt;
	color: #8D8D8D;
	line-height: 1.3;
	text-indent: -20px;
	}