.wrapper_1 form { display: flex; flex-direction: column; background-color: whitesmoke; width: 100%; padding: 10%; justify-content: flex-start; gap: 24px; height: 100%; } .wrapper_1 input { line-height: 40px; border-radius: 16px; border: 1px solid rgba(68, 68, 68, 0.3); font-size: large; } .Title { font-size: 32px; font-weight: bold; text-align: left; line-height: 45px; letter-spacing: 1.2px; } .Description { font-size: 20px; line-height: 30px; } .Fields { line-height: 40px; font-weight: bold; font-size: 20px; } .wrapper_1 { background-color: whitesmoke; width: 40%; } .email_field { position: relative; width: 100%; } .email_field input { width: 100%; padding: 12px 15px 12px 45px; transition: padding-left 0.2s ease; } .email_field input:focus, .email_field input:not(:placeholder-shown) { padding-left: 15px; } .email_field input:focus + .email-icon, .email_field input:not(:placeholder-shown) + .email-icon { opacity: 0; } .email-icon { height: 25px; position: absolute; left: 15px; top: 50%; transform: translateY(-50%); pointer-events: none; transition: opacity 0.2s ease; } .submitbtn { display: flex; justify-content: center; padding-top: 10%; padding-bottom: 20px; } .submit { background-color: #087A55; height: 50px; width: 100%; color: white; border-radius: 10px; display: flex; align-items: center; justify-content: center; gap: 10px; font-size: larger; font-weight: 500; } .submit-arrow { width: 30px; height: 30px; } .footer { display: flex; justify-content: center; } .login_link { color: #087A55; font-weight: 600; } .wrapper_1 .inputError { border-color: #d93025; background-color: #fdf2f1; } .errorText { color: #d93025; font-size: 14px; position: absolute; top: 100%; left: 4px; }