header{ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); transition: all 0.5s ease 0s; position: relative; z-index: 99999; }

.navbar-brand img{ max-height: 60px; transition-duration: 0.5s; }
.navbar-header-custom{ padding: 22px 0 20px 0; }

.navbar-default{ transition: all 0.5s ease 0s; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); }
.navbar-default .container,.navbar-default .container-fluid{ position: relative; }
.menu_area{ position: relative; z-index: 2; }
.menu_area .navbar-brand{ transition: all 0.5s ease 0s; }

.navbar-nav li{ list-style: none; -webkit-transition: background .3s ease; -ms-transition: background .3s ease; transition: background .3s ease; }
.navbar-nav > li{ margin-left: 12px; float: left; }
.navbar-nav > li.has-sub{ padding-right: 15px; }
.navbar-nav li.has-sub > a{ position: relative; }
.navbar-nav li a{ display: block; color: #5f5f5f; font-size: 12px; }
.navbar-nav > li > a{ position: relative; display: block; font-size: 12px; font-weight: 500; padding: 20px 0.5rem; color: #232323; letter-spacing: 0.5px; text-transform: uppercase; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; }
.navbar-nav > li > a:hover{ opacity: 0.85; }
.navbar-nav li.active > a{ opacity: 0.85; }

.navbar > ul > li.has-sub > a:after{ position: absolute; top: 27px; right: -8px; content: ""; border-color: transparent #232323 #232323 transparent; border-style: solid; border-width: 0 1px 1px 0; display: block; height: 6px; transform: rotate(45deg); transition: border 0.3s ease 0s; width: 6px; }
.navbar ul ul{ position: absolute; left: -9999px; }
.navbar ul ul li{ -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease; margin-bottom: 8px; padding: 0 20px; }
.navbar ul ul li:last-child{ margin-bottom: 0; }
.navbar-nav li > ul{ padding: 15px 0; margin: 0 0 0 10px; background: #fff; min-width: 225px; -webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); }
.navbar-nav > li.has-sub > ul{  margin-top: 10px; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.navbar-nav > li.has-sub:hover > ul{ margin-top: 0; }
.navbar-nav li:hover > ul{ left: auto; }
.navbar-nav > li.has-sub:last-child:hover ul { left: inherit; right: 0; }

.navbar li > ul ul{ margin-top: -40px; margin-left: 200px; min-width: 200px; }
.navbar li > ul ul ul{ margin-left: 175px; min-width: 130px; }
.navbar ul ul li:last-child > a,.navbar ul ul li.last-item > a{ border-bottom: 0; }
.navbar ul ul li.has-sub > a:after{ position: absolute; top: 12px; right: -3px; width: 8px; height: 2px; display: block; background: #5f5f5f; content: ""; }
.navbar ul ul li.has-sub > a:before{ position: absolute; top: 9px; right: 0; display: block; width: 2px; height: 8px; background: #5f5f5f; content: ''; -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all 0.25s ease; }
.navbar ul ul > li.has-sub:hover > a:before{ top: 17px; height: 0; }

/* Responsive CSS */

@media (min-width: 992px){
  header.scrollHeader .navbar-default{ position: fixed; top: 0; z-index: 99; width: 100%; background: #fff; left: 0; }
  .wrapper-boxed .scrollHeader .navbar-default { left: 0; margin: 0 auto; max-width: 1200px; right: 0;}
 .scrollHeader .navbar-brand img{ max-height: 60px; transition-duration: 0.5s; }
 .scrollHeader .navbar-header-custom{ padding: 10px 0; transition-duration: 0.5s; }
 .navbar-nav .megamenu{ margin: 0; padding: 15px; right: 0; width: 100%; }
 .navbar .megamenu > li{ margin: 0; float: left; }
 .megamenu > li > ul{ left: 0; margin: 0; min-width: auto; position: static; width: 100%; }
 .navbar .megamenu li > ul{ margin: 0; min-width: auto; padding: 0;  -webkit-box-shadow: none; -ms-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
 .navbar .megamenu ul li{ padding: 0; }
 .navbar .megamenu li.has-sub > a:after{ background: none; }
 .navbar .megamenu li.has-sub > a:before{ background: none; }
}
@media (max-width: 1199px){
  .navbar-nav > li{ margin-left: 5px; }
}

@media (max-width: 991px){
 .navbar-header-custom{ padding: 4px 0 8px; }
 .menu_area .navbar-brand{ margin-top: 6px; }
 .navbar-nav li > ul{ -webkit-box-shadow: none; -ms-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
 .navbar-nav > li.has-sub > ul{ margin: 0; -webkit-box-shadow: none; -ms-box-shadow: none; -moz-box-shadow: none; box-shadow: none;  -webkit-transition: all 0s ease; -ms-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0s ease; transition: all 0s ease; }
 .navbar li > ul ul{ margin: 0; min-width: auto; }
 .navbar-nav > li.has-sub{ padding-right: 0; }
 .navbar-nav > li > a{ padding: 10px 20px; color: #232323; }
 .navbar-nav > li > a:hover{ opacity: 1; }
 .navbar-nav li.active > a{ opacity: 1; }
 .navbar-nav{ background: #fff; -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); position: absolute; top: 71px; left: 0; width: 100%; transition-duration: 0; -ms-transition-duration: 0; -moz-transition-duration: 0; -webkit-transition-duration: 0; -o-transition-duration: 0; }

 .navbar ul{ width: 100%; display: none; transition: none; -ms-transition: none; -moz-transition: none; -webkit-transition: none; -o-transition: none; }
 .navbar ul li{ width: 100%; border-top: 1px solid #e6e6e6; position: relative; padding: 0; margin: 0; }
 .navbar ul li:hover{ background: #f5f5f5; }
 .navbar-nav ul ul li, .navbar-nav li:hover > ul > li{ height: auto; }
 .navbar ul li a, .navbar ul ul li a{ width: 100%; border-bottom: 0; }
 .navbar > ul > li{ float: none; }
 .navbar ul ul li{ margin-bottom: 0; padding: 0; border-color: #e6e6e6; }
 .navbar ul ul ul li a{ padding-left: 45px; }
 .navbar ul ul li a{ color: #232323; background: none; padding: 8px 30px; }
 .navbar ul ul, nav ul ul ul{ position: relative; left: 0; width: 100%; margin: 0; text-align: left; background: #f5f5f5; padding: 0; }
 .navbar > ul > li.has-sub > a:after, .navbar > ul > li.has-sub > a:before, .navbar ul ul > li.has-sub > a:after, .navbar ul ul > li.has-sub > a:before{ display: none; }
 .navbar-nav ul ul ul li.active a{ border-left: none; }
 .navbar-nav > ul > li.has-sub > ul > li.active > a, .navbar-nav > ul ul > li.has-sub > ul > li.active > a{ border-top: none; }
 .navbar li > ul ul ul{ margin-left: 0; background: #fff; }
 .navbar ul ul ul ul li a{ padding-left: 55px; }

 .navbar-nav .has-sub .has-sub .submenu-button{ height: 40px; }
 .navbar-nav .has-sub .has-sub .submenu-button:after{ top: 19px; }
 .navbar-nav .has-sub .has-sub .submenu-button:before{ top: 16px;}
 .navbar-toggler{ background: #232323; width: 50px; height: 45px; padding: 0; border-radius: 0; position: absolute; right: 0; top: 13px; cursor: pointer; z-index: 12399994; border: none; }
 .navbar-toggler:after{ position: absolute; top: 22px; right: 15px; display: block; height: 8px; width: 20px; border-top: 2px solid #fff; border-bottom: 2px solid #fff; content: ""; }
 .navbar-toggler:before{ -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; position: absolute; top: 16px; right: 15px; display: block; height: 2px; width: 20px; background: #fff; content: ""; }
 .navbar-toggler.menu-opened:after{ -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; top: 23px; border: 0; height: 2px; width: 19px; background: #fff; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
 .navbar-toggler.menu-opened:before{ top: 23px; background: #fff; width: 19px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
 .navbar-nav .submenu-button{ position: absolute; z-index: 99; right: 0; top: 0; display: block; height: 44px; width: 100%; cursor: pointer; }
 .navbar-nav .submenu-button:after{ position: absolute; top: 21px; right: 17px; width: 8px; height: 2px; display: block; background: #232323; content: ""; }
 .navbar-nav .submenu-button:before{ position: absolute; top: 18px; right: 20px; display: block; width: 2px; height: 8px; background: #232323; content: ""; }
 .navbar-nav .submenu-button.submenu-opened:before{ display: none; }
}
