/*New Header*/
.header {
  height: 90px;
}
.header .navbar-toggler {
    position: fixed;
    top: 25px;
    right: 2rem;
    z-index:  9999;
}

/*Sticky*/
nav.navbar {
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
    z-index: 9999;
    position: fixed;
    padding-left: 50px;
    padding-right: 50px;
    -moz-box-shadow: 0 0 2px 0 rgba(56, 69, 84, .2);
    -webkit-box-shadow: 0 0 2px 0 rgb(56 69 84 / 20%);
    box-shadow: 0 0 2px 0 rgb(56 69 84 / 20%);
    height: 90px; 
    transition: .3s;
    font-family: var(--red-hat);

}
.nav-link {

    color: var(--primary);
}
nav.nav-full.sticky {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  background: rgba(255, 255, 255, .9);
  z-index: 9999;
  height: 70px;
}

nav.nav-full.sticky li {
  
}

nav.nav-full.sticky .logo img {
  width: 132px;
}

.navbar .navbar-brand img {
  max-width: 152px;
  transition: .3s;
}


/*
==================
Header Area
==================
*/

.header-search {
   max-width: 215px;
   width: 100%;
   position: relative;
}
 .header-search.active input {
   opacity: 1;
   width: 350px;
}
 @media (max-width: 767px) {
   .header-search.active input {
     width: 250px;
  }
}
 .header-search.active button {
   
/*   background-color: var(--navy);*/
background: transparent;
}
/* .header-search.active button .search-close {
   opacity: 1;
   display: block;
   color: var(--navy);
}
@media (min-width: 768px) {
   .header-search.active button .search-close {
     opacity: 1;
     display: none;
  } 
   .header-search.active button .search-main {
     display: block;
     opacity: 1;
  }
}
@media (max-width: 767px) {
  .header-search.active button .search-main {
       opacity: 1;
       display: none;
  } 
}*/

 .header-search input {
   height: 100%;
   width: 0%;
   border: 1px solid #ddd;
   background: #fff;
   font-size: 18px;
   border-radius: 5px !important;
   padding: 0 30px 0 0;
   outline: none;
   height: 40px;
   opacity: 0;
   transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
   transform: translateY(-51%);
   top: 50%;
   position: absolute;
   right: -3px;
   opacity: 0;
}
 .header-search button {
   position: relative;
   color: var(--navy);
   background-color: transparent;
   font-size: 16px;
   cursor: pointer;
   height: 40px;
   width: 40px;
   line-height: 50px;
   text-align: center;
   border-radius: 50%;
   border: none;
   padding: 0px;
   line-height: 40px;
}
 .header-search button .search-close {
   opacity: 0;
   display: none;
}
 .header-search button .search-main {
   opacity: 1;
   display: block;
   color: var(--primary);
   border-radius: 50%;
}