nav {

background: $nav-background-color;
color: $nav-text-color;
margin: 0;
padding: $padding;

a {
  text-decoration: none;
}

#menu-toggle {
  position: relative;

  @media screen and (min-width: $large-phone) {
    display: none;
  }

  display: block;
  user-select: none;

  input {
    cursor: pointer;
    background: transparent;
    display: block;
    opacity: 0;
    height: 100%;
    min-height: $line-height;
    width: 100%;
    border: none;
    -webkit-touch-callout: none;
    z-index: 20;
  }

  input~ul {
    display: none;
  }

  input:checked~ul {
    display: block;

  }
}

#menu-label::before {
  content: "Menu";
  font-weight: 800;
  position: absolute;
  top: 0;
}

ul {
  display: none;
  list-style: none;
  padding: 0;
  margin: 0;

}

@media screen and (min-width: $large-phone) {
  ul {
    display: block;
    border-bottom: 1px solid $border-color;
  }

  ul:last-child {
    border-bottom: none;
  }
}

li {
  padding: 0.5em;
  border-bottom: 1px solid $border-color;
}

li:last-child {
  border-bottom: none;
}

}

.sub-menu {

padding: 0;
margin: 0 0 0 1em;

}

.crumbs {

font-size: 0.9rem;
margin-bottom: 1.5rem;

a {
  text-decoration: none;
}

}