/* From Uiverse.io by Yaya12085 */
.primary-nav-menu-btn {
    display: none;
}

#nav-checkbox {
    display: none;
  }

  .toggle {
    position: relative;
    width: 30px;
    height: 6px;
    cursor: pointer;
    display: grid;
    row-gap: 3px;
    transition-duration: .5s;
    transform: rotate(180deg);
    /* outline: 2px solid brown; */
    height: max-content;
  }

  .bars {
    width: 100%;
    height: 3px;
    background-color: black;
    border-radius: 2rem;
  }

  #bar2 {
    transition-duration: .8s;
  }

  #bar1 {
    width: 50%;
  }

  #bar2 {
    width: 75%;
  }

  #nav-checkbox:checked + .toggle .bars {
    position: absolute;
    transition-duration: .5s;
  }

  #nav-checkbox:checked + .toggle #bar2 {
    transform: scaleX(0);
    transition-duration: .1s;
  }

  #nav-checkbox:checked + .toggle #bar1 {
    width: 100%;
    transform: rotate(-225deg);
    transition-duration: .5s;
  }

  #nav-checkbox:checked + .toggle #bar3 {
    width: 100%;
    transform: rotate(225deg);
    transition-duration: .5s;
  }

  #nav-checkbox:checked + .toggle {
    transition-duration: .5s;
    transform: rotate(360deg);
  }


@media screen and (max-width: 1090px) {
 .primary-nav-menu-btn {
    display: block;
 }
}