/* ---------- CSS Styles Only -------------------------------------------------------------------------- */

body {
	background: #e8dfc6; /*background color added to accommodate design */
	color: #000;
	}

/* Persistent 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 it doesn't have to be done on each individual page.
Note: if you add more than six levels, copy and edit accordingly for the persistent page indicator to work*/

/* ---------- Begin Persistent Page Indicator for Level1 Section --------------------------------------- */

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: #758BB0;
	color: #FFF;
	border-right: 3px solid #cccc99; /* allows for the right vertical border rollover */
	}

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: #758BB0;
	color: #FFF;
	border-right: 3px solid #cccc99; /* allows for the right vertical border rollover */
	}

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: #eee;
	color: #666;
	border-right: 0px;
	}

/* ---------- Begin Persistent Page Indicator for Level2 Section. 5 more were added to accommodate the faculty 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, body#level2_11_page li#level2_11 a,body#level2_12_page li#level2_12 a, body#level2_13_page li#level2_13 a,body#level2_14_page li#level2_14 a,body#level2_15_page li#level2_15 a, body#level2_16_page li#level2_16 a, body#level2_17_page li#level2_17 a {
	background: #758BB0;
	color: #413839;
	border-right: 3px solid #999966;
	}

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, body#level2_11_page li#level2_11 a:hover, body#level2_12_page li#level2_12 a:hover, body#level2_13_page li#level2_13 a:hover, body#level2_14_page li#level2_14 a:hover, body#level2_15_page li#level2_15 a:hover, body#level2_16_page li#level2_16 a:hover, body#level2_17_page li#level2_17 a:hover {
	background: #ccc;
	color: #900;
	border-right: 3px solid #999966;
	}

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#level2_11_page li#level2_11 ul a, body#level2_12_page li#level2_12 ul a, body#level2_13_page li#level2_13 ul a, body#level2_14_page li#level2_14 ul a, body#level2_15_page li#level2_15 ul a, body#level2_16_page li#level2_16 ul a,  body#level2_17_page li#level2_17 ul a {
	background: #ccc;
	color: #900;
	border-right: 3px solid #999966;
	}

/* ---------- End Persistent Page Indicator section Levels 1 & 2 --------------------------------------- */

#container{
	border-left: 1px solid #AFAF7F; /* to accommodate design */
	border-right: 1px solid #AFAF7F; /* to accommodate design */
	border-bottom: 1px solid #AFAF7F; /* to accommodate design */
	background: #fff; /*  need this so body background color doesn't show through in DW */
	}

/* ---------- Start College/Department Identifier Area ------------------------------------------------- */

#unit_banner {
	border-top: 1px solid #999; /* to accommodate design */
	background: #ebe8dc;
	}

/* ---------- End College/Department Identifier Area --------------------------------------------------- */

/* ---------- Start Primary Links -----------------------------------------------------------------------*/	

#primary_nav {
	background: #fff url(http://www.csufresno.edu/chhs/images/website/primary_nav_gradient.jpg) no-repeat; /* inserts gradient background in primary navigation bar */
	padding: 0; /* may need to adjust to accommodate background image */
	}

#primary_nav p {
	font-size: 75%; /* decreased font size */
	padding: 7px 10px;
	margin: 0px;
	color: #900;
	font-weight: bold;
	letter-spacing: 1px; /*spreads out the letters a bit */
	}

#primary_nav a {
	color: #069;
	text-decoration: none;
	}

#primary_nav a:link {
	color: #069;
	}

#primary_nav a:visited {
	color: #069;
	}

#primary_nav a:hover {
	color: #900;
	text-decoration: underline;
	}

#primary_nav a:active {
	color: #069;
	}

/* ---------- End Primary Links ------------------------------------------------------------------------ */

/* ---------- Wrapper and Page Body -------------------------------------------------------------------- */
/* ---------- Everything after the top navigation area and before the footer. These are here is to allow for some creative image backgrounds. ----------------- */

#wrapper {
	background: #fff; /* puts vertical line between left bar and content area to extend vertically to the footer */
	}

#page_body {
	padding: 0px; /* may need to adjust top padding to accommodate background design */
	color: #000;
	margin: 0;
	margin-bottom: 10px; /* adds a bit of space below the middle content area and right before the footer so the collage doesn't butt up against the footer in IEPC */
	/*background: #fff; can add a background image here */
	}

/* ---------- End Wrapper and Page Body ---------------------------------------------------------------- */

/* ---------- Start Side Navigation ul ------------------------------------------------------------------*/

.nav, .nav ul {
	padding: 0;
	margin: 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: 85%;
	}

.nav {
	margin-bottom: 15px !important;	/* the next styles allow the left bar gradient to always attach to the bottom of the navigation list, no matter how many links are placed there.  */
	background: #fff url(http://www.csufresno.edu/chhs/images/website/leftbar_bkgnd.jpg) repeat-x;
	background-position: bottom;
	padding-bottom: 250px;
	}

.nav li {
	margin: 0;
	padding: 0;
	border-top: 1px solid #FFF;
	}

.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... The last four remove the if the border is still wanted for some designs, this can be removed. If the name of the first LI element changes, these selector's ID will have to change as well. */
	}

.nav a {
	display: block;
	padding: 3px 10px;
	background-color: #900;
	color: #fff;
	font-size: 85%;
	font-weight: bold;
	text-decoration: none;
	}

.nav a:hover {
	background-color: #900;
	color: #ccc;
	margin-left: 2px;
	}

.nav ul li {
	padding: 0;
	}

.nav ul a {
	display: block;
	padding: 3px 5px 3px 20px;
	background-color: #eee;
	color: #666;
	text-decoration: none;
	}

.nav ul a:hover {
	background-color: #ccc;
	color: #900;
	text-decoration: none;
	}

/* ---------- End Side Navigation ul ------------------------------------------------------------------- */
 
/* ---------- Rightbar_1 Styles  ----------------------------------------------------------------------- */

#rightbar_1 h3 {
	font-size: 80%;
	letter-spacing: 1px; /* puts a bit of space between the letters */
	color: #900;
	font-weight: bolder;
	margin: 0px;
	padding-top: 25px;
	text-align: center;
	background: #fff url(http://www.csufresno.edu/chhs/images/website/rightbar_rounded_top.jpg) no-repeat left top; /*creates rounded graphic at the top */
	}

#rightbar_1 h4 {
	font-size: 80%;
	letter-spacing: 1px; /* puts a bit of space between the letters */
	color: #900;
	font-weight: bolder;
	margin: 0px;
	padding-bottom: 25px;
	text-align: center;
	background: #fff url(http://www.csufresno.edu/chhs/images/website/rightbar_rounded_bottom.jpg) no-repeat left bottom; /*creates rounded graphic at the bottom */
	}

#rightbar_1 p {
	color:#000;
	font-size: 70%;
	margin: 0 5px 10px 5px;
	}

#rightbar_1 a:link {
	color: #069;
	text-decoration: none;
	}

#rightbar_1 a:visited {
	color: #069;
	text-decoration: none;
	}

#rightbar_1 a:hover, #rightbar_1 a:active, #rightbar_1 a:focus  {
	color: #900;
	text-decoration:underline;
	}

#rightbar_1 ul {
	padding: 3px 10px;
	list-style: none;
	font-size: 70%;
	margin: 0;
	}

#rightbar_1 ul li {
	padding: 2px 6px;
	} /* this class is to facilitate the heading graphic and the left, right, and bottom border style in the first right bar ------------------------------------------------------ */

#rightbar_1 .box {
	margin: 0px;
	padding: 0px;
	width: 149px;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	}

#rightbar_1 .box p {
	font-weight: bold;
	text-align: center;
	padding-top: 10px;
	}

/* ---------- Rightbar_2 Styles  ----------------------------------------------------------------------- */

#rightbar_2 {
	width: 150px;
	margin-top: 20px;
	margin-bottom: 10px;
	}

#rightbar_2 h4 {
	font-size: 80%;
	letter-spacing: 1px; /* puts a bit of space between the letters */
	text-align: center;
	color: #900;
	font-weight:bolder;
	margin: 2px;
	padding-bottom: 10px;
	}

#rightbar_2 p {
	color:#333;
	margin: 2px;
	padding: 5px 0;
	padding-left: 5px;
	font-size: 70%;
	}

#rightbar_2 a:link {
	color: #069;
	text-decoration: none;	
	}

#rightbar_2 a:visited {
	color: #069;
	text-decoration: none;
	}

#rightbar_2 a:hover, #rightbar_2 a:active, #rightbar_2 a:focus {
	color: #900;
	text-decoration: underline;
	}

#rightbar_2 ul {
	padding: 0 2px;
	list-style: none;
	margin: 0;
	font-size: 70%;
	}

#rightbar_2 ul li {
	padding: 3px;
	}

#rightbar_2 img {
	border: 1px solid #ccc;
	margin-top: 10px;
	}

/* ---------- End rightbar style ----------------------------------------------------------------------- */	

/* ---------- Start Breadcrumbs -------------------------------------------------------------------------*/

#content #breadcrumbs p {
	font-size: 70%;
	margin-top: 0;
	text-indent: 0 !important; /* this overrides the indenting of the main content's p elements */
	}

#content #breadcrumbs a {
	color: #069;
	text-decoration: none;
	}

#content #breadcrumbs a:link {
	color: #069;
	}

#content #breadcrumbs a:visited {
	color: #C06;
	}

#content #breadcrumbs a:hover {
	color: #900;
	text-decoration:underline;
	}

#content #breadcrumbs a:active {
	color: #069;
	}

/* ---------- End Breadcrumbs -------------------------------------------------------------------------- */

/* ---------- Start Main Content Area. ------------------------------------------------------------------*/

#content {
	padding: 5px 10px;
	font-size: 90%; /* decreased the content text size */
	}

.fixed1B #content, .fixed3B #content {
	padding-left: 20px;
	}

.fixed2B #content, .fixed4B #content {
	padding-right: 20px;
	}

#content a {
	color: #069;
	text-decoration: none;
	border-bottom: 1px dotted;
	}

#content a:link {
	color: #069;
	text-decoration: none;
	border-bottom: 1px dotted;
	}

#content a:visited {
	color: #900;
	text-decoration: none;
	border-bottom: 1px dotted;
	}

#content a:hover {
	color: #900;
	text-decoration:none;
	border-bottom: 1px solid;
	}

#content a:active {
	color: #069;
	text-decoration: none;
	border-bottom: 1px dotted;
	}

#content p {
	font-size: 90%;
	line-height: 140%;
	}

#content h1 {
	font-size: 105%;
	color: #900;
	font-weight: bolder;
	}

#content h2 {
	font-size: 90%;
	color: #900;
	font-weight:bolder;
	letter-spacing: 1px; /*spread the letters out a bit */
	}

#content h3 {
	font-size: 90%;
	font-weight: bold;
	} /*added a third level heading to the content area */

#content ul {
	font-size: 90%;
	line-height: 140%;
	}

#content ul li {
	font-size: 90%;
	line-height: 140%;
	padding-bottom: 10px;
	}

#content ol {
	font-size: 90%;
	line-height: 140%;
	}

#content ol li {
	font-size: 90%;
	line-height: 140%;
	padding-bottom: 10px;
	}

#content img {
	float: left;
	border: 1px solid #ccc;
	margin: 5px 5px 0 5px;
	padding: 2px 2px 2px 2px;
	}

/* ---------- End content ------------------------------------------------------------------------------ */

/* ---------- Start Footer ----------------------------------------------------------------------------- */

#footer {
	font-size: 70%;
	padding-top: 1px;
	padding-bottom: 3px;	
	color: #666;
	background-color: #fff;
	margin-bottom: 0px;
	border-top: 2px solid #758BB0;
	border-bottom: 1px solid #ccc;
	}

#footer p {
	font-size: 85%;
	margin: 2px;
	color: #666;
	padding: 3px 10px;
	text-align: center;
	}

#footer a {
	color: #666;
	text-decoration: none;
	}

#footer a:link, #footer a:visited {
	color: #069;
	}

#footer a:hover, #footer a:active, #footer a:focus {
	text-decoration:underline;
	color: #069;
	}

/* ---------- End Footer ------------------------------------------------------------------------------- */