/* CSS Styles Only */

body {
	background: #e6dc09 url(../images/website/body_bkgnd.gif) no-repeat center top; /*added to be sure nothing is "showing through" the main areas while testing... can be changed back to white if you'd like */
	color: #000;
	}

/* Current Page Indicator: This part of the CSS allows the menu item to display in its highlighted state when the page is loaded. The highlighting is implemented this way (in the CSS) so that the navigation stays as live text -- not javascript, flash or DHTML is used.

Note: if you add more than ten menu items for levels 1 & 2, copy and edit accordingly */

/*begin current page indicator for Level1*/

/*Current page indicator normal state for Level 1 menus. These styles override .nav styles for current page. */
body#level1_1_page li#level1_1 a, body#level1_2_page li#level1_2 a, body#level1_3_page li#level1_3 a, body#level1_4_page li#level1_4 a, body#level1_5_page li#level1_5 a, body#level1_6_page li#level1_6 a, body#level1_7_page li#level1_7 a, body#level1_8_page li#level1_8 a, body#level1_9_page li#level1_9 a, body#level1_10_page li#level1_10 a {
  	background: transparent;
  	color: #900;
	font-weight: bold;
	}

/*Current page hover state highlight for Level1 menus. These styles override .nav styles for current page. */
body#level1_1_page li#level1_1 a:hover, body#level1_2_page li#level1_2 a:hover, body#level1_3_page li#level1_3 a:hover, body#level1_4_page li#level1_4 a:hover, body#level1_5_page li#level1_5 a:hover, body#level1_6_page li#level1_6 a:hover, body#level1_7_page li#level1_7 a:hover, body#level1_8_page li#level1_8 a:hover, body#level1_9_page li#level1_9 a:hover, body#level1_10_page li#level1_10 a:hover {

  	background: transparent;
  	color: #5273c6;
	font-weight: bold;
	}
	
/*Inheritance block. Keeps level2 from inheriting level1 styles. Styles here should match ".nav ul a" */ 
body#level1_1_page li#level1_1 ul a, body#level1_2_page li#level1_2 ul a, body#level1_3_page li#level1_3 ul a, body#level1_4_page li#level1_4 ul a, body#level1_5_page li#level1_5 ul a, body#level1_6_page li#level1_6 ul a, body#level1_7_page li#level1_7 ul a, body#level1_8_page li#level1_8 ul a, body#level1_9_page li#level1_9 ul a, body#level1_10_page li#level1_10 ul a {
  	background: transparent;
  	color: #5273c6;
	
	}

/*begin persistent page indicator for level2*/

/*Current page indicator normal state for Level2 menus. These styles override .nav styles for current page. */ 
body#level2_1_page li#level2_1 a, body#level2_2_page li#level2_2 a, body#level2_3_page li#level2_3 a, body#level2_4_page li#level2_4 a, body#level2_5_page li#level2_5 a, body#level2_6_page li#level2_6 a, body#level2_7_page li#level2_7 a, body#level2_8_page li#level2_8 a, body#level2_9_page li#level2_9 a, body#level2_10_page li#level2_10 a {
  	background: transparent;
  	color: #900;
	font-weight: bold;
	}
	
/*Current page hover state highlight for Level 2 menus. These styles override .nav styles for current page. */
body#level2_1_page li#level2_1 a:hover, body#level2_2_page li#level2_2 a:hover, body#level2_3_page li#level2_3 a:hover, body#level2_4_page li#level2_4 a:hover, body#level2_5_page li#level2_5 a:hover, body#level2_6_page li#level2_6 a:hover, body#level2_7_page li#level2_7 a:hover, body#level2_8_page li#level2_8 a:hover, body#level2_9_page li#level2_9 a:hover, body#level2_10_page li#level2_10 a:hover {
  	background: transparent;
  	color: #900;
	font-weight: bold;
	}

/*Inheritance block. Keeps level2 menu highlight from inheriting the level1 indicator highlight. This should be the same as ".nav ul a:hover"*/
body#level2_1_page li#level2_1 ul a, body#level2_2_page li#level2_2 ul a, body#level2_3_page li#level2_3 ul a, body#level2_4_page li#level2_4 ul a, body#level2_5_page li#level2_5 ul a, body#level2_6_page li#level2_6 ul a, body#level2_7_page li#level2_7 ul a, body#level2_8_page li#level2_8 ul a, body#level2_9_page li#level2_9 ul a, body#level2_10_page li#level2_10 ul a, body#level1_3_page li#level1_3 ul a:hover, body#level1_2_page li#level1_2 ul a:hover, body#level1_1_page li#level1_1 ul a:hover, body#level1_4_page li#level1_4 ul a:hover, body#level1_5_page li#level1_5 ul a:hover, body#level1_6_page li#level1_6 ul a:hover, body#level1_7_page li#level1_7 ul a:hover, body#level1_8_page li#level1_8 ul a:hover, body#level1_9_page li#level1_9 ul a:hover, body#level1_10_page li#level1_10 ul a:hover {
  	background: transparent;
  	color: #900;
	}
/*End Current Page Indicator section */


html>body #outer_container { /* This creates the shadow effect around the container */
	position:relative;
	width: 800px;
	margin: 0 auto;
	background-image: url(../images/website/wrapper_shadow.png);
	background-repeat: repeat-y;
	background-position: left top;
	background-color: transparent;	
	}
	
	
#container { 
	
	background: transparent;
	padding: 0;
	margin: 0;
	}
	
/* start college or department identifier area */

#unit_banner {
	/*background: #000; -- if the image is not as large as the width of the design, set the background to be the same as the image background */
	}
	
#unit_banner img {display: block; } /*required to avoid a small gap underneath the banner image that can occur (randomly in IE) due to the image being treated as inline content */

/* end college or department identifier area */



/* Start wrapper and page_body. Wrapper and page_body are for everything after the top navigation area and before the footer. These contain the graphics to create the column backgrounds. Modify graphics as needed. */
#wrapper {
	background-color: #fff;
	background-image: url(../images/website/background780_white.gif);
	background-repeat: repeat-y;	
	}
.fixed1B #wrapper, .fixed3B #wrapper { /* This removes (overwrites) first column when there is no leftbar_holder*/
	background-color: #FFF;
	background-image: url(../images/website/background780_white.gif);
	background-repeat: repeat-y;
	}


.fixed3A #wrapper, .fixed3B #wrapper, .fixed4A #wrapper, .fixed4B #wrapper {
	margin-top: 10px;
	/*border-top: none; uncomment this to remove the border above the content area */
}
#page_body {
	padding: 0; /* may need to adjust top padding to accommodate background design */
	color: #000;
	margin: 0;
	/*background: #fff;  can add a background image here */
	}
/* end wrapper and page_body */


/* top primary navigation */

#primary_nav {
	padding: 10px;
	color: #900;
	background-color: #b5c8e7;
	font-weight: bold;
	font-size: 90%;
	background-repeat: repeat-x;
	background-position: left top;

}


#primary_nav a {color: #036; text-decoration: none;}
#primary_nav a:link {color: #036;}
#primary_nav a:visited {color: #036;}
#primary_nav a:hover {color: #900; }
#primary_nav a:active {color: #036;}


#primary_nav ul {

	margin: 0;
	padding: 0;
	padding-bottom: 5px;
	display: inline;
	margin-left: 10px;
	
	}

#primary_nav li {

padding: 5px 15px 5px 0;
list-style: none;
display: inline;
color: #900;
font-weight: bold;

}

/* end of top primary navigation */


/* start side navigation ul ---------------------------------------------------------*/


#leftbar_holder {

background: #edf5fe url(../images/website/leftbar_bkgnd.gif) no-repeat;/*this is for the top left navigation background */
border-top: 18px solid #fff;
border-left: 15px solid #fff;

}



.nav, .nav ul {
	padding: 0;
	margin-bottom: 0; /* this is here to keep the second nested UL from inheriting the bottom margin given to the main UL below ... it must come before the .nav selector below */
	list-style: none;
	font-size: 80%;
	
	}
.nav {
	padding: 20px 0 0 0;
	margin-bottom: 15px !important;
}
.nav li { 
	padding: 0;
	padding-bottom: 5px;
	
	 }
.fixed1A li#level1_1, .fixed1B li#level1_1, .fixed2A li#level1_1, .fixed2B li#level1_1, .fixed3A li#level1_1, .fixed3B li#level1_1, .fixed4A li#level1_1, .fixed4B li#level1_1 {
	border-top: none; /* The first selector in this group removes the top border on the first nested LI so that visually, it's even across the top. Comment this out if you want the border to appear.*/
}
.nav a {
	display: block;
	padding: 3px 10px;
	color: #036;
	background: transparent;
	text-decoration: none;
	}

.nav a:hover {
	color: #5273c6;
	background: transparent;
	text-decoration: none;
	}

.nav ul li { padding: 0; 
			 margin: 0;
 }

.nav ul a {
	display: block;
	padding: 3px 5px 3px 10px;
	margin: 0 0 0 5px;
	color: #036;
	background: transparent;
	text-decoration: none;
	}

.nav ul a:hover {
	color: #900;
	background: transparent;
	text-decoration: none;
	}
	
	
/*end navigation ul */



/*Style to create boxes around content in rightbar and leftbar.*/
.box_leftbar {
	margin: 0px;
	padding: 0px;
	width: 159px;
	border-top: 15px solid #036;
	border-right: 1px solid #036;
	border-bottom: 1px solid #036;
	background-color:#FFF;
	}
	

/*End box style*/

#leftbar_holder img { 
	border-top: 1px solid #036; /*Add border as needed.*/
	border-right: 1px solid #036; /*Add border as needed.*/
	border-bottom: 1px solid #036; /*Add border as needed.*/
	margin: 15px 0; /*Add margin (space around image) as needed.*/
	padding: 0;
	}


/*leftbar_1 styles - this area is for inserting 158px wide images only, use leftbar_2 for all other optional content  ---------------------------------------------------------------------*/
#leftbar_1 h1 {
	font-size: 85%;
	color: #900;
	font-weight:bolder;
	margin: 8px 5px 0 5px;
	}

#leftbar_1 p {
	margin: 0!important;
	padding: 0!important;
	font-size: 70%;
	margin: 0 5px 10px 0;
	
	
	}
	
#leftbar_1 img { 
	margin: 10px 0; /*Add margin (space around image) as needed.*/
	padding: 0;
	border: 0!important;
	}	
	
#leftbar_1 a {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}
	
#leftbar_1 a:visited  {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}

#leftbar_1 a:hover {
	color: #963;
	text-decoration: underline;
	background: transparent;
	text-decoration: none;
	}

	
	/*leftbar_2 styles - use for optional links, text, or content other than images  ---------------------------------------------------*/

#leftbar_2 h1 {
	font-size: 85%;
	color: #900;
	font-weight:bolder;
	margin: 8px 5px 0 5px;
	}
	
	#leftbar_2 h2 {
	font-size: 80%;
	color: #900;
	font-weight:bolder;
	margin: 8px 5px 0 5px;
	}

#leftbar_2 p {
	color:#000;
	font-size: 70%;
	margin: 0 5px 10px 0;

	}

#leftbar_2 a {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}

#leftbar_2 a:hover {
	color: #963;
	background: transparent;
	text-decoration: underline;
	}
	
#leftbar_2 a:visited {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}

	
/*end leftbar styles*/	



/*rightbar_1 styles */ 

#rightbar_1 h1 {
	font-size: 80%;
	color: #900;
	font-weight:bolder;
	margin: 15px 5px 5px 5px;
	}
	
#rightbar_1 h2 {
	font-size: 80%;
	color: #900;
	font-weight:bolder;
	margin: 15px 5px 5px 5px;
	font-style: italic;
	}
	
#rightbar_1 p {
	color:#666;
	font-size: 70%;
	margin: 0 10px 10px 5px;
	}
	
	
#rightbar_1 a {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}

#rightbar_1 a:hover {
	color: #963;
	background: transparent;
	text-decoration: underline;
	}	
	
	
#rightbar_2 a:visited {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}	
	
/*rightbar_2 styles  --------------------------------------------------------------*/


#rightbar_2 h1 {
	font-size: 80%;
	color: #900;
	font-weight:bolder;
	margin: 8px 5px 0 5px;
	}
	
#rightbar_2 p {
	color:#666;
	font-size: 70%;
	margin: 0 5px 10px 5px;
	}
	
	
#rightbar_2 a {
	display: block;
	padding: 3px 10px;
	color: #06c;
	background: transparent;
	text-decoration: none;
	}

#rightbar_2 a:hover {
	color: #963;
	background: transparent;
	text-decoration: underline;
	}
	
	
/*end rightbar styles */

	



/* start breadcrumbs ----------------------------------------------------------*/

#content #breadcrumbs p {
	font-size: 70%;
	text-indent: 0 !important; /* this overrides the indenting of the main content's p elements */
	}

#breadcrumbs a {color: #036; text-decoration: underline;}
#breadcrumbs a:link {color: #036;}
#breadcrumbs a:visited {color: #036;}
#breadcrumbs a:hover {color: #900; text-decoration:underline; }
#breadcrumbs a:active {color: #036;}

/* end breadcrumbs */

/*start main content area. ------------------------------------------------------------*/



#content {
position: relative;
	padding: 15px 20px 15px 40px; /*Modify the second value to increase or decrease gutter space.*/
	} 
	
	
#content p {
	font-size: 90%;
	line-height: 140%;
	padding-left: 3px;
		}
	
#content h1 {
font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 130%;
	color: #900;
	font-weight: bolder;
letter-spacing: 1px;
margin: 0;
padding: 0 0 0 3px;
	}
	
#content h2 {
font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 110%;
	color: #517ee7;
	font-weight:bolder;
	}
	
#content h3 {
font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #517ee7;
	font-weight:bolder;
	font-style: italic;
	}
	
#content h4 {
font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 90%;
	color: #000;
	font-weight:bolder;
	
	}
	
	
	

#content a {color: #06c; text-decoration: none;}
#content a:link {color: #06c;}
#content a:visited {color: #06c;}
#content a:hover {color: #963; text-decoration: underline; }
#content a:active {color: #06c;}

#content ul {
	font-size: 90%;
	line-height: 140%;
	list-style: outside;
	}
	
#content ul li {
	font-size: 90%;
	line-height: 140%;
	list-style: outside;
	padding-bottom: 7px;
	}
	
#content ol {
	font-size: 90%;
	line-height: 140%;
	}
	
#content ol li {
	font-size: 90%;
	line-height: 140%;
	padding-bottom: 7px;
	}
	
#content img { 
	float: left;
	margin: 0 10px 0 0;
	padding: 3px;
	border: 1px solid #977c15;
	
	}
	
#content blockquote {

font-size: 85%;
color: #666;
}		
	
/* Table styles --------------------------------------------------------- */

#content table {
	border-collapse: collapse;
	width: 380px;  /*Maximum table width for 780 "A" layouts is 410px. Maximum table width for 780 "B" layouts is 570px. Any larger and float drop will occur. If you increase #content padding value, you will need to decrease this value or float drop will occur.*/
	font-size: small;
	color: #000;
	background-color: #cff;
	border: 1px solid #069;
	margin: 20px 0 0 0;
	}
	
#content caption {
 	font-weight: bold;
	color: #036;
	font-size: 95%;
	}

#content table th { 
	margin: 0;
	padding: 5px;
	font-weight: bold;
	font-size: 85%;
	background: #ccc;
	border: 1px solid #999;
	text-align: right;
	}

#content table td {
	margin: 0; 
	padding: 5px; 
	font-size: 85%; 
	background: #fff; 
	border: 1px solid #999;
	vertical-align: top;
	text-align: right;
	}
	

	
/* End Table styles  */	
	


/* end content area styles */
	



/* start footer ------------------------------------------------------ */

#footer {
	background-color: #fff;
	color: #666;
	font-size: 70%;
	border-top: 7px solid #eaf06f;
	border-bottom: 20px solid #758bb0;
	padding-top:3px;
	padding-bottom:3px;
	
	}

#footer p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 85%;
	margin: 2px;
	padding: 1px 10px;
	text-align:center;
	}
	
#footer a {color: #666; text-decoration: none;}
#footer a:link, #footer a:visited {color: #666;}

#footer a:hover, #footer a:active, #footer a:focus {
	text-decoration:underline;
	color: #666;
	}
	
#footer img {
padding: 0;
margin-top: 15px;
margin-right: 20px;
margin-left: 20px;

}
	
/* end footer */




