:root {
  --primary-color: #20466A;
  --secondary-color: #2ecc71;
  --dark-color: #333;
}

a {
  color: var(--dark-color) !important;
}

.mm-active > a {
  color: var(--primary-color) !important;
}

a:hover {
  color: var(--primary-color) !important;
}

@media screen and (max-width: 768px) {
 .header-left {
  display: none;
 }
 .header-right {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
 }

 .header-right {
  justify-content: end !important;
 }
 .mobile-search-icon, .mobile-search-close {
   display: block;
   font-size: 1.8rem;
   color: var(--primary-color);
   background: none;
   border: none;
   margin-right: 10px;
   cursor: pointer;
 }
 .search-area {
   display: none;
   width: 100%;
 }
 .search-area.active {
   display: flex;
 }
}

@media screen and (min-width: 769px) {
  .mobile-search-icon {
    display: none;
  }
  .search-area {
    display: flex !important;
  }
}