.col-mainmenu{}
.nav-menu{font-size: 60px; display: none; width: 25px; height: 45px; padding: 10px 0 0 0; cursor: pointer; transition: transform .2s ease-in-out; vertical-align: middle; border: 0 none; background: transparent; float:left;}
.nav-menu::-moz-focus-inner {padding: 0; border: 0 none;}
.nav-menu:focus {outline: 0;}
.nav-menu:before,.nav-menu:after { content: "";}
.nav-menu:before,.nav-menu .icon,.nav-menu:after { display: block; float:left; width: 100%; height: 2px; margin: 3px 0 ; transition: transform .2s ease-in-out; background: rgba(0,0,0,.7);}
.nav-menu.active:before,.nav-menu.active .icon,.nav-menu.active:after { background: #2c3e50;}
.open .nav-menu .icon { transform: scale(0);}
.open .nav-menu:before { transform: translateY(8px) rotate(135deg);}
.open .nav-menu:after { transform: translateY(-8px) rotate(-135deg);}


ul.nav-main{margin:0; padding:0; list-style:none; box-shadow:none; border:none; display:block; position:initial; background:none;}
ul.nav-main li{float:left; margin-right:30px; list-style:none; font-size:15px;}
ul.nav-main li a{text-decoration:none; color:#444;  line-height: 45px; transition:.3s; padding:0; margin:0;}
ul.nav-main li a:hover{color:#1679bc; background:none;}
ul.nav-main li a:focus{background:none;}

/* Mobile */
@media (max-width:767px) {
  .nav-menu{display:block;}  
   ul.nav-main{display:none; background: #fafafa; position:absolute; top:46px; padding: 0 15px; border-bottom: 1px solid #eee; box-shadow:0 1px 4px rgba(0,0,0,.05)}
   ul.nav-main li{width:100%; border-top: 1px solid rgba(0,0,0,.04);}
   ul.nav-main li:first-child{border:none;}
   ul.nav-main li a{line-height:40px;}
   ul.nav-main ul{width:100%; margin:0; padding:0 0 17px 0; list-style:none; float:left; }
   ul.nav-main ul li{border:none; font-size:13px; width:50%;  float:left; text-align:center; margin:0; padding:1px; position:relative; line-height:normal; }
   ul.nav-main ul li img{position:absolute; top:10px; left:50%; margin-left:-12px;}
   ul.nav-main ul li a{position:relative; padding-top:38px; padding-bottom:10px; float:left; width:100%; line-height:normal; background:rgba(255,255,255,1); box-shadow: 0 0 1px rgba(0,0,0,.05); border-radius:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
   ul.nav-main ul li a:hover{background:#fff;}

   ul.nav-main li.active > a{color:#1679bc; font-weight:bold; background:none; }
   ul.nav-main li.active > a:hover{color:#1679bc; background:none}
   

   
} 



@media (min-width:768px){
    ul.nav-main ul{height:0px; position:absolute; top:45px; left:0; visibility:hidden; opacity:0; transition:.3s; margin:0; padding:0 15px; width:100%; background:#fafafa; border-bottom:1px solid #eee; float:left;}
    ul.nav-main ul:before{content:''; width:100%; height:0px; background:#fafafa; border-bottom:1px solid #eee; position:absolute; top:0px; right:100%; transition:.3s;}
    ul.nav-main ul:after{content:''; width:100%; height:0px; background:#fafafa; border-bottom:1px solid #eee; position:absolute; top:0px; left:100%; transition:.3s;}
    ul.nav-main ul li{overflow:hidden; height:0; transition:.3s; font-size:13px;}
    ul.nav-main li:hover > a{color:#1679bc}
    ul.nav-main li:hover ul li,
    ul.nav-main li.active > ul li{height:45px;}
    ul.nav-main li:hover ul,
    ul.nav-main li.active > ul{ height:45px; visibility:initial; opacity:1; overflow:initial;}
    ul.nav-main li:hover ul:before,
    ul.nav-main li.active > ul:before,
    ul.nav-main li:hover ul:after,
    ul.nav-main li.active > ul:after{height:45px; visibility:initial;}
    ul.nav-main ul li img{ margin: -3px 5px 0 0;}

    ul.nav-main li.active > a{color:#1679bc; box-shadow:inset 0 -2px #4ab3fb; background:none;}
    ul.nav-main li.active > a:hover{background:none; color:#1679bc;}


    .col-mainmenu .dropdown-menu > .active > a:focus {background:none; color:#1679bc;}
    /* Hide */
    ul.nav-main li.active.is-hide > ul{height:0; opacity:0; visibility:hidden; }
    ul.nav-main li.active.is-hide > ul li{height:0; }
    
}