@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{font-family:Poppins,sans-serif}.container{width:100vw;height:100vh;background:#fff;display:flex;justify-content:center;align-items:center}aside{flex:1;height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:10rem 2rem 2rem;background-image:linear-gradient(180deg,#04141a99,#04141ad9),url(https://images.unsplash.com/photo-1738081359113-a7a33c509cf9?q=80&w=687&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);background-size:cover;background-position:center;color:#fff;background-blend-mode:hard-light}aside .aside-info{width:100%;height:100%;display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:column;gap:1rem}aside .aside-info h1{font-size:2.5rem;font-weight:700;color:#fff}aside .aside-info p{font-size:1.25rem;font-weight:400;color:#ffffff50}form{flex:1;display:flex;background-color:#fff;flex-direction:column;justify-content:flex-start;padding:0 5rem;gap:.5rem}form h2{font-size:3rem}form .inputGroup{display:flex;flex-direction:column;gap:1rem;width:100%}form .inputGroup label{font-size:1rem;font-weight:400}form .inputGroup label:after{content:" *";color:red}form .inline-inputGroup{display:flex;gap:1rem;width:100%;min-height:min-content}form .inputGroup input,select,textarea{border:2px solid #ccc;border-radius:6px;padding:1.5rem;transition:.3s;resize:none}form .inputGroup input{width:100%;height:3rem}form .inputGroup select,textarea{width:100%;height:5rem}form .inputGroup input:hover{background-color:#7777770d}form .inputGroup input:focus,select:focus,textarea:focus{outline:2px solid #007bff;border-color:#007bff;outline-offset:-4px;outline-style:dashed;transition:none}form .inputGroup input:valid{border-color:#28a745}form .inputGroup input:invalid{border-color:#dc3545}form .inputGroup p{transform:translateY(-2rem);opacity:0;transition:all .3s cubic-bezier(.075,.82,.165,1);color:red;font-weight:500;font-size:.8rem}form .inputGroup input:invalid+p{transform:translateY(-.5rem);opacity:1}form button{border:none;width:max-content;padding:1rem;border-radius:.5rem;transition:.3s}form button:hover{background:#09baff}.loading-state{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;position:absolute;top:0;left:0;background-color:#000;opacity:50%;z-index:1000}.loading-state .animation{width:50px;height:50px;border-radius:50%;border:solid .5rem rgb(0,229,255);animation:animation .5s cubic-bezier(.165,.84,.44,1) infinite}@keyframes animation{0%{border-radius:10%}50%{border-radius:50%}to{border-radius:100%}}@media (max-width: 990px){.container{width:100vw;flex-direction:column;justify-content:space-around}aside{width:100%;min-height:min-content;text-align:center;justify-content:center;align-items:center}aside .aside-info h1{width:100%;font-size:1.5rem}aside .aside-info p{width:100%;font-size:.8rem}form{width:100%;padding:0 1rem}form h2{font-size:2rem;text-align:center}form .inputGroup{width:100%}form .inputGroup label{font-size:.8rem;font-weight:400}form .inline-inputGroup{display:flex;gap:1rem;width:100%;min-height:min-content;flex-direction:column}}*{margin:0;padding:0;box-sizing:border-box}body{width:100vw;height:100vh;display:flex;justify-content:center;align-items:center}