#contactForm{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);scrollbar-color:var(--color-black) #ffffff20;background:#ffffff16;border:1px solid #ffffff20;border-radius:6px;flex-direction:column;align-items:center;gap:.3rem;width:100%;padding:.4rem;display:flex;position:relative;box-shadow:0 1px 2px #00000026}#contactForm .input:first-of-type{border-bottom:.5px solid var(--color-form);border-radius:6px 6px 0 0}#contactForm .input:last-of-type{border-top:0;border-radius:0 0 6px 6px}#contactForm .information-input{width:100%;color:var(--color-real-white);flex-direction:column;display:flex}#contactForm .information-input .input-field{color:var(--color-real-white);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f0e0f000;border-radius:6px;height:50px;padding-left:1rem;font-size:1rem;transition:all .5s}#contactForm .information-input .input-field::placeholder{color:var(--color-real-white)}#contactForm .information-input #message{box-sizing:border-box;resize:none;min-height:15rem;margin:0;padding-top:.5rem;padding-left:1rem;font-size:1rem}#contactForm .message-success,#contactForm .message-failure{margin-top:1rem;position:absolute;bottom:-60px}#contactForm #sendButton{background:#ffffff16;width:100%;margin-top:1rem}#contactForm #sendButton:active{opacity:.5}
#contactPage{background-color:var(--color-black);background:radial-gradient(circle,#27633d -63%,#101010 100%);justify-content:center;align-items:center;padding:11rem 2rem 4rem;display:flex;position:relative}#contactPage .contact-title{color:#ffffff10;margin-top:5rem;font-family:iceland,sans-serif;font-size:10rem;position:absolute;top:0}#contactPage .contact-content{flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:1rem;width:100%;padding-bottom:10rem;display:flex}#contactPage .contact-content .contact-details{flex-direction:column;flex:1;gap:1rem;min-width:400px;max-width:600px;display:flex}#contactPage .contact-content .contact-details .contact-heading{color:var(--color-real-white);letter-spacing:1px;font-family:iceland,sans-serif;font-size:3rem}#contactPage .contact-content .contact-details .contact-text{color:var(--color-nintendo-gray);max-width:400px;margin-bottom:3rem;font-size:1.1rem}#contactPage .contact-content .contact-details .contactCard{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#ffffff16;border:1px solid #ffffff20;border-radius:12px;align-items:center;gap:3rem;padding:1.5rem;display:flex;position:relative;box-shadow:0 1px 2px #00000026}#contactPage .contact-content .contact-details .contactCard .contact-icon{color:var(--color-real-white);border:1px solid #ffffff20;border-radius:6px;padding:1rem}#contactPage .contact-content .contact-details .contactCard .contact-info{flex-direction:column;gap:.5rem;display:flex}#contactPage .contact-content .contact-details .contactCard .contact-info .contact-info__heading{color:var(--color-real-white);font-family:iceland,sans-serif;font-size:1.5rem}#contactPage .contact-content .contact-details .contactCard .contact-info .contact-info__text{color:var(--color-nintendo-gray);font-size:1rem}#contactPage .contact-content .contact-details .contactCard .contact-link{color:var(--color-white);border:1px solid #ffffff20;border-radius:99px;padding:1rem;transition:color .2s;position:absolute;right:1rem}#contactPage .contact-content .contact-details .contactCard .contact-link .material-symbols-outlined{font-size:20px;display:flex}#contactPage .contact-content .contact-details .contactCard .contact-link:hover{color:var(--color-link-active);transition:color .2s}#contactPage .contact-content .contact-form{flex:1;min-width:300px;max-width:600px;display:flex}#contactPage .darken-image-bottom{background:linear-gradient(#10101000 0%,#101010 80%);width:100%;height:11rem;position:absolute;bottom:0}@media (max-width:550px){#contactPage .contact-title{font-size:9rem}}@media (max-width:460px){#contactPage{padding-left:.3rem;padding-right:.3rem}#contactPage .contact-title{font-size:6rem}#contactPage .contact-content .contact-details{min-width:100%}#contactPage .contact-content .contact-details .contactCard{gap:1rem;padding:1rem}#contactPage .contact-content .contact-details .contactCard .contact-icon{padding:.5rem}#contactPage .contact-content .contact-details .contactCard .contact-info{gap:0}#contactPage .contact-content .contact-details .contactCard .contact-link{padding:.5rem}}
