/* VERSIONS
/* 1_0: Primary Site Navigations
/* 1_1: Switched to sibling CSS selector [Author: Nick Hall]
----------------------------------------------------------------------------- */

/* 
-----------------------------------------------------------------------------
 =NAVIGATION
----------------------------------------------------------------------------- */

/* Default Navigation - Primarily used for navigation in #content 
----------------------------------------------------------------------------- */
.nav { }
	div.nav ul { margin: 0; padding: 0; list-style: none; }
		div.nav ul li { margin: 0; padding: 0; background-image: none; }
			.nav ul li a { display: block; }
			.nav ul ul { display: none; }
				.nav ul li.lock a { background: url(/images/common/icon_lock.gif) center right no-repeat; padding-right: 20px; }
				.nav li.showall.open li.more * { display: block !important; }

/* 
-----------------------------------------------------------------------------
 =NAV-MAIN
----------------------------------------------------------------------------- */
#nav-main {
	font-size: 1.2em;
	line-height: 1.0em;
	z-index: 100;
	position: absolute;
	top: 0;
	left: 8px;
	width: 608px;
	color: #000000;
	}
	#nav-main > ul {
		height: 45px;
		/*Set background image here the same as what you want for #nav-main ul li{}*/
		}
		#nav-main > ul > li {
			position: relative;
			float: left;
			margin: 0;
			color: #000000;
			}
			#nav-main > ul > li#nav-li-home { display: none; }
			#harritonhs #nav-main > ul > li#nav-li-home,
			#lower-merion #nav-main > ul > li#nav-li-home { display: block; }
		#nav-main > ul > li.lock { background-image: none; }
			#nav-main > ul > li > a {
				/*height: 18px;
				text-indent: -3000px;
				text-decoration: none;*/
				padding: 10px 0;
				font-family: 'EnriquetaRegular';
				font-size: 16px;
				color: #fff;
				padding: 17px 14px 17px 12px;
				background: url(/images/navigation/nav-main-dividers.gif) right 50% no-repeat;
				}

			/* Use favelets to generate this: http://schoolsuite.silverpoint.net/prodmisc/favelets.aspx	*/

			#nav-main ul li ul {
				width: 171px;
				position: absolute;
				z-index: 200;
				background: url(/images/navigation/navmain-dropbot.png) 0 0 repeat;
				}
			#nav-main ul li.hover ul,
			#nav-main ul li:hover ul {
				display: block;
				}
				#nav-main ul ul li {  }
				#nav-main ul ul li.first-child { background: url(/images/navigation/navmain-droptop.gif) 0 0 no-repeat; }
					#nav-main ul ul li a {
						position: relative;
						left: 0;
						padding: 0.5em;
						text-transform: uppercase;
						color: #c2c2c2;
						font-family: 'allerregular';
						font-size: 11px;
						padding: 7px 5px;
						border-bottom: 1px solid #6f3f4a;
						margin: 0 10px;
						}
						#nav-main ul ul li.first-child a { padding-top: 20px; }
						#nav-main ul ul li.last-child a { border: none; padding-bottom: 14px; }
						#nav-main ul ul li a:hover { color: #fff; }
					#nav-main ul ul li a:hover { }
					
/* SCHOOL NAVS */

#nav-school {
	font-size: 1.2em;
	line-height: 1.0em;
	z-index: 90;
	position: absolute;
	top: 109px;
	left: 20px;
	width: 870px;
	}
	#nav-school > ul {
		background: none;
		height: 46px;
		/*Set background image here the same as what you want for #nav-main ul li{}*/
		}
		#nav-school > ul > li {
			position: relative;
			float: left;
			margin: 0;
			}
		#nav-school > ul > li.lock { background-image: none; }
			#nav-school > ul > li > a {
				padding: 14px 14px;
				color: #484848;
				text-transform: uppercase;
				font-family: AllerBold;
				text-shadow: -1px 1px #fff;
				font-size: 14px;
				line-height: 18px;
				background: none;
				}
			#nav-school > ul > li.first-child > a { padding-left: 0; }
			#nav-school > ul > li.last-child > a { padding-right: 0; }
			#nav-school > ul > li > a:hover { color: #000; }
				#nav-school ul li ul {
				width: 190px;
				position: absolute;
				z-index: 200;
				background: url(/images/navigation/school-nav-drop.gif) 0 0 repeat;
				border-radius: 1px;
				-moz-border-radius: 1px;
				-webkit-border-radius: 1px;
				}
			#nav-school ul li.hover ul,
			#nav-school ul li:hover ul {
				display: block;
				}
				#nav-school ul ul li { }
					#nav-school ul ul li a {
						position: relative;
						left: 0;
						padding: 0.5em;
						text-transform: uppercase;
						color: #000;
						font-family: 'allerregular';
						font-size: 11px;
						padding: 7px 5px;
						border-bottom: 1px solid #bfbfbf;
						margin: 0 10px;
						}
						#nav-school ul ul li.first-child a { padding-top: 15px; }
						#nav-school ul ul li.last-child a { padding-bottom: 15px; border-bottom: none; }
					#nav-school ul ul li a:hover { color: #333; }

/* HEADER UTILITY MENU */

#nav-header-util {
	font-size: 1.2em;
	line-height: 1.0em;
	z-index: 100;
	position: absolute;
	top: 100px;
	right: 20px;
	height: 29px;
	width: 110px;
	}
	#nav-header-util > ul {
		height: 29px;
		list-style: none;
		margin: 0;
		/*Set background image here the same as what you want for #nav-main ul li{}*/
		}
			#nav-header-util > ul > li {
				display: block;
				height: 29px;
				width: 120px;
				background: url(/images/navigation/quicklinks.gif) 0 0 no-repeat;
				text-indent: -9999px;
				overflow: hidden;
				margin: 0;
				padding: 0;
				}
				#nav-header-util > ul > li > a {
					display: block;
					height: 29px;
					width: 120px;
					}
				#nav-header-util > ul > li:hover {
					background: url(/images/navigation/quicklinks.gif) 0 -29px no-repeat;
					}
				#nav-header-util ul ul {
					width: 190px;
					position: absolute;
					z-index: 200;
					background: url(/images/navigation/navmain-dropbot.png) 0 0 repeat;
					border-radius: 3px;
					-moz-border-radius: 3px;
					-webkit-border-radius: 3px;
					border-top: 4px solid #fff;
					}
				#nav-header-util ul li.hover ul,
				#nav-header-util ul li:hover ul {
					display: block;
					}
					#nav-header-util ul ul li { text-indent: 0; height: auto; width: 190px; }
						#nav-header-util ul ul li a {
							position: relative;
							left: 0;
							padding: 0.5em;
							text-transform: uppercase;
							color: #c2c2c2;
							font-family: 'allerregular';
							font-size: 11px;
							padding: 7px 5px;
							border-bottom: 1px solid #6f3f4a;
							margin: 0 10px;
							}
							#nav-header-util ul ul li.first-child a { padding-top: 14px; }
							#nav-header-util ul ul li.last-child a { padding-bottom: 14px; }
						#nav-header-util ul ul li a:hover { color: #fff; }
				
/* 
-----------------------------------------------------------------------------
 =NAV-CONST
----------------------------------------------------------------------------- */
#nav-const {
	line-height: 1.0em;
    z-index: 100;
	position: absolute;
	top: 0;
	right: 15px;
	z-index: 200;
	color: #000000;
	}
	#nav-const > ul {
		height: 18px;
		/*Set background image here the same as what you want for #nav-const ul li{}*/
		}
		#nav-const > ul > li {
			position: relative;
			float: left;
			margin: 0;
			font-family: 'allerbold';
			font-size: 14px;
			background: none !important;
			color: #000000;
			}
			#nav-const > ul > li > a {
				padding: 17px 8px 18px 8px;
				color: #ababab;
				}
			#nav-const > ul > li.lock > a { background: none; padding-right: 8px; }
			#nav-const > ul > li > ul > li.lock > a { padding-right: 20px; }
				#nav-const > ul > li > a:hover { color: #fff; }
			/* Use favelets to generate this: http://schoolsuite.silverpoint.net/prodmisc/favelets.aspx	*/

			#nav-const ul li ul {
				width: 171px;
				position: absolute;
				z-index: 200;
				background: url(/images/navigation/navmain-dropbot.png) 0 0 repeat;
				}
			#nav-const ul li.hover ul,
			#nav-const ul li:hover ul {
				display: block;
				}
				#nav-const ul ul li {  }
				#nav-const ul ul li.first-child,
				#nav-const ul ul li.only-child { background: url(/images/navigation/navmain-droptop.gif) 0 0 no-repeat; }
				#nav-const ul ul li.only-child a { padding: 15px 0 10px 0; }
					#nav-const ul ul li a {
						position: relative;
						left: 0;
						padding: 0.5em;
						text-transform: uppercase;
						color: #c2c2c2;
						font-family: 'allerregular';
						font-size: 11px;
						padding: 7px 5px;
						border-bottom: 1px solid #6f3f4a;
						margin: 0 10px;
						}
						#nav-const ul ul li.first-child a { padding-top: 20px; }
						#nav-const ul ul li.last-child a { border: none; padding-bottom: 14px; }
						#nav-const ul ul li a:hover { color: #fff; }
					#nav-const ul ul li a:hover { }

/* 
-----------------------------------------------------------------------------
 =NAV-SUB
--------------------------------------------------------------------------- */
#nav-sub { }
#nav-sub h2.section { 
	font-size: 16px; 
	line-height: 18px; 
	display: block; 
	color: #3e0b16; 
	padding: 0 0 17px 0; 
	margin-bottom: 18px !important;
	margin-top: -4px;
	}
#nav-sub h2.section a { color: #3e0b16; }
	#nav-sub > ul {  }
		#nav-sub ul li { border-bottom: 1px solid #ebebeb; text-transform: uppercase; font-family: 'allerregular'; font-size: 11px; }
			#nav-sub ul li a { padding: 8px 0; color: #606060; }
			#nav-sub ul li a:hover { color: #5e2834; }
			#nav-sub ul li.last-child { border: 0; }
		    #nav-sub ul ul {
			    margin: 0 0 0 12px;
			    }
		    #nav-sub li.more ul { 
			    display: none;
			    }
		    #nav-sub li.active > ul,
		    #nav-sub li.open > ul {
			    display: block;
			    }
			#nav-sub li.open > a {
				color: #5e2834; 
				}
			#nav-sub li.active > a {
				color: #5e2834; 
				}
				#nav-sub ul ul { }
				#nav-sub ul ul li { border-bottom: 1px dotted #000; text-transform: none; }
				#nav-sub ul ul li.only-child,
				#nav-sub ul ul li.last-child { border-bottom: none; }
				#nav-sub ul ul li a { color: #000; }
				    #nav-sub ul ul ul { }
					    #nav-sub ul ul ul ul { }
		
/* 
-----------------------------------------------------------------------------
 =NAV-UTIL
----------------------------------------------------------------------------- */
#nav-util {
	font-size: 1.1em;
	line-height: 1.0em;
    z-index: 100;
	position: absolute;
	top: 260px;
	right: 8px;
	width: 170px;
	}
	#nav-util > ul {
		height: 18px;
		}
		#nav-util > ul > li {
			position: relative;
			display: block;
			margin: 0 0 10px;
			}
			
			#nav-util > ul > li > a {
				color: #bfacab;
				font-size: 13px;
				line-height: 15px;
				display: block;
				}
				#nav-util > ul > li.first-child a {
				padding-top: 15px;
				border-top: 1px solid #2e0b0d;
				}
				#nav-util > ul > li > a:hover { color: #fff; }
			#nav-util ul ul {
				display: none;
				width: 190px;
				position: absolute;
				z-index: 200;
				background-color: #DDD;
				opacity: 0.9;
				-moz-opacity: 90%;
				filter: alpha(opacity=90);
				}
				/*	Don't want dropdowns in util nav
				.nav-util li.hover ul,
				.nav-util li:hover ul {
					display: block;
					}
					.nav-util ul ul li { }
						.nav-util ul ul li a {
							position: relative;
							left: 0;
							text-indent: 0;	
							padding: 0.5em;
							}
						.nav-util ul ul li a:hover { }*/

/* 
-----------------------------------------------------------------------------
 =BREADCRUMBS
----------------------------------------------------------------------------- */
#breadcrumbs {
	z-index: 90;
	clear: both;
	font-size: 90%;
	margin-bottom: 1em;
	}
	#breadcrumbs ul {
		margin: 0;
		padding: 0;
		list-style: none;
		overflow: auto;
		height: 50px;
		}
		#breadcrumbs ul li {
			float: left;
			margin: 0 8px 0 0;
			padding: 0;
			color: #606060;
			background: none;
			font-family: 'allerregular';
			font-size: 11px;
			text-transform: uppercase;
			line-height: 1em;
			}
		#breadcrumbs ul li.last-child { color: #606060; }
			#breadcrumbs ul li a { background: url(/images/common/breadcrumb-dividers.gif) right 50% no-repeat; padding-right: 11px; color: #686868; float: left; }

/* 
-----------------------------------------------------------------------------
 =LOGIN-NAV
----------------------------------------------------------------------------- */
#nav-login { }
    #nav-login h2 { }
    #nav-login ul.login-list  { }
        #nav-login ul.login-list li  { }
        #nav-login ul.login-list li.first-child  { }
        #nav-login ul.login-list li.last-child  { }
            #nav-login ul.login-list li a  { }
            #nav-login ul.login-list li a.my-messages  { }
            #nav-login ul.login-list li a.new  { font-style: italic; }
            #nav-login ul.login-list li a.my-profile  { }
            #nav-login ul.login-list li a.my-pictures  { }
            #nav-login ul.login-list li a.my-friends  { }
            #nav-login ul.login-list li a.my-groups  { }
            #nav-login ul.login-list li a.my-customize  { }
            #nav-login ul.login-list li a.login  { }
            #nav-login ul.login-list li a.forgotpw  { }
            #nav-login ul.login-list li a.changepw  { }
            #nav-login ul.login-list li a.logout  { }
			
/* 
-----------------------------------------------------------------------------
 =Social Media
----------------------------------------------------------------------------- */

#footer #nav-social ul {
			list-style: none;
			display: block;
			height: 32px;
			position: absolute;
			top: 15px;
			right: 20px;
			}
			#footer #nav-social ul li { 
				margin: 0 0 0 7px; 
				padding: 0; 
				display: block; 
				float: left; 
				 }
			
			#footer #nav-social ul li a {
				display: block; 
				height: 32px;
				width: 32px;
				text-indent: -9999px;
				overflow: hidden;
				color: #ffffff;
				}
			
			#footer #nav-social ul li#nav-li-facebook { }
			#footer #nav-social ul li#nav-li-twitter { }
			#footer #nav-social ul li#nav-li-youtube { }
			
			#footer #nav-social ul li#nav-li-facebook a { background: url(/images/navigation/social-media.gif) 0 0 no-repeat; }
			#footer #nav-social ul li#nav-li-facebook a:hover { background: url(/images/navigation/social-media.gif) 0 -32px no-repeat; }
			
			#footer #nav-social ul li#nav-li-twitter a { background: url(/images/navigation/social-media.gif) -32px 0 no-repeat; }
			#footer #nav-social ul li#nav-li-twitter a:hover { background: url(/images/navigation/social-media.gif) -32px -32px no-repeat; }
			
			#footer #nav-social ul li#nav-li-youtube a { background: url(/images/navigation/social-media.gif) -64px 0 no-repeat; }
			#footer #nav-social ul li#nav-li-youtube a:hover { background: url(/images/navigation/social-media.gif) -64px -32px no-repeat; }