*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,san-serif;background:#fff;color:#212121;font-size:.875rem;height:100vh;display:flex;flex-flow:nowrap row;justify-content:center;align-items:center;gap:0}main{display:flex;flex-flow:nowrap column;justify-content:center;align-items:center;gap:0;border:1px solid #C3C3C3;width:30vw;min-height:65vh;border-radius:1rem;box-shadow:5px 5px 10px #c3c3c3;position:relative}main>*{border:1px solid red;width:80%}.header{display:flex;flex-flow:nowrap column;justify-content:center;align-items:center;gap:0;width:100%;padding:.75rem}.header>.logo{width:3.25rem;height:3.25rem}.header>h3{font-size:1.25rem;margin-block:.75rem;line-height:.5rem}.header>p{line-height:.5rem}.container{border:1px solid #578499;padding:.25rem 1rem}.container>div{border:1px solid #578499;margin-block:.5rem}.container>.login-form{border:1px solid black;margin-block:.5rem}.container>.login-form>*{display:flex;flex-flow:nowrap column;justify-content:center;align-items:flex-start;gap:0}.container .email-wrapper{border:1px solid black;margin-block:.5rem}.container .email-wrapper>label{font-size:.875rem;margin-block:.5rem}.container .email-wrapper>input{width:100%;padding:.5rem;border:1px solid #C3C3C3;border-radius:.25rem}.container .password-wrapper{border:1px solid red;margin-block:.5rem}.container .password-wrapper>.password-input-wrapper{display:flex;flex-flow:nowrap row;justify-content:center;align-items:center;gap:0}.container .password-wrapper>.password-input-wrapper>label{font-size:.875rem;margin-block:.5rem}.container .password-wrapper>.password-input-wrapper>input{width:100%;padding:.5rem;border:1px solid #C3C3C3;border-radius:.25rem}.container .password-wrapper>.password-input-wrapper>i{justify-self:end}.container .button-wrapper{display:flex;flex-flow:nowrap column;justify-content:center;align-items:start;gap:0}.container .button-wrapper>.checkbox-wrapper{margin-top:.25rem;display:flex;flex-flow:nowrap row;justify-content:center;align-items:center;gap:.5rem}.container .button-wrapper>.checkbox-wrapper input{width:1rem;height:1rem}.container .button-wrapper>button{border-radius:.5rem;width:100%;margin-block:.5rem;padding-block:.5rem;color:#b3b3b5;background:#3a3c47;font-weight:700;border:1px solid #C3C3C3;cursor:pointer}.container .seperator{display:flex;flex-flow:nowrap row;justify-content:center;align-items:center;gap:0;margin-block:.5rem;width:100%;color:#b3b3b5}.container .auth-button-wrapper{display:flex;flex-flow:nowrap column;justify-content:center;align-items:space-between;gap:.5rem}.container .auth-button-wrapper>*{display:flex;flex-flow:nowrap row;justify-content:center;align-items:center;gap:.75rem;height:2rem;border-radius:.5rem;border:.5px solid #B3B3B5;text-align:center;cursor:pointer}.footer{border:1px solid blue;width:100%;padding:.75rem;font-size:.875rem;text-align:center}.footer a{color:#578499;text-decoration:none;font-weight:700}@media screen and (width <= 1440px){main{width:50vw;min-height:65vh}}@media screen and (768px < width <= 1024px){main{width:70vw;min-height:60svh}}@media screen and (width <= 768px){main{width:90vw;min-height:55vh}}