@font-face {
  font-family: 'Mulish';
  font-display: swap;
  font-weight: 400;
  src: url('../fonts/Mulish-Regular.ttf');
}

@font-face {
  font-family: 'Mulish';
  font-display: swap;
  font-weight: 500;
  src: url('../fonts/Mulish-Medium.ttf');
}

@font-face {
  font-family: 'Mulish';
  font-display: swap;
  font-weight: 600;
  src: url('../fonts/Mulish-SemiBold.ttf');
}

@font-face {
  font-family: 'Mulish';
  font-display: swap;
  font-weight: 700;
  src: url('../fonts/Mulish-Bold.ttf');
}

.mobile-menu-open .mobile-nav-bar {
  transform: translateX(0);
  box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.25);
}

.mobile-menu-open .mobile-menu-underlay {
  background-color: rgba(51, 51, 51, 0.32);
  pointer-events: visible;
  cursor: pointer;
}