body {

    background: #ddd

}

form {

    margin: 0 auto;

    margin-top: 5rem;

    width: 100%;

    max-width: 350px;

    padding: 2rem;

    background: #fff;

    border-radius: 3px;

    -webkit-box-shadow: 0px 2px 11px 3px rgba(0,0,0,0.14);

    -moz-box-shadow:    0px 2px 11px 3px rgba(0,0,0,0.14);

    box-shadow:         0px 2px 11px 3px rgba(0,0,0,0.14);

}

button.btn-circle {

    height: 50px;

    width: 50px;

    font-size: 2rem

}

button.btn-circle:hover {

    box-shadow: 0 2px 2px rgba(0,0,0,0.2),0 6px 10px rgba(0,0,0,.3)

}

header {

    background: #0a4f7d;

    color: #fff;

    text-align: center;

    padding: 1rem;

}

small {

    display: block;

    padding-top: 1rem;

    text-align: center;

}

.form-header {

    text-align: center;

    margin-bottom: 1.5rem;

    font-variant: small-caps;

    font-size: 3rem

}

.form-header i {

    font-size: 1.2rem;

}

.div-submit {

    margin-top: 2rem;

    text-align: center

}

.err {

    color: #cd5c5c;

    font-size: 1.4rem;

    font-weight: 700;

    text-align: center

}

.mif-lock,

.mif-user,

.mif-anchor {

    float: right;

    position: relative;

    right: 1rem;

    top: 2.5rem

}

input[type="text"], input[type="password"], select {

    height: 4rem;

}

.forgot-password:hover {

    color: #09f;

    text-decoration: underline;

    cursor: pointer;

}

.close-modal-btn {

    position: relative;

    font-size: 6rem;

    color: #ccc;

}

.close-modal-btn:hover {

    color: #09f;

    cursor: pointer;

}