﻿/* top level

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

.menuto

{

	/* You will get totally diffrent menu alignment and layout by setting following margin, width, and float with different values.

    For detailed instruction please visit www.menucool.com/horizontal/change-menu-alignment  */

	margin: 0 auto;

	width: 100%;

	float: left;

	/*following "behavior" works for IE6, IE7, and IE8. Other browsers will ignore it.*/

    /*Note: htc file path(if using relative path) inside the CSS file should be relative to the page, not to the CSS file (this is unlike image path inside the CSS that is relative to the CSS file location only). 

    So we recommend using the absolute path for the behavior file.*/

	position: relative;

	z-index: 4;

	height: 40px;

	background: #D4D4D4 url(images/bg.gif);

	border: 1px solid #BBB;

	font-family: Tahoma;

	list-style: none;

	padding: 0;

	margin-bottom: 5px;

	margin-top: 0px;

	margin-left: 1px;

	width: 968px;

	color: #fff;

}

.menuto li

{

    padding: 0;

    float: left;

    height: 36px;

    position: relative;/*delete it if you want submenu to be positioned relative to the whole menu instead of this li element*/

    color: #fff;

    z-index:5;

	

}



.menuto a

{

    padding: 2px 17px 0px 17px;

    line-height: 18px; /*Note: keep this value the same as the height of .menuto li */

    font-size: 11px;

    font-weight: bold;

    display: inline-block;

    outline: 0;

    text-decoration: none;

    color: #fff;

    position: relative;

	text-align:center;

}

.menuto li:hover a, .menuto li.onhover a, .menuto li.selected a

{

    background: url(images/bg1.gif) repeat-x;

    color: #fff;

    z-index: 9;

}

.menuto a.arrow

{

    background: url(arrow.gif) no-repeat right center;

}

 

        

/*Used to align a top-level item to the right*/        

.menuto li.menuRight

{

    float: right;

    margin-right: 0px;

}

        

/*for the top-level separators*/

.menuto li.separator

{

    font-size:0;

    overflow:hidden;

    border-left:1px solid #939292;

    border-right:1px solid #4d4d4d;

    z-index:4;

	height: 40px;

}

               

        

/* sub level

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

        

.menuto .drop

{
	position: absolute;
	z-index: 5;
	left: -9999px;
	border: 1px solid #DDD;
	border-bottom: 3px solid #666666;
	background: #ccc;
	text-align: left;
	padding: 20px 10px;
	color: #666666;
	top: 34px;
}



.menuto .drop a

{

    padding-left: 0px;

    padding-right: 0px;

    font-size: 12px;

    font-weight: normal;
	color:#F00;

    display: inline;

    text-align: left;

    position: static;

    z-index: 0;

    background-image:none;

}

.menuto .drop a:hover

{

    padding-left: 0px;

    padding-right: 0px;

    font-size: 12px;

    font-weight: normal;
	color:#F00;

    display: inline;

    text-align: left;

    position: static;

    z-index: 0;

    background-image:none;

}

.menuto li a.drop

{
	left: 0px;/*Use this property to change offset of the dropdown*/
	background-color: #000;
}




.menuto li:hover .drop, .menuto li.onhover .drop

{
	left: 0px;/*Use this property to change offset of the dropdown*/
	background-color: #fff;
}


.menuto li:hover .dropToLeft, .menuto li.onhover .dropToLeft

{

    left: auto;

    right: -1px;

    background:white url(bg-left.png) no-repeat 0 bottom;

}

.menuto li:hover .dropToLeft2, .menuto li.onhover .dropToLeft2

{

    left: auto;

    right: -60px;

}



/* Elements within the drop down sub-menu

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




.menuto ul ul.drop 

{

    padding: 3px 10px;
	background-color:#666;

}

.menuto li:hover .drop a, .menuto li.onhover .drop a

{
	background: none;
	background-image: none;
	padding: 0 0;
	color: #666666;
}





.menuto li ul .drop a

{
	color: #ff6600;
    background:none;
	width:auto;

}

.menuto div.drop div a:hover

{

    text-decoration:underline;

    cursor:pointer;

    color:Red;

}



.menuto div.left {float:left;}


        

/* CSS3 effects

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



/*for top-level*/     

.decor1_1 

{

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

    border-radius: 3px;



    -moz-box-shadow: 0px 1px 4px #ccc;

    -webkit-box-shadow: 0px 1px 4px #ccc;

    box-shadow: 0px 1px 4px #ccc;

            

}



/*for submenu.*/    

.decor1_2 

{

    -moz-border-radius: 4px;

    -webkit-border-radius: 4px;

    border-radius: 4px;



    -moz-box-shadow: 0px 12px 20px #CCCCCC;

    -webkit-box-shadow: 0px 12px 20px #CCCCCC;

    box-shadow: 0px 12px 20px #CCCCCC;  

}










nav {
	
	margin: 1px auto; 
	text-align: left;
	width: 100%;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	
}

nav a{
	color: #333;
}

nav ul ul {
	display: none;
}

	nav ul li:hover > ul {
		display: block;
	}


nav ul {
	background: #efefef; 
	background: linear-gradient(top, #fbfbfb 0%, #bbbbbb 100%);  
	background: -moz-linear-gradient(top, #fbfbfb 0%, #bbbbbb 100%); 
	background: -webkit-linear-gradient(top, #fbfbfb 0%,#bbbbbb 100%); 
	box-shadow: 5px 4px 10px rgba(0,0,0,0.75);
	padding: 0;
	border-radius: 2px;  
	list-style: none;
	position: relative;
	display: inline-table;
	width:967px;
}
	nav ul:after {
		content: ""; clear: both; display: block;
	}

	nav ul li {
		float: left;
		color:#CCC;
		height: 42px;
		margin:auto;
	}
	
		nav ul li a {
			color: #333;
	}
	
		nav ul li:hover, nav ul li.selected a, nav ul li a.selected, nav ul li a.selected {
			
			background: url(images/bg1.gif) repeat-x;
			color:#FFF;
			
		}
	
			nav ul li:hover a {
				color: #fff;
				text-decoration:none;
			}
		
		nav ul li a {
	display: block;
	padding: 15px 19px 15px 19px;
	text-decoration: none;
		}
		
			
		
	nav ul ul {
		background: #656565; border-radius: 0px; padding: 0;
		position: absolute; top: 100%;
		width: 180px;
	}
		nav ul ul li {
			float: none; 
			border-top: 1px solid #818181;
			border-bottom: 1px solid #3f3f3f; position: relative;
		}
			nav ul ul li a {
				padding: 13px 25px;
				color: #fff;
			}	
				nav ul ul li a:hover {
					background: #484848;
				}
		
	nav ul ul ul {
		position: absolute; left: 100%; top:0;
	}
		