/*  

	----- MENU.CSS -----
	This css document controls the css functionality of the menu as well as the
	colors, fonts, padding, etc
*/


/* Overall (body, wrappers, containers, etc) 
-----------------------------------------------------------------------------*/ 
body {
	behavior: url("../csshover.htc");
}
#navmenu {
	position: relative;
	z-index: 1000;
}
#utilmenu {
	margin-top: 2px;
	left:52px;
	position:relative;
}
/* sets the width and padding for all ul's
-----------------------------------------------------------------------------*/ 
#navmenu ul, #navmenu ul ul {
	margin: 0px;
	border: none;
	padding: 0px;
	width: 125px;
	list-style: none;
}
#navmenu ul li {
	font-size: 10%;
	line-height: 10%;
}
#navmenu ul ul ul li {
	font-size: 100%;
	line-height: 100%;
}
/* for the expanding ul's, we want some extra padding to prevent the
   user from accidently rolling off the menu
-----------------------------------------------------------------------------*/
#navmenu ul ul ul {
	padding: 5px 10px 0px 10px;
	margin: 0px;
	border: none;
	width: 170px;
	list-style: none;
	border-top: 2px solid #bf0000;
}
/* IE ignores styles with [attributes], so it will skip the following. */
* > #navmenu ul ul ul {
	background: url('../images/menu_bg.png') repeat;
}
/* style for the main level item links
-----------------------------------------------------------------------------*/
#navmenu a {
	display: block;
	padding: 0px;
	margin: 0px;
	color: #ccc;
	text-decoration: none;
}
#navmenu a:hover {
	color: #888;
}
/* style for the second level item links
-----------------------------------------------------------------------------*/

#navmenu ul ul li:hover li a {
	font: normal 11px Verdana, Arial, Helvetica, sans-serif;
	line-height: normal;
	color: #888;
}
/* hovering style for the second level item links
-----------------------------------------------------------------------------*/
#navmenu ul ul li:hover li {
	color: #888;
}
#navmenu ul ul ul li a:hover {
	color: #000;
}
/* position the expanding ul's relative to its parent
-----------------------------------------------------------------------------*/
#navmenu ul ul li {
	display: block;
	position: relative;
	padding: 4px 0px;
	margin: 0px;
}

#navmenu ul ul ul li {
	display: block;
	position: relative;
	padding: 3px 0px;
	margin: 0px;
}

/* position the expanding ul's specifically within the relative 
   element that is above
-----------------------------------------------------------------------------*/
#navmenu ul ul ul {
	display: none;
  /* IE 5.5 and 6.0 fix for transparent repeating png backgrounds */
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='../images/menu_bg.png');
}
div.position_helper {
	position: absolute;
	top: -10px;
	padding-top: 19px;
	left: 124px;
	display: block;
	z-index: 1000;
}
#navmenu ul ul li:hover ul {
	display: block;
	width: 170px;
}
/* styles for image menu rollovers
-----------------------------------------------------------------------------*/
#navmenu ul li {
	width: 125px;
	background-position: 0px 0px;
	cursor:pointer;
}
#navmenu ul ul li:hover, #navmenu ul ul li.highlight {
	background-position: -123px 0px;
}
#navmenu ul li a {
	width: 125px;
	height: 16px;
	background-position: 0px 0px;
	cursor:pointer;
}

#navmenu ul ul ul li a{
	height: auto;
	width: 170px;
	display: block;
}

#navmenu ul li a:hover, #navmenu ul li.highlight a {
	background-position: -123px 0px;
}
#navmenu ul ul a {
	background: none;
}
/* hardcoded background images (with dimensions) for each main item.
   check the id that is generate by each item to get the appropriate id.
   images are located in images folder.
-----------------------------------------------------------------------------*/
li#architecture a {
	background: url('../images/nav_architecture.gif') no-repeat;
}
li#codes-guidelines {
	background: url('../images/nav_codesguides.gif') no-repeat;
}
li#green {
	background: url('../images/nav_green.gif') no-repeat;
}
li#infill-housing {
	background: url('../images/nav_infillhouse.gif') no-repeat;
}
li#mixed-use {
	background: url('../images/nav_mixeduse.gif') no-repeat;
}
li#neighborhoods {
	background: url('../images/nav_neighborhoods.gif') no-repeat;
}
li#news-and-awards {
	background: url('../images/nav_newsawards.gif') no-repeat;
}
li#other-environments {
	background: url('../images/nav_otherenv.gif') no-repeat;
}
li#our-clients {
	background: url('../images/nav_ourclients.gif') no-repeat;
}
li#our-people {
	background: url('../images/nav_ourpeople.gif') no-repeat;
}
li#streets-squares {
	background: url('../images/nav_streetssquares.gif') no-repeat;
}
li#transient-oriented {
	background: url('../images/nav_transitorient.gif') no-repeat;
}
li#urban-design a {
	background: url('../images/nav_urbandesign.gif') no-repeat;
}
li#who-we-are a {
	background: url('../images/nav_whoweare.gif') no-repeat;
}

#utilmenu{
	margin: 0px 0px 4px 0px;
}

#utilmenu ul{
	margin: 0;
	padding: 0;
	list-style: none;
	clear:both;
	width: 125px;
}

#utilmenu ul li{
	position:relative;
	float: left;
	width: auto;
	display:block;
	height: 12px;
	margin: 0px 0px 0px 0px;
}

#utilmenu ul li a{
	height: 12px;
	display: block;
	background-position: 0px 0px;
	background-repeat: no-repeat;
}

#utilmenu li#util-spacer{
	width: 4px;
	background-image: url('../images/util_spacer.gif');
	background-repeat: no-repeat;
	height: 12px;
	margin: 0px 4px 0px 2px;
}

#utilmenu li#ftp a{
	background-image:url('../images/util_ftp.gif');
	background-repeat: no-repeat;
	height:12px;
	padding:0px 0px;
	width: 20px;
}

#utilmenu li#ftp a:hover, #utilmenu li#ftp.highlight a{
	background-position: -22px;
}

#utilmenu li#contact a{
	background-image:url('../images/util_contact.gif');
	background-repeat: no-repeat;
	height:12px;
	padding:0px 0px;
	width: 40px;
}

#utilmenu li#contact a:hover, #utilmenu li#contact.highlight a{
	background-position: -43px;
}



#navmenu ul ul {
	padding: 0px 0px 6px 0px;
	_padding-bottom: 4px;
}
