@import "../variables.css";

@media (max-width: 980px) {
  .header-container .hide {
    display: none;
  }

  .title-logo-wrapper {
    justify-content: flex-start;
    padding-left: 20px;
  }

  .navbar-links-wrapper {
    width: 100%;
    position: fixed;
    top: 65px;
    height: 100%;
  }

  .navbar-links {
    flex-direction: column;
    justify-content: flex-start;
    background-color: var(--light-purple);
    width: 100%;
    color: var(--dark-purple);
    gap: 20px;
    padding-top: 30px;
  }

  .navbar-links > a {
    color: var(--dark-purple);
  }

  .navbar-button {
    position: fixed;
    justify-content: center;
    top: 250px;
    width: 100%;
  }

  button {
    background-color: white;
    border: 1px solid var(--dark-purple);
  }

  .hamburger-icon {
    display: flex;
  }
}