.container{display:flex;align-items:center;justify-content:center;min-height:100vh}.screen{background:linear-gradient(90deg,#5d54a4,#7c78b8);position:relative;height:600px;width:360px;box-shadow:0 0 24px #5c5696}.screen__content{z-index:1;position:relative;height:100%}.screen__background{position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);overflow:hidden}.screen__background__shape{transform:rotate(45deg);position:absolute}.screen__background__shape1{height:520px;width:520px;background:#fff;top:-50px;right:120px;border-radius:0 72px 0 0}.screen__background__shape2{height:220px;width:220px;background:#6c63ac;top:-172px;right:0;border-radius:32px}.screen__background__shape3{height:540px;width:190px;background:linear-gradient(270deg,#5d54a4,#6a679e);top:-24px;right:0;border-radius:32px}.screen__background__shape4{height:400px;width:200px;background:#7e7bb9;top:420px;right:50px;border-radius:60px}.login{width:320px;padding:156px 30px 30px}.login__field{padding:20px 0;position:relative}.login__icon{position:absolute;top:30px;filter:invert(42%) sepia(20%) saturate(868%) hue-rotate(204deg) brightness(95%) contrast(91%)}.login__input{border:none;border-bottom:2px solid #D1D1D4;background:none;padding:10px 10px 10px 24px;font-weight:700;width:75%;transition:.2s}.login__input:active,.login__input:focus,.login__input:hover{outline:none;border-bottom-color:#6a679e}.login__submit{background:#fff;font-size:14px;margin-top:30px;padding:16px 20px;border-radius:26px;border:1px solid #D4D3E8;text-transform:uppercase;font-weight:700;display:flex;align-items:center;width:100%;color:#4c489d;box-shadow:0 2px 2px #5c5696;cursor:pointer;transition:.2s}.login__submit:active,.login__submit:focus,.login__submit:hover{border-color:#6a679e;outline:none}.button__icon{font-size:24px;margin-left:auto;filter:invert(42%) sepia(20%) saturate(868%) hue-rotate(204deg) brightness(95%) contrast(91%)}.social-login{position:absolute;height:140px;width:160px;text-align:center;bottom:0;right:0;color:#fff}.social-icons{display:flex;align-items:center;justify-content:center}.social-login__icon{padding:20px 10px;color:#fff;text-decoration:none;text-shadow:0px 0px 8px #7875B5}.social-login__icon:hover{transform:scale(1.5)}