@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
*{margin:0;padding:0;box-sizing:border-box;}
body{width:100%;height:100vh;background:#f1f2f7;font-family:'Roboto',sans-serif;font-size:16px;}
section{position:absolute;left:0;right:0;top:0;bottom:0;padding:0 20px;background:#f1f2f7;max-width:1400px;margin:auto;}
.forms {width:100%;max-width:350px;background:#fff;margin:100px auto;padding:0 20px;border-radius:5px;-moz-box-shadow:0 3px 6px 2px #e1e1e1;-webkit-box-shadow:0 3px 6px 2px #e1e1e1;box-shadow:0 3px 6px 2px #e1e1e1;}
h2{font-size:22px;font-weight:600;color:#888;padding:20px 0;}
.inputs{display:block;width:100%;padding:10px;font-size:15px;color:#212529;background:#f7f8fb;border:1px solid #ced4da;outline:none;border-radius:.25rem;}
input[type="password"]{margin-top:15px;}
.buttons{width:100%;margin-top:30px;background-color:#1877f2;border:none;border-radius:6px;box-shadow:none;color:#fff;font-size:18px;font-weight:600;overflow:hidden;padding:10px 32px;text-shadow:none;margin-bottom:20px;}
.buttons:hover{cursor:pointer;}
#card {position: relative;width:100%;max-width: 380px;display: block;margin: 40px auto;text-align: center;font-family: 'Source Sans Pro', sans-serif;}
#upper-side {padding: 2em;background-color: #8BC34A;display: block;color: #fff;border-top-right-radius: 8px;border-top-left-radius: 8px;}
.fa-check-circle,.fa-circle-check{font-size:100px;margin-bottom:10px;}
#status {font-weight: lighter;text-transform: uppercase;letter-spacing: 2px;font-size: 1em;margin-top: -.2em;margin-bottom: 0;}
#lower-side {padding: 2em 2em 5em 2em;background: #fff;display: block;border-bottom-right-radius: 8px;border-bottom-left-radius: 8px;}
#message {margin-top: -.5em;color: #757575;letter-spacing: 1px;}
#contBtn {position: relative;border:none;outline:none;top: 1.5em;text-decoration: none;background: #8bc34a;color: #fff;margin: auto;padding: .8em 3em;-webkit-box-shadow: 0px 15px 30px rgba(50, 50, 50, 0.21);-moz-box-shadow: 0px 15px 30px rgba(50, 50, 50, 0.21);box-shadow: 0px 15px 30px rgba(50, 50, 50, 0.21);border-radius: 25px;-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;}
#contBtn:hover {-webkit-box-shadow: 0px 15px 30px rgba(50, 50, 50, 0.41);-moz-box-shadow: 0px 15px 30px rgba(50, 50, 50, 0.41);box-shadow: 0px 15px 30px rgba(50, 50, 50, 0.41);-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;}
@media (max-width:768px){ 
	.forms {margin:20px auto;}
}