<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<style>
body {
margin: 0;
padding: 0;
background: -webkit-linear-gradient(left,rgb(182, 182, 204), rgb(72, 72, 179));
height: 100vh;
}
#login .container #login-row #login-column #login-box {
margin-top: 240px;
width: 600px;
height: 350px;
box-shadow: #000000;
border-radius: 60px;
background-color: #000000;
}
#login .container #login-row #login-column #login-box #login-form {
padding: 25px;
color: white;
}
#login .container #login-row #login-column #login-box #login-form #register-link {
margin-top: -85px;
}
a {
color: white !important;
}
</style>
<title>Bootstrap Login dan Contact Message</title>
</head>
<body>
<div id="login">
<div class="container ">
<div id="login-row" class="row justify-content-center align-items-center ">
<div id="login-column" class="col-md-6 ">
<div id="login-box" class="shadow col-md-12 ">
<form id="login-form" class="form rounded-3" action="" method="post">
<h3 class="text-center ">Login form</h3>
<div class="form-group">
<label for="username">Username:</label><br>
<input type="text" name="username" id="username" class="form-control">
</div>
<div class="form-group">
<label for="password">Password:</label><br>
<input type="text" name="password" id="password" class="form-control">
</div>
<div class="form-group">
<label for="remember-me"><span>Remember me</span> <span><input id="remember-me" name="remember-me" type="checkbox"></span></label><br>
<input type="submit" name="submit" class="btn btn-light" value="submit">
</div>
<div id="register-link" class="text-right" style="color: white !important;">
<a href="contact.html">Contact Us</a>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>