@media(max-width:1200px){
.logo-div{width: 240px;}
 #menu ul li > a {padding: 0px 20px;}
header{height: 113px;}
#menu{margin-top: 76px;}
.call-usDiv{top: 7px;}
}

@media(max-width:1100px){
#menu ul{top: 0px;}
.right-btn{top: -70px;}
}

@media screen and (max-width:992px) {
#menu ul li ul li a{padding: 10px 5px 10px 25px;}
.call-usDiv a{padding: 0 14px 0 22px;}
.call-usDiv a.call{padding: 0 15px 0 34px;}
  header{height: 78px !important;}
#menu ul li > a {padding: 0px 17px;}
.call-usDiv{top: 20px !important; right: 63px !important;}
.logo-div{width: 220px; margin: 10px 0 6px;}
.subpage #menu ul, .subpage .right-btn { top: inherit;}
.right-btn { bottom: inherit; margin-bottom: -90px; position: relative !important; top: unset;}
#menu ul li.right-btn a { display: inline; font-weight: bold;}
/* for responsive menu */    
a#toggle { display: block; border-radius: 5px; width: 43px; height: 43px;}
main#content {margin-top: 65px; transition: all ease-out 0.3s;}
#menu {
margin-top: 0px;
position: fixed;
width: 250px;
height: 100%;
top: 0;
left: 0;
overflow: hidden;
overflow-y: auto;
background:rgba(0, 0, 0, 0.98);
transform: translateX(-250px);
border-right: 1px solid rgba(255,255,255,0.2);
}
#menu ul {text-align: left; background-color: transparent; border:0px solid #fffff; top: inherit !important;}
#menu ul li { display: block; width: 100%; top: inherit; }
#menu ul li a { display: block; padding: 12px 15px; height: auto; line-height: normal;}
#menu ul li a > i { float: right; display: none; }
#menu ul li ul {display: none; position: static; width: 100%; background-color: rgba(255, 255, 255, 0.05);}
#menu ul li:hover > ul { display: none; }
#menu ul li:hover > a > i { transform: rotateZ(0); }
#menu ul li.open > a { background-color: rgba(0, 0, 0, 0.3); }
#menu ul li.open > a > i { transform: rotateZ(90deg); }
#menu ul li.open > ul { display: block; }

div#overlay {
display: block;
visibility: hidden;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
transition: all ease-out 0.3s;
z-index: 10;
opacity: 0;
}

#menu ul li i.fa.fa-caret-down.mysubmenu {
display: block;
position: absolute;
top: 0;
right: 0;
background: rgba(255,255,255,0.2);
width: 30px;
height: 25px;
margin: 7px 0 0 0;
text-align: center;
color: #ffffff;
padding: 8px 0 0; cursor:pointer}

#menu ul li i.fa.fa-caret-down.mysubmenu:before {content: "\f067"; }
#menu ul li.open i.fa.fa-caret-down.mysubmenu:before {content: "\f068";}
.open-menu a#toggle .fa-bars:before {content:"\f00d"}	

html.open-menu { overflow: hidden; }

html.open-menu div#overlay {
visibility: visible;
opacity: 1;
width: calc(150%);
left: 250px;
}

html.open-menu a#toggle,
html.open-menu main#content { transform: translateX(0px); }
html.open-menu nav#menu {z-index: 10; transform: translateX(0);}
#menu ul li:before, #menu ul li:first-child:after {display:none}    
}
@media(max-width:767px){
.call-usDiv{right: 59px !important;}
a#toggle { border-radius: 50%; width: 40px; height: 40px;}
}