.mini-form { position: absolute; top: 10px; right: 10px; width: 320px; background: #ededed; border-radius: 0 0 15px 15px; border: 1px solid #00afaa }
.mini-form-header { background: teal; padding: 10px 20px 5px 20px; color: #fff; border-bottom: 10px solid #006f6f }
.mini-form h1 { margin: 0 0 10px 0 }
.login { padding: 0; margin-top: 150px; border: 1px solid #00afaa; border-radius: 11px }
.form-area, .info-area { height: 335px }
.info-area { background: #00a19a; color: #fff; padding: 20px; border-radius: 10px 0 0 10px; position: relative; overflow: hidden }
    .info-area:before { content: ""; background-image: url(../Content/images/runner-new.jpg); top: 0; left: 0; right: 0; bottom: 0; position: absolute; z-index: 0; opacity: .2; background-size: cover; background-position-x: 70% }
    .info-area .info-content { z-index: 5; position: relative }
.form-area { padding: 20px; border-radius: 0 10px 10px 0; position: relative; overflow: hidden; background: #fff }
form h1 { margin-top: 0 }
body { margin: 0 }
h1 { font-size: 2em; margin: .67em 0 }
svg:not(:root) { overflow: hidden }
input { color: inherit; font: inherit; margin: 0 }
    input[type=submit] { -webkit-appearance: button; cursor: pointer }
    input::-moz-focus-inner { border: 0; padding: 0 }
input { line-height: normal }

@media print {
    * { text-shadow: none !important; color: #000 !important; background: 0 0 !important; box-shadow: none !important }
    p { orphans: 3; widows: 3 }
}

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }
:after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }
body { font-family: "Open Sans",Helvetica,Arial,sans-serif; font-size: 13px; line-height: 1.42857143; color: #333; background-color: #fff }
input { font-family: inherit; font-size: inherit; line-height: inherit }
h1 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit }
h1 { margin-top: 18px; margin-bottom: 9px }
h1 { font-size: 21px }
p { margin: 0 0 9px }
.text-center { text-align: center }
.container-fluid { margin-right: auto; margin-left: auto; padding-left: 10px; padding-right: 10px }
.row { margin-left: -10px; margin-right: -10px }
.col-md-10, .col-md-14 { position: relative; min-height: 1px; padding-left: 10px; padding-right: 10px }

@media (min-width:700px) {
    .col-md-10, .col-md-14 { float: left }
    .col-md-14 { width: 58% }
    .col-md-10 { width: 42% }
    .login { width: 590px }
}

@media(max-width:700px) {
    .info-area { height: 140px; border-radius: 10px }
    .form-area { height: 260px; border-radius: 0 0 10px 10px }
    .login { width: 340px; margin: 80px auto auto auto }
    .center { width: 100% !important }
}

label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700 }
.form-control { display: block; width: 100%; height: 36px; padding: 8px 12px; font-size: 13px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s }
    .form-control:focus { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6) }
    .form-control::-moz-placeholder { color: #999; opacity: 1 }
    .form-control:-ms-input-placeholder { color: #999 }
    .form-control::-webkit-input-placeholder { color: #999 }
.form-group { margin-bottom: 15px }
.btn { display: inline-block; margin-bottom: 0; font-weight: 700; text-align: center; vertical-align: middle; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 8px 12px; font-size: 13px; line-height: 1.42857143; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none }
    .btn:active:focus, .btn:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px }
    .btn:focus, .btn:hover { color: #333; text-decoration: none }
    .btn:active { outline: 0; background-image: none; -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.125); box-shadow: inset 0 3px 5px rgba(0,0,0,.125) }
.btn-default { color: #333; background-color: #fff; border-color: #ccc }
    .btn-default:active, .btn-default:focus, .btn-default:hover { color: #333; background-color: #e6e6e6; border-color: #adadad }
    .btn-default:active { background-image: none }
.container-fluid:after, .container-fluid:before, .row:after, .row:before { content: " "; display: table }
.container-fluid:after, .row:after { clear: both }
.hidden { display: none !important; visibility: hidden !important }
.bg-default { background-color: #fff }
.bg-light-color { background-color: rgba(81,186,182,.09) }
.form-group label { font-weight: 400 }
.btn { -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2); box-shadow: inset 0 1px 0 rgba(255,255,255,.2); font-weight: 700 }
    .btn.btn-default { background-image: -webkit-linear-gradient(top,#fafafa 0,#e1e1e1 100%); background-image: -o-linear-gradient(top,#fafafa 0,#e1e1e1 100%); background-image: linear-gradient(to bottom,#fafafa 0,#e1e1e1 100%); background-repeat: repeat-x }
        .btn.btn-default:hover { background-image: -webkit-linear-gradient(top,#e1e1e1 0,#e1e1e1 100%); background-image: -o-linear-gradient(top,#e1e1e1 0,#e1e1e1 100%); background-image: linear-gradient(to bottom,#e1e1e1 0,#e1e1e1 100%); background-repeat: repeat-x }
.right { float: right !important }
.center { margin: auto; width: 590px; padding: 10px }