/* Styles for Cuyamaca College Main Menu */

.skip {
	position: absolute;
	left: -100em;
}

/* style the navigation wrapper */
#ccNavWrapper {
	background: #19396b;
	color: #efefef;
	font-weight: bold;
	font-size: 11px;
	font-family: Tahoma, Helvetica, sans-serif;
	height: 2em;
	padding: 0;
	width: 100%;
	min-width: 900px;
	position: relative;
	z-index: 9999;
}

/*****************************************************************\
 *	Menu script and css adapted from
 *  http://www.kriesi.at/archives/create-a-multilevel-dropdown-menu-with-css-and-improve-it-via-jquery
\*****************************************************************/

/* This removes the indents and bullets from #ccNav and all its child-ul elements. "position:relative" is needed since we will arrange some of the contained elements with position:relative and absolute. Line-height defines the height of each list item. You could set the height attribute for your list-items to define their height, but line-height will center the link text vertically without the need to play with margins and paddings. */
#ccNav,
#ccNav ul {
	line-height: 1.5em;
	list-style-position: outside;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: relative;
}
#ccNav li {
	list-style-image: none;
	margin: 0;
	padding: 0;
	font-size: 11px;
}

/* style links */
ul#ccNav li a.ccNavTopLevel,
ul#ccNav li a.ccNavTopLevel:link, 
ul#ccNav li a.ccNavTopLevel:visited, 
ul#ccNav li a.ccNavTopLevel:active
ul#ccNav li a.ccNavTopLevel:focus {
	display: block;
	padding: 0px 22px 0 10px;
	text-decoration: none;
	background: #19396b url(/includes03/images/nav-arrow.gif) no-repeat right;
	color: #efefef !important;
}

ul#ccNav li a.ccNavTopLevel:hover {
	background-color: #efefef;
	color: #19396b !important;
	position: relative;

}

ul.ccNavSubLevel li a,
ul.ccNavSubLevel li a:link, 
ul.ccNavSubLevel li a:visited, 
ul.ccNavSubLevel li a:active {
	border-right: 1px #19396b solid;
	border-left: 1px #19396b solid;
	display: block;
	padding: 2px 10px;
	color: #19396b;
	text-decoration: none;
	background-color: #efefef;
	font-weight: normal;
}
ul.ccNavSubLevel li a:hover {
	background-color: #2c528f;
	color: #efefef;
}


/*  This will align our list elements horizontally. */
#ccNav li {
	float: left;
	position: relative;
}

/* This will position the nested Lists right beyond the main menu and give them a width of 12em. The width attribute is needed so that the list items within display vertically again. */
#ccNav ul {
	position: absolute;
	width: 22em; /* changing this affects the position of the shadow, should be 2em higher than #ccNav li ul a width */
	top: 1.6em;  /* should have the same height as the line-height for #ccNav */
	display: none;
	
	/* shadows for browsers that can handle it */
	-webkit-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.40);
	-moz-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.40);
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.40); 
	z-index: 100;
}

/* This will set the width of the hyper links to 13 em (which in combination with the width of the UL set above results in a horizontally displayed sub menu, despite the ongoing float:left) */
#ccNav li ul a {
	width: 20em; /* this changes the width of the dropdown portion */
	float: left;
}


#ccNav li:hover ul, 
#ccNav li li:hover ul, 
#ccNav li li li:hover ul, 
#ccNav li li li li:hover ul {
	display:block;
}

#ccNav li:hover ul ul, 
#ccNav li:hover ul ul ul, 
#ccNav li:hover ul ul ul ul {
	display:none;
}

.ccNavTopLevel {
	border-top: 2px #19396b solid;
	border-left: 1px #19396b solid;

}
#ccNavWrapper ul#ccNav .hover {
	background: #efefef url(/includes03/images/nav-arrow-hover.gif) no-repeat right;
	color: #19396b !important;
}
.ccNavSmallText {
	font-size: xx-small;
}
/* ccNavIndent formatting is done in the ccnav.js file */