/*------------------------------------------------------------*/
/* Perfect Layout                                             */
/*   Version 1.0 Beta                                         */
/*                                                            */
/*   Created by Dwight House                                  */
/*   http://perfect.dwightdesign.com/                         */
/*------------------------------------------------------------*/

/*------------------------------------------------------------*/
/* dropdown.css                                               */
/* Optional stylesheet that changes #navigation into a        */
/*     vertical dropdown menu.                                */
/*------------------------------------------------------------*/

/*------------------------------------------------------------*/
/* Override previous styles when dropdowns are used.          */
/*------------------------------------------------------------*/

.navigationPadding
{
	padding:0;
}

#navigation ul
{
	padding:0;
}

#navigation ul ul
{
	padding:0;
}

#navigation a:hover
{
	text-decoration:none;
}

/*------------------------------------------------------------*/
/* Styling and mechanics for dropdowns.                       */
/*------------------------------------------------------------*/

/* This dropdown menu technique was developed by Patrick Griffiths (http://htmldog.com/articles/suckerfish/dropdowns/). */

/* General menu styles. */
#navigationUL, #navigationUL ul
{
	float:left;
	width:200px;
	list-style:none;
}

/* Background for all sub-menus. */
#navigationUL ul
{
	background:url(../images/highLines.png);
}

#navigationUL li
{
	position:relative;
	float:left;
	width:200px;
}
	
#navigationUL li ul
{
	margin-left:200px;
	position:absolute;
	top:0; /* Prevents the need for a negative margin. */
	left:-999em;
}
	
#navigationUL li ul ul
{
	left:-999em;
}
	
#navigationUL li a
{
	padding:0.5em 10px;
	display:block;
	width:180px; /* Width of #navigation - link padding. [ 200 - ( 10 + 10 ) = 180 ]. */
	font-size:1.2em;
	font-weight:bold;
	color:#fff;
	text-decoration:none;
}

/* Menu items with sub-menus get a background made up of the standard highlight color and an arrow pointing to the sub-menu. All menu items that have no sub-menu need the .noArrow class applied. */
#navigationUL li a:hover
{
	background:url(../images/arrow.gif) 100% 50% no-repeat #5d5d5d;
}

/* Hides sub-menus until... */
#navigationUL li:hover ul ul, #navigationUL li:hover ul ul ul, #navigationUL li.sfhover ul ul, #navigationUL li.sfhover ul ul ul
{
	left:-999em;
}

/* ...the user hovers over them, making the sub-menu appear in its rightful place. */
#navigationUL li:hover ul, #navigationUL li li:hover ul, #navigationUL li li li:hover ul, #navigationUL li.sfhover ul, #navigationUL li li.sfhover ul, #navigationUL li li li.sfhover ul
{
	left:auto;
}

/* Turns off arrows for menu items that have no sub-menu items. */
#navigationUL .noArrow a:hover
{
	background:#5d5d5d;
}

/*------------------------------------------------------------*/
/* Additional styles for #navigation when dropdowns are used. */
/*------------------------------------------------------------*/

/* Supplies padding to any additional #navigation content, since the menus require that .navigationPadding have none. */
.navigationInnerPadding
{
	padding:10px;
}

#navigation .navigationInnerPadding a:hover
{
	text-decoration:underline;
}