#header_container {
  display: flex;
  width: 100%;
  aspect-ratio: 10/1;
  background-color: rgba(0, 0, 0, 0.1);
}

#header_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10%;
  background-color: rgba(255, 0, 0, 0.1);
  cursor: pointer;
}

#header_title {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80%;
  background-color: rgba(0, 255, 0, 0.2);
}

#header_nav {
  width: 10%;
  background-color: rgba(0, 0, 255, 0.1);
}

/* ========== MOBILE STYLES ========== */
@media only screen and (max-width: 600px) {

  #header_container {
    aspect-ratio: 10/2;
  }

  #header_icon,
  #header_nav {
    width: 20%;
  }

  #header_title {
    width: 60%;
  }

}