@charset "utf-8";
/* -----------------------------------------------------

* Filename: menu.css
* Description: external style sheet for menu formatting on Arizona Self Storage web site
* Version: 1
* Website: http://www.selfstoragesolutions.com
* Author: Automatit, Inc


/* @defined ids
------------------------------------------------------*/
#navbar {
	display: block;
	height: 27px;
	font-size: 12px/15px Verdana, Arial, Helvetica, sans-serif;
	list-style: none;
	margin: 0px;
	padding: 0;
	position: absolute;
	width: 896px;
}

#navbar li {
	display: inline;
	float: left; 
	margin: 0; 
	padding: 0; 
	position: relative;
}

#navbar li a {
	background-image: url(images/nav.jpg);
	display: block;
	float: left;
	font-weight: normal;
	height: 27px;
	text-indent: -9999em;
	z-index: 8;
}


/* ------------------------------------------------------------------------------------
	      ***NAVIGATION BAR ROLLOVER***

* Use button1 - button7 id from left to right/top to bottom	
* Coordinates determine what button/state is being displayed
* Height coords should stay the same (height based on height of individual button)
* Width coords will change based on button's position within the image

--------------------------------------------------------------------------------------- */


#navbar li a.leftnavbar {
	background-position: 0 0; 
	width: 10px;
}
					
#navbar li a.leftnavbar:hover, #navbar li a.leftnavbar:focus, #navbar li a.leftnavbar.current {
	background-position: 0 0px;
}

#navbar li a.button1 {
	background-position: 0 0; 
	width: 109px; 
	z-index:6;
}

#navbar li a.button1:hover, #navbar li a.button1:focus, #navbar li a.button1.current {
	background-position: 0px -27px; 
	z-index:7;
}

#navbar li a.button2 {
	background-position: -109px 0; 
	width: 130px; 
	position: relative;
	z-index:5;
}

#navbar li a.button2:hover, #navbar li a.button2:focus, #navbar li a.button2.current {
	background-position: -109px -27px;
}

#navbar li a.button3 {
	background-position: -239px 0; 
	width: 132px;
}

#navbar li a.button3:hover, #navbar li a.button3:focus, #navbar li a.button3.current {
	background-position: -239px -27px;
}

#navbar li a.button4 {
	background-position: -371px 0; 
	width: 119px;
}

#navbar li a.button4:hover, #navbar li a.button4:focus, #navbar li a.button4.current {
	background-position: -371px -27px;
}
				
#navbar li a.button5 {
	background-position: -490px 0; 
	width: 134px;
}

#navbar li a.button5:hover, #navbar li a.button5:focus, #navbar li a.button5.current {
	background-position: -490px -27px;
}
				
#navbar li a.button6 {
	background-position: -626px 0; 
	width: 130px;
}

#navbar a.button6:hover, #navbar li a.button6:focus, #navbar li a.button6.current {
	background-position: -626px -27px;
}

#navbar li a.button7 {
	background-position: -756px 0; 
	width: 140px;
}

#navbar li a.button7:hover, #navbar li a.button7:focus, #navbar li a.button7.current {
	background-position: -756px -27px;
}



/* ---------------------------------------------

*** CODE FOR SUB MENUS ***

------------------------------------------------- */

#navbar ul {
	border: 1px solid #ffffff;
	display: none;
	left: 0px;
	margin: 16px 0 0 0;
	padding: 0;
	position: absolute;
	top: 10px;
	width: 219px;
	font: bolder 14px Verdana, Arial, Helvetica, sans-serif;
	text-decoration:underline;
	z-index: 999;
}	

#navbar li:hover ul {
	display: block;
}
		
#navbar ul li a {
	background: #000000; 
	color: #ffffff; 
	font-weight: normal; 
	display: block; 
	float: left; 
	font-size: 11px; 
	height: 15px; 
	line-height: 20px; 
	padding: 1px 5px 5px 14px; 
	text-decoration: none; 
	text-indent: 0em; 
	width: 200px;
}
		
#navbar #submenu1 {
	border: 1px solid #ffffff;
	display: none;
	left: 0px;
	padding: 0;
	position: absolute;
	width: auto;
	z-index: 9;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0px;
	margin-top: 0px;
}

#navbar ul li:hover #submenu1 {
	border: 1px solid #ffffff;
	display: block;
	left: 10.7em;
	padding: 0;
	top: -1px;
	width: auto;
	z-index: 10;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 69px;
	margin-top: 0px;
	position: absolute;
}



#navbar #submenu2 {
			border: 1px solid #ffffff;
			display: none;
			left: 0px;
			padding: 0;
			position: absolute;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}

#navbar ul li:hover #submenu2 {
			border: 1px solid #ffffff;
			display: block;
			left: 10.70em;
			padding: 0;
			position: absolute;
			top: -1px;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 69px;
			margin-top: 0px;
}

#navbar #submenu3 {
			border: 1px solid #ffffff;
			display: none;
			left: 0px;
			padding: 0;
			position: absolute;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 72px;
			margin-top: 0px;
}

#navbar ul li:hover #submenu3 {
			border: 1px solid #ffffff;
			display: block;
			left: 10.70em;
			padding: 0;
			position: absolute;
			top: -1px;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 69px;
			margin-top: 0px;
}

#navbar #submenu4 {
			border: 1px solid #ffffff;
			display: none;
			left: 0px;
			padding: 0;
			position: absolute;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 69px;
			margin-top: 0px;
}

#navbar ul li:hover #submenu4 {
			border: 1px solid #ffffff;
			display: block;
			left: 10.70em;
			padding: 0;
			position: absolute;
			top: -1px;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 69px;
			margin-top: 0px;
}


/* ----------------------------------------------------
 
*** CODE FOR SUB-SUB MENUS ***

------------------------------------------------------- */

#navbar #subsubmenu1 {
	border: 1px solid #000000;
	display: none;
	left: 0px;
	padding: 0;
	position: absolute;
	width: auto;
	z-index: 11;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-top: 0px;
}



#navbar  ul li ul li:hover #subsubmenu1 {
	border: 1px solid #000000;
	display: block;
	left: 10.7em;
	padding: 0;
	position: absolute;
	top: -1px;
	width: auto;
	z-index: 12;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-top: 0px;
}

#navbar #subsubmenu2 {
			border: 1px solid #000000;
			display: none;
			left: 0px;
			padding: 0;
			position: absolute;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}

#navbar ul  li ul li:hover #subsubmenu2  {
			border: 1px solid #000000;
			display: block;
			left: 10.70em;
			padding: 0;
			position: absolute;
			top: -1px;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}
			
#navbar #subsubmenu3 {
			border: 1px solid #000000;
			display: none;
			left: 0px;
			padding: 0;
			position: absolute;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}

#navbar  ul  li ul li:hover #subsubmenu3  {
			border: 1px solid #000000;
			display: block;
			left: 10.70em;
			padding: 0;
			position: absolute;
			top: -1px;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}

#navbar #subsubmenu4 {
			border: 1px solid #000000;
			display: none;
			left: 0px;
			padding: 0;
			position: absolute;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}

#navbar  ul  li ul li:hover #subsubmenu4  {
			border: 1px solid #000000;
			display: block;
			left: 10.70em;
			padding: 0;
			position: absolute;
			top: -1px;
			width: auto;
			margin-right: 0;
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0px;
}

/* ------------------------------------------------

*** CODE FOR ROLLOVER STATE ON SUBMENUS ***

--------------------------------------------------- */

#navbar #tools {
	position:absolute; 
	left:1px;
}
		
#navbar ul li a:hover, #navbar ul li a:focus, #navbar ul li a.current {
	background: #cc6699; 
	color:#000000;
}
			
	
	
	
	
		
