*{box-sizing:border-box;margin:0;padding:0}body{display:flex;justify-content:center;align-items:center;min-height:100vh;background:#081b29}#home{display:flex;position:relative;width:920px;height:550px;box-shadow:#0ef 0 0 25px;background:transparent;border:2px solid #0ef;overflow:hidden;border-radius:10px}.bg-animate{position:absolute;top:0;right:0;width:850px;height:720px;transform:rotate(10deg) skewY(40deg);transform-origin:right bottom;background:linear-gradient(40deg,#25252b,#0ef);border-bottom:3px solid #0ef}#home .form-box{position:absolute;top:0;width:50%;height:100%;display:flex;flex-direction:column;justify-content:center;text-align:center}.form-box h2{font-size:38px;color:#fff;align-items:center}.form-box .input-box{position:relative;width:75%;margin:25px auto}.input-box label{position:absolute;top:40%;left:0;transform:translateY(-50%);color:#fff;pointer-events:none}.input-box i{position:absolute;top:40%;right:0;transform:translateY(-50%);font-size:18px;color:#fff}.input-box input{width:100%;height:40px;color:#fff;background:transparent;border:none;outline:none;border-bottom:2px solid #fff;transition:.5s}.input-box input:focus{border-bottom:2px solid #0ef;font-size:18px;margin-top:8px}.form-box1{position:absolute;top:0;width:50%;height:100%;display:flex;justify-content:center;flex-direction:column}.form-box1.login{right:0;text-align:right;padding:0 40px 60px 150px}.form-box1.login h2{color:#fff;font-size:49px;line-height:1.3;text-transform:uppercase}.form-box1 p{margin-top:12px;font-size:18px;color:#fff}.logreg-link{margin-top:20px}.logreg-link a{padding-left:6px;color:#0ef;text-decoration:none}.btn,.ntn{width:80%;height:45px;cursor:pointer;font-size:16px;color:#fff;font-weight:600;margin-top:20px;background:transparent;border:2px solid #0ef;border-radius:40px;transition:.8s}.btn:hover,.ntn:hover{background:#0ef;color:#081b29}.ntn{width:65%;margin-left:100px}@media (max-width: 900px){#home{width:700px;height:500px}.form-box h2{font-size:30px}.form-box1.login h2{font-size:36px}.form-box .input-box{width:80%}.form-box1.login{padding:0 30px 40px 80px}.bg-animate{transform:rotate(10deg) skewY(50deg)}}@media (max-width: 768px){#home{width:600px;height:450px}.bg-animate{transform:rotate(10deg) skewY(55deg)}.form-box1.login h2{font-size:32px;text-align:center}.form-box1{text-align:center;padding:20px}.form-box1 p{font-size:16px}.ntn{margin:10px auto 0 55px;display:block;width:70%}}@media (max-width: 576px){#home{flex-direction:column;width:400px;height:300px;border-radius:12px}#home .form-box{width:41%;height:100%}.form-box,.form-box1{position:relative;width:100%;height:auto;padding:30px 20px;text-align:center}.form-box h2{font-size:26px}.form-box1.login h2{font-size:28px}.form-box1 p{font-size:15px}.btn,.ntn{width:85%;height:40px;font-size:14px}.input-box label,.input-box input{font-size:13px}.bg-animate{display:none}}@media (max-width: 400px){.form-box h2{font-size:22px}.form-box1.login h2{font-size:24px}.form-box1 p{font-size:13px}.btn,.ntn{height:36px;font-size:13px}.input-box{width:90%}}