/*
======================
MAIN NAVIGATION STYLES 
======================
*/

#nav {
	float: left;
	height: 46px;
}

#nav li {
	float: left;
	display: inline;
}

#nav a {
	color: #386d9c;
	display: block;  /* to increase clickable area as a's default to inline */
	float: left;
	height: 46px;
	text-align: center;
	text-decoration: none;
	width: 196px;
}

#nav a:hover {
	background: #ebedf3;
}


/*
======================================
REMOVE ALL THE TEXT FOR THE NAVIGATION
======================================
*/
#nav a#nav_el1 .navText, #nav a#nav_el2 .navText, #nav a#nav_el3 .navText,
#nav a#nav_el4 .navText, #nav a#nav_el5 .navText {display: none}


/*
=======================================================
INSERT BACKGROUND IMAGES WITH ROLLOVERS FOR THE BUTTONS
=======================================================
*/
#nav a#nav_el1 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat 0 0;}
#nav a#nav_el2 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -196px 0;}
#nav a#nav_el3 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -392px 0;}
#nav a#nav_el4 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -588px 0;}
#nav a#nav_el5 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -784px 0;}
#nav a:hover#nav_el1 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat 0 -46px;}
#nav a:hover#nav_el2 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -196px -46px;}
#nav a:hover#nav_el3 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -392px -46px;}
#nav a:hover#nav_el4 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -588px -46px;}
#nav a:hover#nav_el5 {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -784px -46px;}


/*
==========================================
CREATE AN ON STATE FOR EACH OF THE BUTTONS
==========================================
*/
#nav #nav_el1.current {background:url(/images/navigation/n_elliotLake.jpg) no-repeat 0 -46px;}
#nav #nav_el2.current {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -196px -46px;}
#nav #nav_el3.current {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -392px -46px;}
#nav #nav_el4.current {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -588px -46px;}
#nav #nav_el5.current {background:url(/images/navigation/n_elliotLake.jpg) no-repeat -784px -46px;}