/* top level
--------------------------------------------*/
@import url(http://fonts.googleapis.com/css?family=Droid+Sans);

#menu 
{
	margin:0;
	position:fixed;
	top:0;
	left:0;
	background-color: #444;
	width:100%;
	-moz-box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	-webkit-box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	text-decoration:none;
    	z-index: 149;
}

.brand
{
    margin: 0 auto; width: auto;
    position:relative;
    z-index:154;
    height: 36px;
    background: #444;
    font-family: "Droid Sans", Arial, Helvetica, sans-serif;
    font-size: 0.95em;
    list-style: none;
    margin-top:1px !important;
    margin-right:10px;
    line-height: 36px;
    text-transform: uppercase;
    vertical-align:middle;
}

.inli
{
	margin-top:1px !important;
	display:inline-block;
}

.menuLayout
{
    margin: 0 auto; width: auto;float:left;
    position:relative;
    z-index:154;
    height: 36px;
    background: #444;
    border: 1px solid #444;
    font-family: "Droid Sans", Arial, Helvetica, sans-serif;
    font-size: 0.95em;
    list-style: none;
    padding: 0;
    line-height: 1.1em !important;
}

.menuLayout 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: #EEE;
    text-transform:uppercase;
    z-index:155;
}

.menuLayout li:hover, .menuLayout li.onhover
{
    border-top:0;
}
.menuLayout a
{
    padding: 0 30px;
    line-height: 36px; /*Note: keep this value the same as the height of .menuLayout li */
    font-weight: normal;
    display: inline-block;
    outline: 0;
    text-decoration: none;
    color: #fff;
    position: relative;
}

#siteIcon
{
	background-image: url('../../images/gear-3-xl.png');	
	margin-left:10px;
	margin-top:5px;
	height:20px;
	width:20px;
	background-size: contain;
	background-repeat: no-repeat;
}

#siteIcon:hover
{
	background-image: url('../../images/gear-2a-xl.png');
}

.menuLayout li:hover a, .menuLayout li.onhover a
{
    background-color: #ddd;
    color: #111;
    z-index: 159;
}
.menuLayout a.arrow
{
    background: url(/images/arrow.gif) no-repeat right center;
}
 
        
/*Used to align a top-level item to the right*/        
.menuLayout li.menuRight
{
    float: right;
    margin-right: 0px;
}
        
/*for the top-level separators*/
.menuLayout li.separator
{
    font-size:0;
    overflow:hidden;
    border-left:1px solid #aaa;
    height:20px;
    margin-top:8px;
    z-index:154;
}
               
        
/* sub level
--------------------------------------------*/
        
.menuLayout .drop
{
	position: absolute;
	z-index:155;
	left: -9999px;
	border: 1px solid #000;
	background: #ddd;           
	text-align: left;
	padding-bottom:10px;
	padding-top:10px;
	top:35px;
	color:#111;
	text-transform: none;
}

.menuLayout  b
{
	text-transform:uppercase;
}

.menucontainer
{
	display: table;
	padding:10px;
}

.menurow
{
	display: table-row;
}

.menucell
{
	display: table-cell;
}

.pad-bottom
{
	padding-bottom:20px !important;
}

.mbtn
{
	width:20px;
	padding:4px;
	vertical-align: bottom;
}

.mbtn:hover
{
	transform: rotate(30deg);
}

.setwidth
{
	width:160px;

}

.menuLayout .drop a
{
	padding-left: 0px;
	padding-right: 0px;
	line-height: 26px;
	font-size: 0.9em;
	font-weight: normal;
	display: inline;
	text-align: left;
	
	position: static;
	z-index: 150;
}

.menuLayout li:hover .drop, .menuLayout li.onhover .drop
{
    left: -1px;/*Use this property to change offset of the dropdown*/
}
.menuLayout li:hover .dropToLeft, .menuLayout li.onhover .dropToLeft
{
    left: auto;
    right: -1px;
}
.menuLayout li:hover .dropToLeft2, .menuLayout li.onhover .dropToLeft2
{
    left: auto;
    right: -60px;
}

/* Elements within the drop down sub-menu
--------------------------------------------*/

.menuLayout div.drop div div
{
    padding: 3px 0px;
}
.menuTemplate1 li:hover .drop a, .menuTemplate1 li.onhover .drop a
{
    background: none;
    background-image:none;
    padding:0 0;
}
.menuLayout div.drop div a
{
    line-height: 24px;  
	color: #222;
    background:none;
}
.menuLayout div.drop div a:hover
{
    cursor:pointer;
    color:#fc9999;
}

.menuLayout div.left
{
	padding:15px;
	float:left;

}
 
/* CSS3 effects
--------------------------------------------*/
 
/*for top-level*/       
.submenu_1 
{
    	-moz-border-radius: 3px;
    	-webkit-border-radius: 3px;
   	 border-radius: 3px;

    	-moz-box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	-webkit-box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);

}

/*for submenu.*/   
.submenu_2 
{
    	-moz-border-radius: 4px;
    	-webkit-border-radius: 4px;
    	border-radius: 4px;

    	-moz-box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	-webkit-box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5);
    	box-shadow: 1px 2px 4px 2px rgba(100,100,100,0.5); 
}