﻿
/***************************/
/********* main nav *******/
/**************************/

	#nav {
		position: relative;
		height: 26px;
		width: 950px;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		/*z-index: 1000;*/
	}

	#nav li ul, #nav li ul {
		margin: 0;
		padding: 0;
		list-style-type: none;
	}


	#nav a {
		text-decoration: none;
	}

	#nav li.top { /*float the main list items*/
		margin: 0;
		float: left;
		display: block;
	}

	#nav li ul {
		display: none;
		 position: absolute;     
		 width: 212px;     
		 left: -999em; 
		 margin-left: 0px;
		/*z-index: 10000;*/
		border-top: 1px solid #0e2c44;
		font-size: 11px;
	}

	#nav li ul li {
		display: block;
		text-align: left;
		
	}

	#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
		left: auto;
		background-color: #fff;
		z-index: 1000;
		position: absolute;
	}
	
	#nav li a {
		color: #0c0c0c;
		display: block;
		/*width: 93px;*/
		padding: 8px 0px 0px 0px;
		text-align: center;
	}

	#nav li.on a {
		color: #f90;
	}

	#nav li.on ul a, #nav li.off ul a {
		/*z-index: 10000;*/
	}

	#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
		background: #c6b3a0; /*bg color*/
	}

	#nav li.on:hover ul a:hover, #nav li.over ul li a:hover { /*for ie - the specificity is necessary*/
		/*background:#2a506d;*/ /*bg hover color*/
	}

	#nav li.off a:hover, #nav li.on a:hover { 
		/*background-color: #2a506d;*/ /*bg hover color*/
	}
	
	#nav li.off:hover ul, #nav li.over ul, #nav li.on:hover ul {
		display: block;
		z-index: 1;
	}
	
	#nav li.off ul a, #nav li.on ul a {
		display: block;
		background: #c6b3a0;/*#123b5a;*/ /*bg color*/
		color: #0c0c0c;
		font-weight:normal;
		border-bottom: 1px solid #0e2c44;
		padding: 6px 5px 6px 13px;
		margin: 0px;
		width: 194px;
		z-index: 3;
	}
		
	ul.drop {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
	}
	
    /*do the image replacement*/

	#nav li span 
	{
		/*display: none;*/
	}
	
	#nav_home {
		padding-left: 0px;
	}

	#nav_home a, #nav_aboutus a, #nav_jobs a, #nav_brewery a, #nav_parties a, #nav_enjoy a, #nav_offers a, #nav_menus a, #nav_links a, #nav_map a, #nav_contact a {
		display: block;
		position: relative;
		margin: 0px;
		padding: 0px;
		border-left: 1px solid #ebe4de;
		border-right: 1px solid #c7c2bc;
		/*background: url(../images/nav.gif) no-repeat; contains all hover states*/
	}

	a.top {
		height: 26px;
		width: 38px;
	}
	
	/*first, put the initial states in place*/

	#nav_home a {  width: 119px; }
	#nav_home.on a { /*background-position: 0px -68px;*/ }
	#nav_home a:hover, #nav_home:hover a, #nav_home.over a { /*background-position: 0px -34px;*/ }

	#nav_aboutus a {  width: 114px; background-position: -119px 0; }
	#nav_aboutus.on a { background-position: -119px -68px; }
	#nav_aboutus a:hover, #nav_aboutus:hover a, #nav_aboutus.over a { /*background-position: -119px -34px;*/ }

	#nav_enjoy a {  width: 115px; background-position: -233px 0; }
	#nav_enjoy.on a { background-position: -233px -68px; }
	#nav_enjoy a:hover, #nav_enjoy:hover a, #nav_enjoy.over a { /*background-position: -233px -34px;*/ }

#nav_brewery a {  width: 115px; background-position: -233px 0; }
	#nav_brewery.on a { background-position: -233px -68px; }
	#nav_brewery a:hover, #nav_brewery:hover a, #nav_brewery.over a { /*background-position: -233px -34px;*/ }


	#nav_offers a {  width: 117px; background-position: -348px 0; }
	#nav_offers.on a { background-position: -348px -68px; }
	#nav_offers a:hover, #nav_offers:hover a, #nav_offers.over a { /*background-position: -348px -34px;*/ }
	
	#nav_jobs a {  width: 117px; background-position: -348px 0; }
	#nav_jobs.on a { background-position: -348px -68px; }
	#nav_jobs a:hover, #nav_jobs:hover a, #nav_jobs.over a { /*background-position: -348px -34px;*/ }
	
	#nav_parties a {  width: 117px; background-position: -348px 0; }
	#nav_parties.on a { background-position: -348px -68px; }
	#nav_parties a:hover, #nav_parties:hover a, #nav_parties.over a { /*background-position: -348px -34px;*/ }

	#nav_menus a {  width: 117px; background-position: -465px 0; }
	#nav_menus.on a { background-position: -465px -68px; }
	#nav_menus a:hover, #nav_menus:hover a, #nav_menus.over a { /*background-position: -465px -34px;*/ }

	#nav_links a {  width: 117px; background-position: -582px 0; }
	#nav_links.on a { background-position: -582px -68px; }
	#nav_links a:hover, #nav_links:hover a, #nav_links.over a { /*background-position: -582px -34px;*/ }

	#nav_map a {  width: 100px; background-position: -704px 0; }
	#nav_map.on a { background-position: -704px -68px; }
	#nav_map a:hover, #nav_map:hover a, #nav_map.over a { /*background-position: -704px -34px;*/ }

    #nav_contact {width: 117px;}
	#nav_contact a {  width: 117px; /*background-position: -804px 0;*/ }
	#nav_contact.on a { /*background-position: -804px -68px;*/ }
	#nav_contact a:hover, #nav_contact:hover a, #nav_contact.over a { /*background-position: -804px -34px;*/ }
	

