.menuH
{
    /* 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; width: 100%; float:none;
    /*following "behavior" works for IE6, IE7, and IE8. Other browsers will ignore it.*/
    /*Note: Unlike image file, htc file path is relative to the page, not this CSS file.*/
    behavior: url("/horizontal/menuh/cssmenu.htc");
    height: 30px;
    /*background: #eee url(bg.gif) repeat-x 0 0;*/
    background: #eee;
    border: 1px solid #eee;
    position:relative;/*! for IE htc*/
    z-index:4;/*H2*/
    font-family: Arial, Helvetica, sans-serif;
    list-style: none;
    padding: 0;
}

.menuH li
{
    padding: 0;
    /*margin: 0;
    display: block; TODO: I am testing them if they can be removed. If can, remove them.*/
    float: left;
    height: 36px;
    position: relative;/*move it into .menuH if you want submenu to be positioned relative to the whole menu instead of this li element*/
}
.menuH li:hover, .menuH li.onhover
{
    background: white url(bg.gif) repeat-x 0 -48px;
}

ul.menuH a
{
    padding: 0 30px;
    line-height: 36px; /*Note: keep this value the same as the height of .menuH and .menuH li */
    font-size: 12px;
    font-weight: bold;
    color: #be1f09;
    display: block;
    outline: 0;
    text-decoration: none;
    z-index:999;
    
}
.menuH a:hover
{
    color: #0b5fae;
    
}
.menuH a.arrow
{
    background: url(arrow.gif) no-repeat right center;
}
.menuH ul a.arrow
{
    background: url(right.gif) no-repeat 97% center;
}
 
        
/*Used to align a top-level item to the right*/        
.menuH .menuRight
{
    float: right;
    margin-right: 0px;
}
        
/*for the top-level separators*/
.menuH li.separator
{
    font-size:0;
    overflow:hidden;
    border-left:1px solid #F7F7F7;
    border-right:1px solid #BBBBBB;
}
               
        
/*######sub level###########*/
        
ul.menuH ul
{
    width:200px;
    position: absolute;
    left: -9999px;
    border: 1px solid #DDD;
    border-top: 0; 
    background: #FFF;    
    text-align: left;
    list-style: none; margin: 0;  
    /*Following 1px(padding-right) will determine how much it is overlapped by the sub-sub-menu */
    padding: 0 1px 10px 0;
    box-sizing:content-box;
}

.menuH li li
{
    float: none;
    white-space:nowrap;
    height: 35px;
}
.menuH li li:hover, .menuH li li.onhover
{
    background:#f7f7f7;
}
.menuH ul a
{
    padding: 0 20px;
    line-height: 35px;
    font-size: 1.2em;
    font-weight: normal;
    color: #0b5fae;
    text-align: left;
    
}

.menuH ul a:hover
{
    color: red;
}

.menuH li:hover ul, .menuH li.onhover ul
{
    left: -1px;/*Use this property to change offset of the dropdown*/
    top: auto;
}

.menuH li:hover .dropToLeft, .menuH li.onhover .dropToLeft
{
    left: auto;
    right: -1px;
    top: auto;
}
.menuH ul ul
{
    border-top: 1px solid #DDD;
}

.menuH li:hover ul ul, .menuH li:hover ul ul ul, .menuH li:hover ul ul ul ul, .menuH li:hover ul ul ul ul ul, .menuH li:hover ul ul ul ul ul ul,
.menuH li.onhover ul ul, .menuH li.onhover ul ul ul, .menuH li.onhover ul ul ul ul, .menuH li.onhover ul ul ul ul ul, .menuH li.onhover ul ul ul ul ul ul
{
    left: -9999px;
    top:0;
}

.menuH li li:hover ul, .menuH li li li:hover ul, .menuH li li li li:hover ul, .menuH li li li li li:hover ul, .menuH li li li li li li:hover ul .menuH li:hover ul ul ul ul ul, .menuH li:hover ul ul ul ul ul ul,
.menuH li li.onhover ul, .menuH li li li.onhover ul, .menuH li li li li.onhover ul, .menuH li li li li li.onhover ul, .menuH li li li li li li.onhover ul, .menuH li.onhover ul ul ul ul ul, .menuH li.onhover ul ul ul ul ul ul
{
    left: 200px;
    
}
        
/*####### special effects ##########*/
        
.decor1 
{
    -moz-border-radius: 0px; /* Firefox */
    -webkit-border-radius: 0px; /* Safari and Chrome */
    border-radius: 0px; /* Opera 10.5+, future browsers, and now also our behavior htc file */

    -moz-box-shadow: 0px 1px 4px #eee; /* Firefox */
    -webkit-box-shadow: 0px 1px 4px #eee; /* Safari and Chrome */
    box-shadow: 0px 1px 4px #eee; /* Opera 10.5+, future browsers and IE6+ using our behavior htc file */
            
}
.menuH ul 
{
    -moz-border-radius: 0px 0px 4px 4px;
    -webkit-border-radius: 0px 0px 4px 4px;
    border-radius: 0px 0px 4px 4px;

    -moz-box-shadow: 0px 6px 6px #CCC;
    -webkit-box-shadow: 0px 6px 6px #CCC;
    box-shadow: 0px 6px 6px #CCC;  
    
    /*for older IE browsers, the htc file fix will disable this feature when box-shadow was also applied.*/
    /*filter:alpha(opacity=90);
    opacity: 0.90;*/  
            
    /* Gradient background */
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#EEEEEE)); 
}