.main{background-position:50%;background-size:cover;height:100vh;position:relative;width:100%}.main-light{background-color:#21d4fd;background-image:linear-gradient(19deg,#21d4fd,#b721ff)}.main-dark{background-color:#ff3cac;background-image:linear-gradient(225deg,#ff3cac,#784ba0 50%,#2b86c5)}.box{left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.top-box{background-color:#fff!important;opacity:1!important}.top-header{color:#1a73e8!important}.top-box a{color:#1a73e8;font-weight:500;text-decoration:none;transition:all .4s ease}.top-box a:hover{color:#0088fe!important}.top-box h2{color:#000;font-size:2.5rem;font-weight:700;margin-bottom:0}.top-box p{color:#323537;font-size:1.2rem;font-weight:200}.forgot-password{text-align:center}.forgot-password a{color:#1a73e8!important}.forgot-password a:hover{color:#88898a!important}.agreement span{color:#88898a}.agreement a{color:#1a73e8}.register-btn{background-color:#1a73e8!important;border-radius:.8rem!important;cursor:pointer;transition:all .4s ease!important}.register-btn:hover{background-color:#0088fe!important}.navbar{border-bottom:.5px solid #e7e4e4;color:#555;font-size:14px;height:9%}.navbar .wrapper{padding:20px;width:100%}.navbar .wrapper .items{align-items:center;cursor:pointer;display:flex}.navbar .wrapper .items .item{align-items:center;display:flex;margin-right:20px;position:relative}.navbar .wrapper .items .item .icon{font-size:24px}.navbar .wrapper .items .item .avatar{border-radius:50%;height:35px;width:35px}.navbar .wrapper .items .item .counter{align-items:center;background-color:red;border-radius:50%;color:#fff;display:flex;font-size:10px;font-weight:700;height:15px;justify-content:center;position:absolute;right:-5px;top:-5px;width:15px}.sidebar{border-right:.5px solid #e6e3e3;height:100%}.top{margin:7% 0;text-align:center}.logo{color:#1a73e8;font-size:30px;font-weight:700}.sidebar hr{border:.5px solid #e6e3e3;height:0;position:relative}.center{padding-left:10px}.center ul{list-style:none;margin:0;padding:0}.center ul .title{color:#999;font-size:15px;font-weight:700;margin:5% 0}.center ul li{align-items:center;cursor:pointer;display:flex;padding:6px}.center ul li:hover{background-color:#ece8ff}.center ul .icon{color:#1a73e8;font-size:18px}.center ul span{color:#888;font-size:18px;font-weight:600;margin-left:10px}.bottom{align-items:center;display:default;margin:10px}.current-selected{background-color:#ece8ff}@media screen and (max-width:1300px){.center{margin-left:5%}.logo{font-size:100px}.top{margin:1% 0}.center ul .title{font-size:40px;margin:2% 0}.center ul li{margin-bottom:1%}.center ul .icon,.center ul span{font-size:40px;margin:1% 2%}}@media screen and (max-width:768px){.center{margin-left:2%}.logo{font-size:50px}.center ul .title{font-size:30px}.center ul .icon,.center ul span{font-size:25px}}