/*************************************************************************



* This is the SKIN style definition for the CSS menu.                    *



* Feel free to customize this section.                                   *



*************************************************************************/







/*



 * Menu container settings



 * Applies to the first level menu container



 */



.custom {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px!important;
	font-weight: bold;
	font-style: italic;
}







/*



 * Menu container settings



 * Applies to second (or more) level menu containers



 */



.custom ul {



	/*border: 1px solid #afafaf;*/



}







/*



 * Menu items settings



 * Applies to all menu items in all menu containers



 */



.custom li {



	/*background-image: url(img/bg.gif);*/



	width: 159px;



	/*border-top: solid 1px #ffffff;



	border-bottom: solid 1px #c0c0c0;*/



}







/*



 * Menu items settings



 * Applies to second (or more) level menu items



 */



.custom ul li {



	background-image: none;



	background-color: #c3d0E0;



 	width: 162px;



 	border: none;



}







/*



 * Menu link settings



 * Applies to links that are to be found within the menu items, no matter the menu level



 */



.custom a {



	text-decoration: none;



	color: #FFFFFF;



	line-height: 20px;



	padding: 0px 2px;



	padding-left: 18px;



	cursor: pointer;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px!important;
	font-weight: bold;
	font-style: italic;



}







/*



 * Menu link settings



 * Applies to links located in the second (or more) level menu items



 */



.custom ul a {



 	border: none;



 	border-bottom: 1px solid silver;



 	color: #336699;



	line-height: 19px;



}







/***************************************************************************



* In this section, we will define what happens when mouse-overing an item  *



***************************************************************************/



/*



 * Mouse over on menu items



 * Applies to all menu items in all menu containers



 */



.custom li.hover {



	background-position: 0px 12px !important;
	background-color: #666;



}



  



/*



 * Mouse over on menu items



 * Applies to second (or more) level menu items



 */



.custom ul li.hover {



  	background-color: #336699;



  	background-image: none;



}







/*



 * Mouse over on links



 * Applies to all links in all menu items



 */



.custom a.hover {

	color:#006699;

	background-color: #c3d0E0;



}







/*



 * Mouse over on links



 * Applies to links located in the second (or more) level menu items



 */



.custom ul a.hover {



  	color: #FFFFFF !important;
		background-color: #006699;




}



/*****************************************************************************



* In this section, we will define what happens when a menu item is selected  *



*****************************************************************************/



/*



 * Selected menu item



 * Applies to selected menu items in all menu containers



 */



.custom li.selected {



	background-position: 0px 22px;



}







/*



 * Selected menu item



 * Applies to second (or more) level selected menu items



 */



.custom ul li.selected {



}







/*



 * Selected links



 * Applies to selected links in all menu items



 */



.custom a.selected {



}







/*



 * Selected links



 * Applies to selected links located in the second (or more) level menu items



 */



.custom ul a.selected {



	color: #555555;



}



/******************************************************************************



* In this section, we will define the menu arrows behavior                    *



* An arrow is inserted next to the menu item when the menu item has sub-menus *



******************************************************************************/







/* 



 * Define the arrow



 * Applies to all menu items that have sub-menus



 */



.custom .arrow {



	background-image: url(img/bluarrow.gif);



	background-repeat: no-repeat;



	background-position: 5px center;



}







/*************************************************************************



* This is the LAYOUT style definition for the CSS menu                   *



* DO NOT alter this section, unless you know what you're doing           *



*************************************************************************/



div.vertical {



	clear: both;



}



div.vertical br {



	clear: both;



}



div.vertical ul {



	margin: 0px;



	padding: 0px;



	display: block;



	float: left;



	clear: both;



}



div.vertical li {



	list-style-type: none;



	display: block;



	float: left;



	clear: both;



	text-align: left;



    position: static;



}



div.vertical li img {



	border: none;



}



div.vertical a {



	clear: both;



	display: block;



	margin: 0px;



}



div.vertical ul li ul {



	position: absolute;



	left: -5000px;



	top: -5000px;



	visibility: hidden;



	clear: both; 



}



div.vertical ul li ul li {



	clear: both; 



}







div.vertical ul li ul li a {



	clear: both;



}



.hasImg,



.hasImg a {



	padding: 0px !important;



	margin:	0px	!important;



	border:	none !important;



	outline: none !important;



	background:	transparent !important;



	width: auto !important;



}