.main-header .container-fluid {
  padding: unset;
}

.main-header .join-now a {
  background-color: #005288;
  color: #fff !important;
}
.container-fluid.main-header .navbar {
  background-color: #fff;
  z-index: 9999;
  padding: 0px 20px;
}

.navbar {
  font: normal normal normal 24px/31px Merriweather;
  letter-spacing: -1.2px;
}
.navbar-brand {
  width: 210px;
}
.nav-item {
  border-right: 1px solid #c0c2c4;
}

.nav-item:last-of-type {
  border-right: none;
}

.nav-link {
  color: #005288 !important;
}

.navbar-light .navbar-toggler .navbar-toggler-icon {
  background-image: url(../images/menu-hamburger.png) !important;
  background-size: cover;
}
.navbar-light .navbar-toggler.active .navbar-toggler-icon {
  background-image: url(../images/menu-cross-icon.png) !important;
  background-size: cover;
}
.navbar-toggler {
  transition: background-image 0.8s ease-in-out;
}

@media (min-width: 1280px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1200px !important;
  }
}
@media (min-width: 992px) {
  .navbar-expand-lg .navbar-collapse {
    justify-content: flex-end;
  }
}
@media (max-width: 992px) {
  .navbar-toggler:focus {
    box-shadow: unset !important;
  }
  .navbar-toggler {
    box-shadow: unset !important;
    font-size: 1rem !important;
  }
  .main-header {
    background-color: #000000;
    padding: unset !important;
  }

  div#navbarNav {
    position: absolute;
    top: 79px;
    background-color: #005288;
    width: calc(100% + 15px);
    left: -10px !important;
    height: calc(100vh - 41px);
    transition: all 300ms ease-in-out;
    opacity: 1;
  }

  ul.navbar-nav {
    margin: 40px 0px 0px 0px;
  }
  .main-header li.nav-item {
    padding: 5px 0px 0px 0px;
  }
  .main-header li.nav-item a {
    color: #ffffff !important;
    font-size: 18px;
    font-weight: 400;
    padding: 10px 5px;
    display: block;
    text-align: center;
    width: fit-content;
    margin: 0 auto;
  }
  .main-header .join-now a {
    background-color: #b3203d;
    padding: 1px 4px 1px 4px;
  }
  .container-fluid.main-header .navbar {
    padding: 0px 0px 0px 20px;
  }
  .collapse:not(.show) {
    animation-name: zoomOut;
    animation-duration: 1s; /* Set the duration of the animation */
  }

  div#navbarNav.zoom-out {
    animation-name: zoomOutNavbar;
    animation-duration: 1s; /* Set the duration of the animation */
  }
}
/* 
  
}
@keyframes zoomIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
*/
@keyframes zoomOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes zoomOutNavbar {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@media (max-width: 1024px) and (min-width: 768px) {
}
@media (min-width: 768px) {
  .desk-version {
    display: block;
  }
  .mob-version {
    display: none;
  }
  .desk-ver {
    display: flex;
  }
  .mob-ver {
    display: none;
  }
  .desk-view {
    display: flex !important;
  }
  .mob-view {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .desk-version {
    display: none;
  }
  .mob-version {
    display: block;
  }
  .desk-ver {
    display: none;
  }
  .mob-ver {
    display: block;
  }
  s .mob-view {
    display: flex !important;
  }
  .desk-view {
    display: none !important;
  }
}
