#menu-svg-container > svg > g > line {
  stroke-width: 6%;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition-duration: 0.5s;
  transition-timing-function: ease-out;
}

#menu-svg-container > svg > g:nth-child(1) > line {
  stroke: #FFF8EF;
}

#menu-svg-container > svg > g:nth-child(2) > line {
  stroke: #EA5455;
}

#menu-svg-container > svg > g:nth-child(3) > line {
  stroke: #F07B3F;
}

#menu-svg-container > svg > g:nth-child(4) > line {
  stroke: #FFD460;
}

#menu-svg-container > svg > g:nth-child(5) > line {
  stroke: #2D4059;
}

@media (min-aspect-ratio: 1/1) {
  #menu-svg-container {
    left: -100%;
  }
}
#menu-header-svg {
  width: 200dvw;
  height: 30%;
  top: 70%;
}

#menu-svg-horizontal {
  width: 200dvw;
  height: 30%;
  top: 70%;
}

@media (max-aspect-ratio: 1/1) {
  #menu-svg-container {
    top: -100%;
  }
}
#menu-svg-vertical {
  width: 20%;
  height: 200dvh;
  left: 0;
}

.start-menu-button:hover > * {
  stroke-width: 8% !important;
  font-size: 28% !important;
}

.start-menu-button:hover ~ .about-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:hover ~ .timeline-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:hover ~ .projects-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:hover ~ .contact-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:has(~ .about-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.about-menu-button:hover > * {
  stroke-width: 8% !important;
  font-size: 28% !important;
}

.about-menu-button:hover ~ .timeline-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.about-menu-button:hover ~ .projects-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.about-menu-button:hover ~ .contact-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:has(~ .timeline-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.about-menu-button:has(~ .timeline-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.timeline-menu-button:hover > * {
  stroke-width: 8% !important;
  font-size: 28% !important;
}

.timeline-menu-button:hover ~ .projects-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.timeline-menu-button:hover ~ .contact-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:has(~ .projects-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.about-menu-button:has(~ .projects-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.timeline-menu-button:has(~ .projects-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.projects-menu-button:hover > * {
  stroke-width: 8% !important;
  font-size: 28% !important;
}

.projects-menu-button:hover ~ .contact-menu-button > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.start-menu-button:has(~ .contact-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.about-menu-button:has(~ .contact-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.timeline-menu-button:has(~ .contact-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.projects-menu-button:has(~ .contact-menu-button:hover) > * {
  stroke-width: 5.5% !important;
  font-size: 24% !important;
}

.contact-menu-button:hover > * {
  stroke-width: 8% !important;
  font-size: 28% !important;
}

/*# sourceMappingURL=menu.css.map */