#contact-container {
  display: flex;
}

.contact-button > line {
  stroke: #FFF8EF;
  stroke-width: 10%;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition-duration: 0.5s;
  transition-timing-function: ease-out;
}

.contact-button > text {
  fill: #2D4059;
  transition-duration: 0.5s;
  transition-timing-function: ease-out;
}

.contact-button.active-contact-button > line {
  stroke: #F07B3F;
  stroke-width: 12% !important;
}

.contact-button.active-contact-button > text {
  font-size: 30% !important;
}

.contact-container {
  display: none;
}

.contact-container.active-contact-container {
  display: flex;
}

.download-button > svg > g > line {
  stroke: #FFF8EF;
  stroke-width: 10%;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition-duration: 0.5s;
  transition-timing-function: ease-out;
}

.download-button:hover > svg > g > line {
  stroke: #FFF8EF;
  stroke-width: 12%;
}

.download-button > svg > g > text {
  transition-duration: 0.5s;
  transition-timing-function: ease-out;
}

.download-button:hover > svg > g > text {
  font-size: 32%;
}

.copy-icon {
  stroke: #FFD460;
  stroke-width: 1%;
  fill: transparent;
}

.selectable-contact-text {
  transition-duration: 0.5s;
  transition-timing-function: ease-out;
}

.selectable-contact-text::selection {
  fill: #2D4059;
  background: #FFF8EF;
}

.selectable-contact-text::-moz-selection {
  fill: #2D4059;
  background: #FFF8EF;
}

.selectable-contact-text::selection:link {
  fill: #2D4059;
  background: #FFF8EF;
}

.selectable-contact-text::-moz-selection:link {
  fill: #2D4059;
  background: #FFF8EF;
}

.selectable-contact-text:hover, .selectable-contact-text:link {
  fill: #F07B3F;
}

.selectable-contact-text:hover, .selectable-contact-text:link {
  fill: #F07B3F;
}

@media (min-aspect-ratio: 1/1) {
  #contact-container {
    flex-direction: row;
    overflow-x: scroll;
    overflow-y: hidden;
  }
  #contact-buttons-svg {
    width: 40%;
    height: 100%;
    flex-grow: 2;
    flex-shrink: 2;
  }
}
#contact-container-container-horizontal {
  width: 60%;
  height: 100%;
  flex-grow: 3;
  flex-shrink: 3;
}

@media (max-aspect-ratio: 1/1) {
  #contact-container {
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: scroll;
  }
  #contact-buttons-svg {
    width: 100%;
    height: 30%;
    flex-grow: 3;
    flex-shrink: 3;
  }
}
#contact-container-container-vertical {
  width: 100%;
  height: 70%;
  flex-grow: 7;
  flex-shrink: 7;
}

#resume-contact-button-horizontal:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#resume-contact-button-horizontal:hover > text {
  font-size: 30% !important;
}

#resume-contact-button-horizontal:hover ~ #email-contact-button-horizontal > line {
  stroke-width: 9% !important;
}

#resume-contact-button-horizontal:hover ~ #email-contact-button-horizontal > text {
  font-size: 24% !important;
}

#resume-contact-button-horizontal:hover ~ #github-contact-button-horizontal > line {
  stroke-width: 9% !important;
}

#resume-contact-button-horizontal:hover ~ #github-contact-button-horizontal > text {
  font-size: 24% !important;
}

#resume-contact-button-horizontal:hover ~ #linkedin-contact-button-horizontal > line {
  stroke-width: 9% !important;
}

#resume-contact-button-horizontal:hover ~ #linkedin-contact-button-horizontal > text {
  font-size: 24% !important;
}

#resume-contact-button-vertical:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#resume-contact-button-vertical:hover > text {
  font-size: 30% !important;
}

#resume-contact-button-vertical:hover ~ #email-contact-button-vertical > line {
  stroke-width: 9% !important;
}

#resume-contact-button-vertical:hover ~ #email-contact-button-vertical > text {
  font-size: 24% !important;
}

#resume-contact-button-vertical:hover ~ #github-contact-button-vertical > line {
  stroke-width: 9% !important;
}

#resume-contact-button-vertical:hover ~ #github-contact-button-vertical > text {
  font-size: 24% !important;
}

#resume-contact-button-vertical:hover ~ #linkedin-contact-button-vertical > line {
  stroke-width: 9% !important;
}

#resume-contact-button-vertical:hover ~ #linkedin-contact-button-vertical > text {
  font-size: 24% !important;
}

#resume-contact-button-horizontal:has(~ #email-contact-button-horizontal:hover) > line {
  stroke-width: 9% !important;
}

#resume-contact-button-horizontal:has(~ #email-contact-button-horizontal:hover) > text {
  font-size: 24% !important;
}

#email-contact-button-horizontal:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#email-contact-button-horizontal:hover > text {
  font-size: 30% !important;
}

#email-contact-button-horizontal:hover ~ #github-contact-button-horizontal > line {
  stroke-width: 9% !important;
}

#email-contact-button-horizontal:hover ~ #github-contact-button-horizontal > text {
  font-size: 24% !important;
}

#email-contact-button-horizontal:hover ~ #linkedin-contact-button-horizontal > line {
  stroke-width: 9% !important;
}

#email-contact-button-horizontal:hover ~ #linkedin-contact-button-horizontal > text {
  font-size: 24% !important;
}

#resume-contact-button-vertical:has(~ #email-contact-button-vertical:hover) > line {
  stroke-width: 9% !important;
}

#resume-contact-button-vertical:has(~ #email-contact-button-vertical:hover) > text {
  font-size: 24% !important;
}

#email-contact-button-vertical:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#email-contact-button-vertical:hover > text {
  font-size: 30% !important;
}

#email-contact-button-vertical:hover ~ #github-contact-button-vertical > line {
  stroke-width: 9% !important;
}

#email-contact-button-vertical:hover ~ #github-contact-button-vertical > text {
  font-size: 24% !important;
}

#email-contact-button-vertical:hover ~ #linkedin-contact-button-vertical > line {
  stroke-width: 9% !important;
}

#email-contact-button-vertical:hover ~ #linkedin-contact-button-vertical > text {
  font-size: 24% !important;
}

#resume-contact-button-horizontal:has(~ #github-contact-button-horizontal:hover) > line {
  stroke-width: 9% !important;
}

#resume-contact-button-horizontal:has(~ #github-contact-button-horizontal:hover) > text {
  font-size: 24% !important;
}

#email-contact-button-horizontal:has(~ #github-contact-button-horizontal:hover) > line {
  stroke-width: 9% !important;
}

#email-contact-button-horizontal:has(~ #github-contact-button-horizontal:hover) > text {
  font-size: 24% !important;
}

#github-contact-button-horizontal:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#github-contact-button-horizontal:hover > text {
  font-size: 30% !important;
}

#github-contact-button-horizontal:hover ~ #linkedin-contact-button-horizontal > line {
  stroke-width: 9% !important;
}

#github-contact-button-horizontal:hover ~ #linkedin-contact-button-horizontal > text {
  font-size: 24% !important;
}

#resume-contact-button-vertical:has(~ #github-contact-button-vertical:hover) > line {
  stroke-width: 9% !important;
}

#resume-contact-button-vertical:has(~ #github-contact-button-vertical:hover) > text {
  font-size: 24% !important;
}

#email-contact-button-vertical:has(~ #github-contact-button-vertical:hover) > line {
  stroke-width: 9% !important;
}

#email-contact-button-vertical:has(~ #github-contact-button-vertical:hover) > text {
  font-size: 24% !important;
}

#github-contact-button-vertical:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#github-contact-button-vertical:hover > text {
  font-size: 30% !important;
}

#github-contact-button-vertical:hover ~ #linkedin-contact-button-vertical > line {
  stroke-width: 9% !important;
}

#github-contact-button-vertical:hover ~ #linkedin-contact-button-vertical > text {
  font-size: 24% !important;
}

#resume-contact-button-horizontal:has(~ #linkedin-contact-button-horizontal:hover) > line {
  stroke-width: 9% !important;
}

#resume-contact-button-horizontal:has(~ #linkedin-contact-button-horizontal:hover) > text {
  font-size: 24% !important;
}

#email-contact-button-horizontal:has(~ #linkedin-contact-button-horizontal:hover) > line {
  stroke-width: 9% !important;
}

#email-contact-button-horizontal:has(~ #linkedin-contact-button-horizontal:hover) > text {
  font-size: 24% !important;
}

#github-contact-button-horizontal:has(~ #linkedin-contact-button-horizontal:hover) > line {
  stroke-width: 9% !important;
}

#github-contact-button-horizontal:has(~ #linkedin-contact-button-horizontal:hover) > text {
  font-size: 24% !important;
}

#linkedin-contact-button-horizontal:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#linkedin-contact-button-horizontal:hover > text {
  font-size: 30% !important;
}

#resume-contact-button-vertical:has(~ #linkedin-contact-button-vertical:hover) > line {
  stroke-width: 9% !important;
}

#resume-contact-button-vertical:has(~ #linkedin-contact-button-vertical:hover) > text {
  font-size: 24% !important;
}

#email-contact-button-vertical:has(~ #linkedin-contact-button-vertical:hover) > line {
  stroke-width: 9% !important;
}

#email-contact-button-vertical:has(~ #linkedin-contact-button-vertical:hover) > text {
  font-size: 24% !important;
}

#github-contact-button-vertical:has(~ #linkedin-contact-button-vertical:hover) > line {
  stroke-width: 9% !important;
}

#github-contact-button-vertical:has(~ #linkedin-contact-button-vertical:hover) > text {
  font-size: 24% !important;
}

#linkedin-contact-button-vertical:hover > line {
  stroke: #FFD460;
  stroke-width: 12% !important;
}

#linkedin-contact-button-vertical:hover > text {
  font-size: 30% !important;
}

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