/* 
Property of Infinite Web Ideas and Huron School District

This file contains all CSS information for the header
and for the navigation.


You can use this style if you would like. I encourage
the sharing of resources and work. However, if you mimic 
my work I will take action. Please change to suit your 
needs.

/*------------------------------
		Header/Nav
------------------------------*/


#main_container #navigation {
	position:relative;
	width:980px;
	height:47px;
	top:40px;
	z-index:1080;
}

#main_container #navigation #catch_phrase{
	position:absolute;
	float:right;
	right:-50px;
	top:-40px;
	width:219px;
	height:157px;
	z-index:3;
}

#main_container #navigation #feathers{
	position:absolute;
	float:left;
	left:-56px;
	top:-105px;
	width:126px;
	height:157px;
	z-index:3;
}

#main_container #navigation ul {	
	margin:0;
	padding:0;
}

#main_container #navigation ul li {	
	float:left;
}



#main_container #navigation ul li a {
	float:left;
	font-size:15px;
	font-weight:500;
	color: #532d18;
	text-transform:uppercase;
	text-decoration:none;
	padding:12px 7px 0 7px;
	height:47px;
}


#main_container #navigation ul li ul{	
	margin:0;
	padding:0;
}

#main_container #navigation ul li ul li a{	
	font-size:13px;
	color:#532d18;
	display:block;
	background:none;
	background-color:#fffcd1;
	width:160px;
	height:15px;
	text-transform:none;
}

#main_container #navigation ul li a:hover {
	color: #c20e0f;
}



/*------------------------------
	 Left and Right Ends
------------------------------*/
#main_container #navigation ul li .nav_left {	
	background: url("../images/nav_bg.png") repeat-x;
	width:15px;
	height:47px;
}

#main_container #navigation ul li .nav_right {	
	background: url("../images/nav_bg.png") repeat-x;
	width:100px;
	height:47px;
}


/*------------------------------
		Home Button
------------------------------*/
#main_container #navigation ul li .nav_home {	
	background: url("../images/nav_bg.png") repeat-x;
	position:relative;
	width:59px;
	height:47px;
	z-index:200;
}

#main_container #navigation ul li .nav_home:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:59px;
	height:47px;
}


/*------------------------------
		District Button
------------------------------*/
#main_container #navigation ul li .nav_district {	
	background: url("../images/nav_bg.png") repeat-x;
	width:132px;
	height:47px;
}

#main_container #navigation ul li .nav_district:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:132px;
	height:47px;
}

#main_container #navigation ul li #district{
	position:absolute;
	width:170px;
	display:none;
	background-color:#fffcd1;
	top:41px;
	left:74px;
	padding-bottom:10px;
	padding-left:5px;
	padding-right:10px;
}


/*------------------------------
		Athletics Button
------------------------------*/
#main_container #navigation ul li .nav_athletics {	
	background: url("../images/nav_bg.png") repeat-x;
	width:100px;
	height:47px;
}

#main_container #navigation ul li .nav_athletics:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:100px;
	height:47px;
}

#main_container #navigation ul li #athletics{
	position:absolute;
	width:170px;
	display:none;
	background-color:#fffcd1;
	top:41px;
	left:206px;
	padding-bottom:10px;
	padding-left:5px;
	padding-right:10px;
}


/*------------------------------
		Schools Button
------------------------------*/
#main_container #navigation ul li .nav_schools {	
	background: url("../images/nav_bg.png") repeat-x;
	width:90px;
	height:47px;
}

#main_container #navigation ul li .nav_schools:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:90px;
	height:47px;
}

#main_container #navigation ul li #schools{
	position:absolute;
	width:175px;
	display:none;
	background-color:#fffcd1;
	top:41px;
	left:306px;
	padding-bottom:10px;
	padding-left:5px;
	padding-right:10px;
}


/*------------------------------
		Parents Button
------------------------------*/
#main_container #navigation ul li .nav_parent {	
	background: url("../images/nav_bg.png") repeat-x;
	width:175px;
	height:47px;
}

#main_container #navigation ul li .nav_parent:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:175px;
	height:47px;
}



/*------------------------------
		Employment Button
------------------------------*/
#main_container #navigation ul li .nav_employ {	
	background: url("../images/nav_bg.png") repeat-x;
	width:115px;
	height:47px;
}

#main_container #navigation ul li .nav_employ:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:115px;
	height:47px;
}


/*------------------------------
		Contact Button
------------------------------*/
#main_container #navigation ul li .nav_contact {	
	background: url("../images/nav_bg.png") repeat-x;
	width:90px;
	height:47px;
}

#main_container #navigation ul li .nav_contact:hover {	
	background: url("../images/nav_bg_hover.png") repeat-x;
	width:90px;
	height:47px;
}




#main_container #sub_container #side_nav {
	float:left;
	width:200px;
	margin-top:60px;
	background: url("../images/side_navbg.jpg") repeat-y;
}

#main_container #sub_container #side_nav ul{
	padding:10px 0 0 15px;
	margin:0;
}

#main_container #sub_container #side_nav ul li{
	background: url("../images/arrow.jpg") no-repeat top left;
	padding:0 0 8px 15px;
}

#main_container #sub_container #side_nav_header {
	background: url("../images/side_navhead.jpg") no-repeat;
	width:200px;
	height:30px;
	font-size:17px;
	padding:15px 0 0 0;
	text-align:center;
}

#main_container #sub_container #side_nav_footer {
	background: url("../images/side_navfoot.jpg") no-repeat;
	width:200px;
	height:13px;
}