﻿/*Default Styles for Horizontal Menu*/

/* CSS for common style - large and small*/
.hrzl-menu span.btn-nav {display:none; color:#fff; }
.hrzl-menu { width:100%; font-weight:lighter; font-family:Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif; 
			 font-size:1.2em;  position:relative; height:40px;}
.hrzl-menu .menu-icon { font-size: 1.2em; color:#5b5b5b; margin-right:10px; margin-top:6px; display:inline-block; 
						cursor:pointer; padding:5px 4px; border:solid 1px #aaa; text-transform:none;}
.hrzl-menu .menu-icon:hover { color:#ff9100;}
.hrzl-menu .menu-icon span { display:inline-block; padding:1px 3px; margin-right:4px;}

/* CSS for large menu */
.hrzl-menu.large {}
.hrzl-menu ul.section {width:auto; }
.hrzl-menu, .hrzl-menu ul {margin:0; padding:0; list-style: none; z-index:10;}

.hrzl-menu.large ul {visibility:hidden;  z-index:5; padding:10px; position:absolute; top:40px; 
					 padding-top:2px; min-width:300px; background:url(../../Images/site/bg_hm_sub.jpg) repeat-x;}

.hrzl-menu.large > li {display:inline-block; cursor:pointer;  /*height:30px;*/ /*border-left:solid 1px #ddd;*/}
.hrzl-menu.large > li > span {display:inline-block; padding:12px 25px 20px 25px; }
.hrzl-menu.large > li:first-child { border-left:none; }

.hrzl-menu.large > li:hover {border-bottom:solid 4px #fdfdfd; background:url(../../Images/site/bg_hm_mo.jpg) repeat-x;}
.hrzl-menu.large > li:last-child {margin-left:0; border-right:none;}

.hrzl-menu.large > li > a {font-weight:lighter; text-transform:none; text-align:center; display:inline-block; 
						   line-height: 151%; padding:0; width:100%; color:#5b5b5b; text-decoration: none;}

.hrzl-menu.large > li > a:hover {color:#181818;}
.hrzl-menu.large > li > a > span {display:block; padding:10px;}	
.hrzl-menu.large > li > span.dummy {font-size:100%; color:#5b5b5b; text-align:center; display:inline-block; text-transform:none;}

.hrzl-menu.large ul > li a {line-height:100%; padding:0; display:inline; color: #5b5b5b;}
.hrzl-menu.large ul > li a:visited {color:#5b5b5b;}

.hrzl-menu.large ul > li a:hover {text-decoration:none; }
.hrzl-menu.large li.active:hover ul.noJS {visibility:visible;  }


/*#coolMenu > li.item1 { width:176px;}*/
.hrzl-menu.large > li.item2 > ul {}

.hrzl-menu.large ul > li.col-1 {width:100%;}
.hrzl-menu.large ul > li.col-2 {width:49%; float:left;}
.hrzl-menu.large ul > li.col-3 {width:33%; float:left;}

/*#coolMenu > li.item3 { width:200px;}
#coolMenu > li.item4 { width:183px;}
#coolMenu > li.item5 { width:182px; border-right:0;}

/*#coolMenu .item5 ul {position:absolute; right:0;}*/

.hrzl-menu.large .submenu-block div.level2  {text-transform:none; color:#5b5b5b; padding-top:8px; text-align:left; font-size:0.8em;}
.hrzl-menu.large .submenu-block div.level2 a {color:#5b5b5b; }
.hrzl-menu.large .submenu-block div.level3 { margin-bottom:3px; font-weight:normal; line-height:100%;}

/*for small screen*/
.hrzl-menu.small { height:auto; background-color:#5c5c5c; background-image:none;}
.hrzl-menu.small  ul { display:none; background-color:#fff; width:100%;}
.hrzl-menu.small > li { border-bottom:1px solid #aaa; position:relative; color:#fff;}
.hrzl-menu.small > li:hover {background-color:#bbb; }
.hrzl-menu.small > li > a { display:block; padding:10px; color:#fff;}
.hrzl-menu.small > li > span.dummy { display:inline-block; padding:10px;}
.hrzl-menu.small > li .btn-nav { position:absolute; right:20px; font-size:1em; top:10px; width:12px; height:12px; display:inline-block;}
.hrzl-menu.small > li .btn-nav.plus { cursor:pointer;}

.hrzl-menu.small > li > ul > li > div {border-bottom:solid 1px #ccc; padding:6px 0 6px 30px;}
.hrzl-menu.small > li > ul > li.has-nav-text  {display:none; visibility:hidden;}
.hrzl-menu.small > li > ul > li.col { width:100%; float:none; margin:0; padding:0;}
.hrzl-menu.small > li > ul > li > div:hover { background-color:#ddd;}
.hrzl-menu.small > li > ul > li > div > a { display:block; color:#666; font-size:0.85em;}
.hrzl-menu.small > li > ul > li > div > a:hover {color:#ff5a01;}