@import url(https://fonts.googleapis.com/css?family=Roboto);.loginbox,.registerbox{overflow:hidden;transform:translate(-50%,-10%)}.loginbox h2,.registerbox h2{text-align:center;margin-top:5px}body{background-repeat:no-repeat;background-size:100%;background-color:#ddfafa;font-family:Roboto,sans-serif,Verdana,Helvetica}.loginbox{background-color:#c7c7c7;max-width:350px;padding:25px;margin-top:10%;margin-left:50%;border-radius:5%}.loginbox h2{font-size:20px}.loginbox input{width:89%;display:block;padding:15px;margin-bottom:20px;outline:0;border:1px solid #ebeaea;font-size:16px;border-radius:.5rem}.loginbox input:focus,.registerbox input:focus{border-color:#7a7efa;outline:0}.loginbtn{color:#fff;width:100%;margin:10px;font-size:30px;font-weight:700;background:#070792;border-radius:.5rem}.loginbtn:hover{background:#8484f0}.registerlink{margin-left:100px}.registerbox{background-color:#c7c7c7;width:400px;padding:40px;margin-top:10%;margin-left:50%;border-radius:5%}.registerbox h2{font-size:30px}.registerbox input{width:89%;display:block;padding:12px;margin-bottom:17px;border:1px solid #ebeaea;font-size:15px;border-radius:.5rem}.registerbtn{color:#f7f7f7;width:100%;margin:auto;font-size:40px;font-weight:700;border-radius:.5rem;background:#00f}.registerbtn:hover{background:#8888f7}.loginlink{margin-left:30px;font-size:12px}.registerlink span{color:#fff;font-size:20px}.registerlink a{text-decoration:none;color:#adff2f;font-size:15px}b{color:#fff;font-size:18px}.message{background:#fff;color:#000;font-size:16px;padding:15px 0;border-radius:5px;font-weight:600}.btn{color:#fff;width:40%;margin:10px;font-size:14px;padding:.2em .4em;border-radius:.5rem;background:#070792}@media (min-width:768px){body{font-size:calc(1rem + .2vw)}}@media (max-width:480px){body{font-size:14px}.loginbox{width:200px;margin-top:5%;transform:translate(-50%,20%)}.loginbox input,.registerbox input{width:90%}.registerbox{width:200px;transform:translate(-50%,0)}.loginbtn,.registerbtn{width:80%;font-size:25px}}@media (min-width:481px) and (max-width:767px){body{font-size:16px}.loginbox,.registerbox{transform:translate(-50%,0)}}@media (min-width:768px) and (max-width:1024px){.loginbox,.registerbox{transform:translate(-50%,-15%)}body{font-size:18px}.registerbox{max-width:500px}}@media (min-width:1025px) and (max-width:1280px){body{font-size:20px}}@media (min-width:1281px){body{font-size:22px}.registerbox{max-width:300px;transform:translate(-40%,-20%)}.loginbox{transform:translate(-50%,-20%)}}@media (min-width:1920px){body{font-size:24px}.registerbox{max-width:400px;transform:translate(-40%,-20%)}.registerbox input{width:89%;padding:12px;margin-bottom:17px}.loginbox{transform:translate(-50%,-20%)}}