.navbar-item-container {
  align-self: end;
  justify-self: stretch;
  text-decoration: none;
  .hieroglyph {
    display: flex; align-items: center; justify-content: center; width: 100%; padding-bottom: 10px;
    img {
      height: 2em;}
  }
  .navbar-item-text {
    aspect-ratio: 5/2; background-color: #81533A; width: 100%; display: flex; align-items: center; justify-content: center;
    span {
      font-weight: bold; color: #F5EAD6; font-size: larger
    ;}
  }
}

.navbar-item-container:hover {
  filter: brightness(0.9);}

.mobile-navbar-item {
  display: block;
  padding: 16px 20px;
  color: #F5EAD6;
  text-decoration: none;
  font-weight: 600;
  font-size: 16px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  transition: background-color 0.2s ease;}

@media screen and (min-width: 900px) {
  .navbar-wrapper {
    aspect-ratio: 100/11 !important;}

  .navbar-container {
    display: grid !important;
    grid-template-columns: 2fr 10% 10% 10% 10% 10% 10% !important;}

  .mobile-menu-button, .mobile-menu {
    display: none !important;}
}

@media screen and (max-width: 900px) {
  .navbar-wrapper {
    aspect-ratio: auto !important;}

  .navbar-container {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    min-height: 64px !important;}

  .navbar-container > div:first-child {
    flex: 1;
    display: flex;
    align-items: center;}

  .navbar-container > div:first-child img:first-child {
    width: 40px !important;
    height: 40px;}

  .navbar-container > div:first-child img:last-child {
    width: 120px !important;
    height: auto;}

  .navbar-item-container {
    display: none !important;}

  .mobile-menu-button {
    display: block !important;}

  .mobile-menu {
    display: block !important;}

  .mobile-menu.active {
    max-height: 400px !important;
    transition: max-height 0.3s ease-in !important;}
  
  .mobile-menu-button button .hamburger-icon {
    display: block;}

  .mobile-menu-button button .close-icon {
    display: none;}

  .mobile-menu-button button.active .hamburger-icon {
    display: none;}

  .mobile-menu-button button.active .close-icon {
    display: block;}

  .mobile-menu-button button:hover {
    background-color: #6B4430 !important;}

  .mobile-menu-button button:active {
    transform: scale(0.95);}

  .mobile-navbar-item:hover {
    background-color: rgba(255, 255, 255, 0.1);}

  .mobile-navbar-item:active {
    background-color: rgba(255, 255, 255, 0.2);}
}

footer {
  background-color: #81533A;
  div {
    max-width: min(1800px, 90%); display: flex; justify-content: space-between; align-items: center; margin: 0 auto;}
  img {
    margin: 3% 0; height: 3em;}
  p {
    color: #F5EAD6; text-align: right; font-size: 12pt; word-break: keep-all;}
  a {
    color: #F5EAD6; text-decoration: none;}  
@media (max-width: 900px) {
  div {
    flex-direction: column;}
  img {
    margin: 2em 0 1em 0;}
  p {
  text-align: center;}
}
}