/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/drop_examples.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/*
 * Original template is at http://www.cssplay.co.uk/menus/drop_examples.html (menu5)
 * 
 * Modified by Cagdas Cubukcu <cagdas.cubukcu@csueastbay.edu> for the university template.
 *
 * Created on July, 2007 @ California State University, East Bay
 *
 */
 
/* Common styles for all browsers */

/* common style for all links and menus */
.dropdown {
	position: relative;
	float: left;
	
	height: 2em;

	margin: 0;
	padding: 0; 
	border: 0;
	
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 1em;
	text-align: left; 
	list-style-type: none;
	white-space: nowrap;	
}

/* applies to all ul's in dropdown class */
.dropdown ul {
	margin: 0; 
	padding: 0;
	border: 0;
	
	font-size: 1em;
	list-style-type: none;
}

/* the main links (the structure) -cc */
.dropdown li {
	position: relative;
	float: left;

	font-size: 1em;
	
	margin: 0;
	padding: 0; 
	border: 0;
}

/* the main links - cc */
.dropdown li a, .dropdown li a:visited {
	display: block; 
	float: left; 
	cursor: pointer; /* hack for Opera browser */		
	width: auto;
	height: 2em;
	
	margin: 0;
	margin-left: 0.7em; /* this is only for IE6 and IE5.5, for others, value is overridden below */
	padding: 0 1.1em 0 0;
	
	font-weight: bold;
	text-decoration: none; 
	line-height: 2em; 

	color: #FFF;
	background: url(http://www.csueastbay.edu/includes/template2007/images/down_arrow.gif) 100% 55% no-repeat;
	
	border-top: 0px solid #0f0;
}

/* All browsers except IE6 and IE5.5 read the line below and overrides */
html>body .dropdown li a, html>body .dropdown li a:visited {
	margin-left: 1.7em;
}

.dropdown li a.forfaculty, .dropdown li a.forfaculty:visited {
	background: none;
	
	padding-right: 0.5em;
	margin-left: 1.3em;
	padding: 0;
}

/* All browsers except IE6 and IE5.5 read the line below and overrides */
html>body .dropdown li a.forfaculty, html>body .dropdown li a.forfaculty:visited  {
	margin-left: 2.3em;
}


/* Prevents main links to turn red when mouse is over them on IE6 */
.dropdown li a:hover {
	color: #FFF;
}

/* Apply Online link at the end of the dropdown menus */
a.applyonline, a.applyonline:link,  a.applyonline:active, a.applyonline:visited {
	position: relative;
	float: left;
	
	width: 9em; width/**/:/**/8.5em; /* IE5.5 gets the first value, all others get the second value. */
	top: 0.2em;
	
	margin: 0 0 0 1.5em;
	padding: 0.2em 0.5em 0 0;
	
	font-weight: bold;
	text-decoration: none;

	color: #fff;
    background: #000 url(http://www.csueastbay.edu/includes/template2007/images/online.gif) no-repeat; 
	background-position: 100% 75%;
	white-space: nowrap;
	
	border-top: 0px solid #0f0;
}

/* This div class is implemented to fix the Apply Online image flickering in IE6 */
div.applyonline {
	position: relative;
	float: left;
	
	width: 9em; width/**/:/**/8.2em; /* IE5.5 gets the first value, all others get the second value. */
	
	margin: 0 0 0 0.5em;
    padding: 0 0 0.5em 0;

	font-weight: bold;
	text-decoration: none;
	
	color: #fff;
    background: #000 url(http://www.csueastbay.edu/includes/template2007/images/online.gif) right center no-repeat; 
}

/* Clears the <a> tag's image and leaves only <div> tag's image visible, continuing the fix for IE6 */
div.applyonline a, div.applyonline a:link, div.applyonline a:active, div.applyonline a:visited  {
    background: 0;
}

/* the main links that have drop-down menus */
.dropdown li a.drop, .dropdown li a.drop:visited {
	/* class is not in use */
}

/* drop down box (when mouse is not over, the box is invisible) */
.dropdown li ul {
	visibility: hidden; 
	position: absolute;
	overflow: hidden;

	height: 0; 
	top: 2em; 
	left: 0; 
	
	white-space: normal;
}

/* drop-down box - applies to IE5.5 and IE6 */
.dropdown table {
	margin: -0em; 
	
	border-collapse: collapse; 
	
	font-size: 1em; /* font size for IE5.5 */
}

/* fist line style for IE7 and non-IE browsers and the second line for IE5.5 and IE6 */

/* the main links */
.dropdown li:hover a,
.dropdown li a:hover {
	border:0;
	
	text-decoration: none;
}

/* drop-down box (when mouse is over, box is made visible) */
.dropdown li:hover ul,
.dropdown li a:hover ul {
	visibility: visible;
	z-index: 10000; 
	overflow: visible;
	
	width: 20em; 
	height: auto; 
	top: 2em;
	left: 1em; 
	
	border: 1px solid #999; 
	border-top: 0;

	color: #000;
	background: #fff;
}

/* links in the drop-down menus */
.dropdown li:hover ul li a,
.dropdown li a:hover ul li a {
	display: block; 
	
	width: 17.6em;
	height: auto; 
	
	/* overriding the margin defined in .dropdown li a */
	margin: 0;
	padding: 0.4em; 
	padding-right: 2em; /* used to keep the text and right arrow seperate */
	
	border-top: 1px solid #CCC;
	
	font-weight: normal; 
	text-decoration: none; 
	line-height: 1.3em; 

	color: #000;
	background: transparent; 
}

.dropdown li:hover ul li a:visited,
.dropdown li a:hover ul li a:visited {
	color: #000;
}

/* Fixes visited links being underlined on IE 5.5 and IE6 */
.dropdown li ul li a:visited,
.dropdown li a ul li a:visited {
	text-decoration: none;
}

/* for IE5.5 and IE6 */
* html .dropdown li a:hover ul li a {
	width: 20em; /* hack for IE5.5 */
	w\idth: 19.1em; /* hack for IE6 */
}

/* Drop-down links that link to a fly-out menu, when mouse is not over */
.dropdown li:hover ul li a.drop,
.dropdown li a:hover ul li a.drop {
	background: url(http://www.csueastbay.edu/includes/template2007/images/dark_east.gif) right center no-repeat;
}

/* This class is used to make the wrapping links in IE6 clickable */
.dropdown li a:hover ul li div.drop {
	width: 17.5em;
	
	margin-bottom: -0.5em;
}

/* The link in drop-down menus that links a fly-out menu, when link is active */
.dropdown li:hover ul li:hover a.drop,
.dropdown li a:hover ul li a.drop {
	/* Class is not in use */
}

/* the fly-out menu's box (when mouse is not over, box is invisible) -cc */
.dropdown li:hover ul li ul,
.dropdown li a:hover ul li a ul {
	visibility: hidden; 
	position: absolute; 
	overflow: hidden;
	
	top: -0.6em; 
	left: 20em; /* all browsers get 20em */ /* left:value   - controls where the fly-out menu appears, overridden below */
	left/**/:/**/21.5em;  /* All browsers except IE5.5 gets this value, overridden below */
	
	height: 0; 
}

/* All browsers except IE6 and IE5.5 reads the line below and overrides */
html>body .dropdown li:hover ul li ul {
	left: 20em;
}
/* At the end, IE6.6 gets 21.5em, all others get 20em left value. */

/* Drop-down boxes' links (when mouse is over) */
.dropdown li:hover ul li a:hover,
.dropdown li a:hover ul li a:hover {
	text-decoration:none;
	
	color: #FFF; /* white */
	background-color: #666; /* med grey */
}

/* The links in drop-down menus that link to a fly-out menu, when mouse is over the fly-out menu,
This style makes the link stay with the same color when Fly-out is displayed */
.dropdown li:hover ul li:hover a.drop {
	color: #FFF; /* white */
	background-color: #666; /* med. grey */
}

/* the fly-out menu's box (when mouse is over, box is made visible) -cc */
.dropdown li:hover ul li:hover ul,
.dropdown li a:hover ul li a:hover ul {
	visibility: visible; 
	z-index: 20000;
	
	width: 19em;
	height: auto; 
	
	border: 1px solid #999; 
	
	color: #000; 
	background: #fff; 
} 

/* This class gives the top links in the menus 0 top-border, so on 
top of the fly-out menus there will only dark grey border */
.dropdown li:hover ul li:hover ul li.top_link a,
.dropdown li a:hover ul li a:hover ul li.top_link a {
	border-top: 0; 
}


/* The fly-out menu that opens to the left 
If you want the fly-out menu to appear to the left, 
make the fly-out's ul tags' class "left," ex.: <ul class="left"> */
.dropdown li:hover ul li:hover ul.left,
.dropdown li a:hover ul li a:hover ul.left {
	left: -9.3em;
}

/* links in the fly-out menus */
.dropdown li:hover ul li:hover ul li a,
.dropdown li a:hover ul li a:hover ul li a {
	display: block; 
	
	height: auto;
}

/* links in the fly-out menus (when mouse is over) */
.dropdown li:hover ul li:hover ul li:hover a,
.dropdown li a:hover ul li a:hover ul li a:hover {
	text-decoration: none;
}
