*,
*::before,
*::after { box-sizing: border-box; }
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; }

html, body { height: 100%; }
body { margin: 0; padding: 0; font-family: 'Open Sans'; font-weight: 300; background: url(bg1.jpg) no-repeat center center; background-size: cover; }

h4 { margin: 0 0 15px 0; font-size: 18pt; }
hr { color: #fff; background: #fff; border: none; border-top: solid 1px #ccc; }

.logo { text-align: center; position: relative; }
.logo img { height: 60px; margin: 15px 0; }
.logo span { position: absolute; top: -25px; right: -25px; background: #ff6a00; color: #fff; padding: 6px 10px; font-size: 8pt; border-radius: 0 0 0 5px; font-weight: bold; }

section { width: 400px; background: white; border-radius: 5px; box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-60%); overflow: auto; }
section .form-horizontal { padding: 25px; }

input[type=text], input[type=password] { border: solid 1px #ccc; padding: 7px; background: white; border-radius: 3px; width: 100%; }
input[type=submit] { padding: 5px 7px; font-family: 'Open Sans'; margin-top: 15px; width: 100%; background: #98b920; border: none; border-radius: 3px; padding: 7px 0; color: #fff; font-weight: bold; font-size: 11pt; cursor: pointer; transition: background-color .15s ease-in-out  }
input[type=submit]:hover { background-color: #b0d528; }

.form-group { position: relative; }
.required { position: absolute; top: 25px; right: 7px; font-size: 16pt; font-weight: 800; }
.login { margin: 25px auto; width: 265px; }

label { font-size: 11pt; }
.control-label { display: block; margin: 10px 0 5px; }
.text-danger { color: #0094ff; }