@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;}
.reglog{position:absolute;left:0;right:0;top:0;bottom:0;background:#f1f2f7;max-width:1400px;margin:auto;}
.login{margin-top:60px;}
.register{margin-top:20px;}
.reglog .container{width:100%;max-width:1020px;margin:auto;padding:0 20px;}
.reglog .row{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-around;}
.reglog .col-2{flex-basis:50%;}
.reglog .col-2 h1{display:block;font-size:41px;color:#1877f2;}
.reglog .col-2 p{font-size:20px;color:#555;padding-left:2px;}
.reglog .forms{width:100%;max-width:400px;margin-left:auto;background:#fff;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;}
.reglog .heads{position:relative;padding:8px 15px;border-bottom:1px solid #eee;}
.reglog .heads h1{font-size:31px;font-weight:600;color:#888;}
.reglog .heads span{display:inline-block;font-size:13px;font-weight:normal;color:#555;padding:6px 0;}
.reglog .bodys{padding:10px;}
.reglog .bodys .inputs{position:relative;display:flex;justify-content:space-between;}
.reglog .bodys .fields{display:block;width:100%;margin:5px;padding:10px;font-size:15px;color:#212529;background:#f7f8fb;border:1px solid #ced4da;outline:none;border-radius:.25rem;}
.reglog .bodys button{width:100%;margin:10px 5px;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;}
.reglog .bodys button:hover{cursor:pointer;}
.reglog .bodys p{font-size:12px;color:#777;margin:7px 5px;text-align:justify;}
.reglog .bodys a{text-decoration:none;}
.reglog .bodys a:hover{text-decoration:underline;}
.reglog .foots{text-align:center;padding:0 15px;}
.reglog .foots a{font-size:14px;text-decoration:none;}
.reglog .foots a:hover{text-decoration:underline;}
.reglog hr{border:none;background:#ced4da;height:1px;margin:20px 15px;}
.reglog .foots .btnSignup{display:inline-block;background-color:#00a400;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;}
.reglog .foots .btnSignup:hover{text-decoration:none;}
#confirm{display:none;position:absolute;left:0;right:0;top:0;bottom:0;padding:0 20px;background:#f1f2f7;max-width:1400px;margin:auto;}
#confirm .card {position: relative;width:100%;max-width: 380px;display: block;margin: 40px auto;text-align: center;font-family: 'Source Sans Pro', sans-serif;}
#confirm .upper-side {padding: 2em;background-color: #8BC34A;display: block;color: #fff;border-top-right-radius: 8px;border-top-left-radius: 8px;}
#confirm .fa-check-circle,#confirm .fa-circle-check{font-size:100px;margin-bottom:10px;}
#confirm .status {font-weight: lighter;text-transform: uppercase;letter-spacing: 2px;font-size: 1em;margin-top: -.2em;margin-bottom: 0;}
#confirm .lower-side {padding: 2em 2em 5em 2em;background: #fff;display: block;border-bottom-right-radius: 8px;border-bottom-left-radius: 8px;}
#confirm .message {margin-top: -.5em;color: #757575;letter-spacing: 1px;}
#confirm .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;}
#confirm .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){ 
	.reglog{margin-top:0;}
	.reglog .col-1{display:none;}
	.reglog .col-2{flex-basis:100%;}
	.reglog .forms{width:100%;max-width:400px;margin:20px auto;}
}