#sp-header.header-sticky {
  position: fixed;
  z-index: 9999;
  background: #27285d;
    background-color: rgb(39, 40, 93);
  box-shadow: 0 2px 5px rgba(16, 16, 16, 0.2);
  padding: 40px 0;
}
.header-sticky .logo-image { 
transition: all .2s ease-in-out;
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
-ms-transform: scale(0.8);
-o-transform: scale(0.8);
transform: scale(0.8);
position: relative;
top: 0px;
  

}


@media only screen and (max-width: 991px) {

  .header-sticky .logo-image-phone { 
transition: all .4s ease-in-out;
-webkit-transform: scale(0.6);
-moz-transform: scale(0.6);
-ms-transform: scale(0.6);
-o-transform: scale(0.6);
transform: scale(0.6);
position: relative;
top: 0px;
  

}

}



body.transparent-header #sp-header {
    position: fixed !important;
    background-color: #fff !important;
    height: 80px !important;
  
  box-shadow: 0 2px 5px rgba(16, 16, 16, 0.2);
}body.ltr #offcanvas-toggler.offcanvas-toggler-left {
    float: left;
    display: none !important;
  margin-left: 20px !important;
}
body.ltr #offcanvas-toggler.offcanvas-toggler-right {
  float: none!important;
   margin-left: 20px !important;

  position: absolute;
  top: -15px;
}
#sp-menu{
  width: 100%!important;
}
#sp-logo {
  width: 100%!important;
  z-index: 9999;
  text-align: center;
flex: auto !important;
max-width: 100% !important;
}
.logo-image, .logo-image-phone {
  height: 170px !important;
position: relative;
top: 28px;
  max-height: 170px !important;
}

.sp-top-login {
  display:none;
  
}
.sp-megamenu-parent > li > a {
    color: #686d6e;
}
.sp-megamenu-parent > li > a:hover {
    color: #686d6e;
}
#offcanvas-toggler > .fa {
    color: #686d6e;
  position: relative;
  z-index:9999 !important;

}
.offcanvas-menu .offcanvas-inner .sp-module ul > li.active > a, .offcanvas-menu .offcanvas-inner .sp-module ul > li.active > span {
  color: #686d6e!important;
}
.offcanvas-menu .offcanvas-inner .sp-module ul > li a, .offcanvas-menu .offcanvas-inner .sp-module ul > li span {
  color: #686d6e!important;
}
#offcanvas-toggler > .fa:hover {
    color: #686d6e;
}
.sp-megamenu-wrapper {
    float: left!important;
    width: 100% !important;
  margin-top: -64px !important;
z-index: 9999;
}
.sp-megamenu-parent {
    float: left!important;
    position: relative;

}
#offcanvas-toggler {
    position: absolute;
}
.sp-megamenu-parent > li.active > a, .sp-megamenu-parent > li.active:hover > a {
  color: #686d6e;
}
.sp-megamenu-parent > li > a::before, .sp-megamenu-parent > li > span::before {

  background-color: #686d6e!important;

}

.fa, .far, .fas {
    font-family: "Font Awesome 5 Free" !important;
  text-rendering: optimizeLegibility !important;
}

@font-face{
    font-family:'DINOT';
    src:url('../fonts/DINOT.eot');
    src:url('../fonts/DINOT.eot') format('embedded-opentype'),
    url('../fonts/DINOT.woff2') format('woff2'),
    url('../fonts/DINOT.woff') format('woff'),
    url('../fonts/DINOT.ttf') format('truetype');
    font-weight:normal;
    font-style:normal}

@font-face{
    font-family:'DINOT-Medium';
    src:url('../fonts/DINOT-Medium.eot');
    src:url('../fonts/DINOT-Medium.eot') format('embedded-opentype'),
    url('../fonts/DINOT-Medium.woff2') format('woff2'),
    url('../fonts/DINOT-Medium.woff') format('woff'),
    url('../fonts/DINOT-Medium.ttf') format('truetype');
    font-weight:500;
    font-style:normal}

@font-face{
    font-family:'DINOT-Bold';
    src:url('../fonts/DINOT-Bold.eot');
    src:url('../fonts/DINOT-Bold.eot') format('embedded-opentype'),
    url('../fonts/DINOT-Bold.woff2') format('woff2'),
    url('../fonts/DINOT-Bold.woff') format('woff'),
    url('../fonts/DINOT-Bold.ttf') format('truetype');
    font-weight:bold;
    font-style:normal}

