.signin-container{display:flex;height:100vh}.signin-container .signin-left{flex:.35;display:flex;justify-content:center;align-items:center;background:#efefef;padding:40px;position:relative}.signin-container .signin-left:after{content:"";position:absolute;right:0;top:0;bottom:0;width:1px;background-color:#3c3c3c}.signin-container .signin-left .signin-form{text-align:center;color:#000;width:100%;max-width:350px;margin:0 auto}.signin-container .signin-left .signin-form h2{font-size:26px;margin-bottom:20px;font-weight:700}.signin-container .signin-left .signin-form form{display:flex;flex-direction:column;align-items:center}.signin-container .signin-left .signin-form form .input-container{position:relative;margin-bottom:20px;margin-top:10px;width:100%}.signin-container .signin-left .signin-form form .input-container input{font-size:16px;width:100%;border:none;border-bottom:2px solid #474747;padding:5px 0;background-color:transparent!important;outline:none}.signin-container .signin-left .signin-form form .input-container .label{position:absolute;top:0;left:0;color:#474747;transition:all .3s ease;pointer-events:none}.signin-container .signin-left .signin-form form .input-container .underline{position:absolute;bottom:0;left:0;height:2px;width:100%;background-color:#333;transform:scaleX(0);transition:all .3s ease}.signin-container .signin-left .signin-form form .input-container input:focus~.label,.signin-container .signin-left .signin-form form .input-container input:valid~.label{top:-20px;color:#333}.signin-container .signin-left .signin-form form .input-container input:focus~.underline,.signin-container .signin-left .signin-form form .input-container input:valid~.underline{transform:scaleX(1)}.signin-container .signin-left .signin-form form .input-container input[type=email]:focus~.label,.signin-container .signin-left .signin-form form .input-container input[type=email]:valid~.label{top:-20px;color:#333}.signin-container .signin-left .signin-form form .input-container input[type=email]:focus~.underline,.signin-container .signin-left .signin-form form .input-container input[type=email]:valid~.underline{transform:scaleX(1)}.signin-container .signin-left .signin-form form input:-webkit-autofill,.signin-container .signin-left .signin-form form input:-webkit-autofill:active,.signin-container .signin-left .signin-form form input:-webkit-autofill:focus,.signin-container .signin-left .signin-form form input:-webkit-autofill:hover{-webkit-background-clip:text;-webkit-text-fill-color:#000;font-size:16px}.signin-container .signin-left .signin-form form input:-webkit-autofill~.label{top:-20px;font-size:16px;color:#333}.signin-container .signin-left .signin-form form input:-webkit-autofill~.underline{transform:scaleX(1)}.signin-container .signin-left .signin-form form .input-field{position:relative;width:100%;margin-bottom:20px}.signin-container .signin-left .signin-form form .input-field input{width:100%;padding:15px;background:rgba(0,0,0,.6);border:1px solid #ffedab;border-radius:8px;font-size:16px;color:#000;outline:none;box-shadow:0 0 5px 2px rgba(255,237,171,.5);transition:box-shadow .3s ease,background-color .3s ease}.signin-container .signin-left .signin-form form .input-field input:focus{box-shadow:0 0 5px 2px rgba(255,237,171,.8);background-color:rgba(0,0,0,.8)}.signin-container .signin-left .signin-form form .password-field{position:relative}.signin-container .signin-left .signin-form form .password-field .password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);cursor:pointer}.signin-container .signin-left .signin-form form .password-field .password-toggle svg{width:20px;height:20px;color:#000;transition:color .3s ease}.signin-container .signin-left .signin-form form .password-field .password-toggle svg:hover{color:#1b72ac}.signin-container .signin-left .signin-form form .signin-btn{width:50%;padding:15px;background-color:#000;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease;box-shadow:0 4px 8px rgba(0,0,0,.2)}.signin-container .signin-left .signin-form form .signin-btn:hover{background-color:#1b72ac;box-shadow:0 6px 12px rgba(0,0,0,.3)}.signin-container .signin-left .signin-form .form-options{display:flex;width:100%;margin-bottom:10px}.signin-container .signin-left .signin-form .form-options label{color:#ffedab;font-size:14px}.signin-container .signin-left .signin-form .form-options label input{margin-right:5px}.signin-container .signin-left .signin-form .form-options .forgot-password{color:#1b72ac;font-size:14px;text-decoration:underline;cursor:pointer}.signin-container .signin-left .signin-form .signup-btn{display:flex;align-items:center;justify-content:center;padding:12px 0;width:100%;border:1px solid #7b7b7b;border-radius:8px;font-size:16px;font-weight:700;margin:15px 0;background-color:transparent;transition:background-color .3s ease,box-shadow .3s ease;cursor:pointer;color:#000;box-shadow:0 0 5px 2px hsla(0,0%,51%,.5)}.signin-container .signin-left .signin-form .signup-btn:hover{background-color:hsla(0,0%,100%,.1);box-shadow:0 0 5px 2px hsla(0,0%,44%,.8)}.signin-container .signin-left .signin-form .signup-btn img{margin-right:10px;object-fit:cover}.signin-container .or_text{display:flex;justify-content:space-between;align-items:center;text-transform:uppercase;column-gap:18px;margin-top:18px;margin-bottom:5px}.signin-container .or_text span:first-child,.signin-container .or_text span:nth-child(3){display:block;width:100%;height:1px;background-color:gray}.signin-container .mt-15{margin-top:15px}.signin-container .signin-right .signin-info{text-align:center;max-width:600px;margin:0 auto}.signin-container .signin-right .signin-info h2{font-size:52px;margin-bottom:10px;font-weight:700;letter-spacing:1px}.signin-container .signin-right .signin-info h3{font-size:18px;margin-bottom:15px;line-height:1.5}.signin-container .signin-right .signin-info h3 span{color:#1b72ac;font-weight:700}.signin-container .signin-right .signin-info p{font-size:20px;font-weight:500;margin-bottom:10px;line-height:1.6}.signin-container .signin-right{flex:.65;display:flex;justify-content:center;align-items:center;color:#000;background-image:url(https://i.postimg.cc/wjYxZS2M/login.png);background-size:cover;background-position:50%;background-attachment:fixed;opacity:0;transform:translateY(20px);animation:fadeInUp 1s ease-out forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.signin-container{flex-direction:column}.signin-container .signin-left{flex:none;height:50%;background-color:#fff;border-top-left-radius:50px;border-top-right-radius:50px;padding:20px;justify-content:flex-end;position:absolute;width:100%;z-index:2;top:45%}.signin-container .signin-right{flex:none;padding:20px;justify-content:flex-start;align-items:center;height:50%}.signin-container .signin-form{margin-top:auto}.signin-container .signin-info h2{font-size:24px}.signin-container .signin-info p{font-size:14px}.signin-container .signin-info .signup-btn{margin-top:10px;font-size:14px}}