
:root {
  --primary: #121f3d;
  --white: #fff;
  --gray: #2a324b;
  --dark_red: #700000;
  --light_red: #c23000;
  --dark_gold: #9d7227;
  --light_gold: #b79044;
  --yellow: #e2cb71;
  --yellowp: #e2cb71;
}

.nav__checkbox {
  display: none;
}

.nav__toggle {
  position: absolute;
  cursor: pointer;
  margin: 0 1rem;
  right: 0;
}

.nav__toggle svg {
  padding-top: 0.8rem;
  width: 1rem;
  fill: var(--white);
}

.nav__toggle .close {
  display: none;
}

.nav__toggle .close,
.nav__toggle .menu {
  margin-top: 0.3rem;
}

.nav__menu {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: center;
  margin: 1rem;
  font-family: "Open Sans", system-ui;
  
}

.nav__menu li {
  list-style-type: none;
  color: white;
}

.nav__menu li:hover{
  color: var(--light_gold);
}

.nav__menu li:first-child {
  display: block;
  /*margin-right: auto;*/
}

.nav__menu a {
  color: inherit;
  font-size: 0.9rem;
  text-decoration: none;
}

#nav__checkbox:checked ~ ul.nav__menu li {
  display: block;
}

#nav__checkbox:checked ~ label.nav__toggle .close {
  display: block;
}

#nav__checkbox:checked ~ label.nav__toggle .menu {
  display: none;
}

.content {
  height: 85vh;
}

.footer {
  border-top: 1px solid var(--gray);
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.footer a {
  color: var(--white);
}

#nav__checkbox:checked ~ ul.nav__menu li {
  display: block;
}

#nav__checkbox:checked ~ label.nav__toggle .close {
  display: block;
}

#nav__checkbox:checked ~ label.nav__toggle .menu {
  display: none;
}

@media only screen and (min-width: 560px) {
  .nav__toggle {
    display: none;
  }

  .nav__menu {
    flex-direction: row;
  }
 

}

@media only screen and (max-width: 560px){

.nav{
  background: #000;
  opacity: 0.8;
}

.nav__menu li {
  display: none;
  list-style-type: none;
  color: white;
}

}
