
.main-nav, .main-nav ul {list-style: none; margin: 0; padding: 0;}
.main-nav{margin-top:0px; margin-left:50px;}
.navicon.more-btn {position: absolute; right: 10px; top: 25px; display: none; margin: 0 10px 10px 0; padding: 8px 12px;}
.navicon a { font-size: 1.5em;}
 .main-nav > ul > li {float: left; position: relative; padding: 10px; margin-left:30px;}
 .dropdown {display: none; position: absolute; left: 0; top: 34px; background: #fff;background:rgba(255,255,255,0.95); border: 3px solid #ff0000; border-radius: 0 0 5px 5px; padding: 20px;}
 .main-nav > ul > li:hover {background:#ff0000; border-radius: 5px 5px 0 0;}
 .main-nav > ul > li:hover .dropdown {display: block; }
 .main-nav > ul > li:hover > a {color: #fff; text-shadow: none;}
 .main-nav a {color: #555; text-transform: uppercase; font-family: 'helvetica neue', 'arimo', helvetica, arial, sans-serif;}
 .dropdown li {padding: 5px 0;-webkit-transition: all .3s linear;-moz-transition: all .3s linear; transition: all .3s linear;}
 .dropdown li:hover {background: #ff0000; padding-left: 5px; color:#FFFFFF}
 .dropdown li:hover a:hover {color: #FFFFFF;}
 .one-drop .dropdown {width: 150px;}
  .two-drops .dropdown {width: 350px;}
  .two-drops  .drop {width: 46%;float: left;}
.two-drops  .drop:first-child  {margin-right: 4%;}
.drop h3 {text-transform: ; font-size: 115%;}
.main-nav .click-arrow {display: none;}
.hd-arrow {display: none;}


@media only screen and (max-width: 1023px) {

}


@media handheld, only screen and (max-width: 767px) {
.main-nav, #menu {width: 100%;}
.main-nav {margin-top: 70px;}
.navicon.more-btn {display: block; float: left;}
.navicon.more-btn a {font-weight: bold;}
 .main-nav .nav-ul {display: none; margin-top: 80px;}
 .main-nav > ul > li {float: none; border-bottom: 1px solid #ececec; padding: 15px;}
.main-nav > ul > li:hover {background: transparent;}
 .main-nav > ul > li:hover > a {color: #F58026; text-shadow: none;}
.nav-ul {clear: both; background: #fff; border: 1px solid #ebebeb; border-radius:5px; padding: 20px; box-shadow: 0 0 3px rgba(0,0,0,0.2); }
 .main-nav > ul > li:hover .dropdown {display: none;}
 .main-nav a {font-size: 1.15em;}
 .nav-ul > li > a {font-size: 1.25em;}
 .nav-ul .click-arrow {background: none;display: block;  position: absolute; right: 8px; top: 4px; color: #F58026; font-size: 22px; padding: 5px 10px 15px 10px;}
 .nav-ul .click-arrow.open,  .nav-ul .hd-arrow.open {-webkit-transform: rotate(-90deg);-moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg); -o-transform: rotate(-90deg);/* Internet Explorer */filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); top: 6px; right: 9px; background: transparent;}  
.nav-ul .hd-arrow {padding: 5px 8px 10px 8px; top: 3px;}
 .nav-ul .hd-arrow.open {top: 2px; right: 5px; }
 .dropdown {position: relative;top: auto; left: auto; border: none; padding: 0; margin-top: 15px; }
 .drop h3 {text-transform: lowercase; font-size: 140%;}
 .one-drop .dropdown, .two-drops .dropdown {width: auto; }
 .two-drops .drop {width: auto; float: none;}
 .two-drops  .drop:first-child  {margin-right: 0;}
 .dropdown li {border-top: 1px dotted #ccc; padding: 10px;}
.hd-arrow {display: block; position: absolute; right: 5px; top: 15px; color: #ccc;}
.two-drops .drop ul {display: none;}
.two-drops h3 {padding: 10px 0 5px 10px; border-top: 1px dotted #ccc; position: relative; }
.two-drops h3 a {font-size: .9em;}
.active-hd a { color: #F58026;}
}