Адаптивная навигация CSS в темном оттенке

<div class="dsamuge-meclared">
  <nav>
  <div class="nav-wrapper">
  <div class="nav-brand">ZORNET.RU</div>
  <div class="keclave-dropdoared">
  <div class="gasclaku-damolas">
  <label for="nav-check">
  <span></span>
  <span></span>
  <span></span>
  </label>
  </div>
  <input type="checkbox" id="nav-check">
  <div class="mesanu-tedekod">
  <a href="#">ГЛАВНАЯ</a>
  <a href="#">СКРИПТЫ</a>
  <a href="#">КОДЫ</a>
  <a href="#">CSS</a>
  <a href="#">КОНТАКТЫ</a>
  </div>  
  </div>
  </div>
  </nav>
</div>

.dsamuge-meclared {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.4;
  color: GRAY;
  background: white;
}

  nav {
  color: white;
  background: black;
  box-shadow:  
  0 1px 2px 0 rgba(0, 0, 0, 0.15),
  0 2px 1px -5px rgba(0, 0, 0, 0.12),
  0 1px 6px 0 rgba(0, 0, 0, 0.2);
  }

  .nav-wrapper {
  display: flex;
  flex-direction: row;
  flex: 1;
  flex-basis: auto;
  justify-content: space-between;
  align-items: center;
  max-width: 70rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 2rem; }

  .detulopam {
  font-family: inherit;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: inherit;
  text-transform: uppercase;
  color: white; }

  .gasclaku-damolas {
  display: none; }

  .mesanu-tedekod {
  display: flex;
  flex-direction: row;
  flex: 1;
  flex-basis: auto;
  justify-content: center;
  align-items: center;}

  a {
  font-size: 1rem;
  font-weight: 500;
  color: white;
  padding: 1.3rem;
  text-decoration: none;
}

  a:hover {
  color: red;
  background: bisque;  
}

  #nav-check {
  display: none;  
}

@media screen and (max-width: 600px) {  
  .nav-wrapper {
  padding: 1rem; }
  .gasclaku-damolas {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  }

  .keclave-dropdoared label {
  display: inline-block;
  width: 3rem;
  height: 3rem;
  margin: 1.7rem 0;}

  .keclave-dropdoared span {
  display: block;
  width: 2rem;
  height: 0.5rem;
  border-top: 2px solid LIMEGREEN;
  }

  .mesanu-tedekod {
  z-index: 9999 !important;
  position: absolute;
  display: block;
  width: 100%;
  background-color: GRAY;
  transition: all 0.3s ease-in;
  top: 4.2rem;
  left: 0;
  z-index: -2;
  overflow: hidden;}

  .mesanu-tedekod a {
  display: block;
  width: 100%;  
  }

  #nav-check:not(:checked) + .mesanu-tedekod {
  height: 0;}

  #nav-check:checked + .mesanu-tedekod {
  height: calc(100vh - 4.2rem);
  overflow: hidden;}

}