:root {
   --primary-color     : rgb(7, 7, 7);
   --secondary-color   : rgb(164, 250, 35);
   --heading-color     : #080808;
   --text-color        : #6e7074;
   --font-name         : "Montserrat", sans-serif;
   --subtitle-font-name: "Island Moments", cursive;
}

.header {
   width      : 100%;
   height     : 70px;
   line-height: 70px;
   background-color:rgba(52, 58, 64, 0);
   backdrop-filter: blur(8px);
}
.logo{
   width: 10%;
}
.logo img {
   width: 70%;
}

.menu {
   margin-bottom: 0;
}

.nav__item a {
   text-decoration: none;
   color          : black;
   font-weight    : 500;
   font-size      : 1.5rem;
   
}

.nav__item a:hover {
   color: greenyellow;
   transition: all 0.4s ease;
}

.nav__item a.active__link {
   color:greenyellow;
   -webkit-text-stroke:0.2px black;
}

.mobile__menu {
   font-size: 1.3rem;
   color    : var(--heading-color);
   display  : none;
}

.sticky__header {
   width      : 100%;
   height     : 70px;
   line-height: 70px;
   background-color: rgba(252, 252, 252, 0.9);
   position   : sticky;
   top        : 0;
   left       : 0;
   z-index    : 999;
}

/* =============== RESPONSIVE ================ */
@media only screen and (max-width:992px) {
   .logo img {
      width: 20%;
   }

   .navigation {
      width     : 100%;
      height    : 100%;
      position  : fixed;
      top       : 0;
      left      : 0;
      background: rgba(255, 255, 255, 0.4);
      z-index   : 999;
      display   : none;
   }

   .menu {
      position       : absolute;
      top            : 0;
      right          : 0;
      width          : calc(100% - 75%);
      height         : 100%;
      background     : #fff;
      flex-direction : column;
      line-height    : 0.5rem;
      justify-content: center;
      z-index        : 9999;
   }

   .show__menu {
      display: block;
   }

   .mobile__menu {
      display: block;
   }
}

/* =============== RESPONSIVE ================ */
@media only screen and (max-width: 768px) {
   .logo img {
      width: 45%;
   }

   .menu {
      width: calc(100% - 50%);
   }
}