.nav-mobile { display: none; cursor: pointer; position: absolute; left: 15px; background: url(/source/b9fc1000278b8201a94be5eac6c385c8.svg) no-repeat center center; background-color: transparent; background-size: 32px; height: 40px; width: 40px; top: 10px; } .nav-click { position: absolute; /* top: 0; */ right: 0; display: none; height: 40px; width: 40px; cursor: pointer; z-index: 2; } .nav-click em { display: block; height: 40px; width: 40px; background: url(/source/6276ecff123ad09d42e76dafa874666b.svg) no-repeat center center; background-color: #eee; background-size: 12px; z-index: 2; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } .nav-rotate { -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); } @media only screen and (max-width:991px) { .menu ul.nav li a { font-size: 13px; padding: 2px 6px; text-align:left; /* border-bottom: 1px solid #ddd; */ } .menu ul.nav li a.btn {text-align: center;} } @media (min-width:768px) { .menu { position: relative; font-size: 14px; font-weight: 700; background: #f4f4f4; } } @media only screen and (max-width:767px) { .nav-mobile { display: block!important; } .menu { width: 100%; padding: 0 0; margin-right: 0; border-top: 1px solid #ddd; } .menu ul.nav { display: none; } .menu ul.nav li { width: 100%; float: none; margin: 0; } .menu .nav>li { border-right: none; } .menu ul.nav li>a { padding: 11px 12px; margin-right: 0; } .menu ul.nav li>a:hover { padding: 11px 12px 11px 17px; color: #999; } .nav-click { display: block; } .nav-mobile-open { border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; } .menu ul.nav>li:hover ul { display: none; } .menu ul.nav li>ul { position: static; width: 100%; -webkit-box-shadow: 0 0 0 rgba(50,50,50,0); -moz-box-shadow: 0 0 0 rgba(50,50,50,0); box-shadow: 0 0 0 rgba(50,50,50,0); padding: 0; margin: 0; } .menu ul.nav>li>ul>li { width: 100%; } .menu ul.nav>li>ul>li>a { padding: 11px 12px; margin: 0; color: #333; font-size: 14px; background-color: #eee; } .menu ul.nav>li>ul>li>a:hover { padding: 11px 12px 11px 17px; color: #999; } .menu ul.nav>li>ul>li>ul { position: static; width: 100%; padding: 0; margin: 0; } .menu ul.nav>li>ul>li>ul>li { width: 100%; padding: 0; margin: 0; } .menu ul.nav>li>ul>li:hover>ul { display: none; } .menu ul.nav>li>ul>li>ul>li a { padding: 11px 12px; height: auto; margin: 0; } .menu ul.nav>li>ul>li>ul>li a:hover { padding: 11px 12px 11px 17px; height: auto; margin: 0; } } @media only screen and (min-width:768px) and (max-width:959px) { .menu ul.nav li a { display: block; line-height: 1; } .menu {padding-top: 10px;} .dropdown-menu {top:27px !important;} #site-header {border-bottom: 1px solid #ccc;} } @media (max-width:1199px) { .menu ul.nav li { /* float: left; */ *display: inline; zoom: 1; position: relative; margin-bottom: 0; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; padding: 0!important; list-style: none; margin: 0 0 8px; } } @media (max-width:767px) { .menu ul.nav li { margin: 0; } }