body {
    font-size: .85em;
    font-family: 'Open Sans', Calibri, Sans-Serif !important;
    font-weight: 300;
    color: #232323;
    background-color: #fff;
    margin: 60px 0px;
}

header, footer, nav, section {
    display: block;
}

div.login {
    margin: 0px auto;
    width: 600px;
}

/*table.login {
    border: none;
    padding: 20px;
    width: 100%;
}*/

    table.login td {
        padding: 10px;
        vertical-align: top;
    }

table.header, table.footer {
    color: #666;
    font-size: .85em;
    width: 100%;
}

    table.footer td {
        padding: 10px;
        vertical-align: top;
    }

td.left {
    text-align: left;
}

td.center {
    text-align: center;
}

td.right {
    text-align: right;
}

td.separator {
    width: 5%;
}

a {
    text-decoration: none;
    color: #2618a3;
}

    a:hover {
        color: #3552dd;
    }

    a.gray {
        color: #666;
    }

hr {
    border: none;
    height: 0;
    border-bottom: 1px solid #bbb;
}

span.subtitulo {
    color: #4292cd;
    font-size: 2em;
    letter-spacing: -1px;
}

img.help {
    position: relative;
    float: left;
    top: -150px;
    left: 245px;
}

span.password-strength {
    display: inline-block;
    width: 40px;
}

.logoSi {
    width: 200px;
}


/* Inputs
-----------------------------------------------------------*/

.button-metro {
    -webkit-appearance: none;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: #3c76ad;
    color: #fff;
    font-size: 1em;
    font-weight: 300;
    font-family: 'Open Sans', Calibri, Sans-Serif;
    height: 28px;
    padding: 2px 15px;
    cursor: pointer;
}

    .button-metro:hover {
        background-color: #3552dd;
    }

    .button-metro:disabled {
        cursor: not-allowed;
        background-color: #ddd;
    }

span.label {
    color: #555;
    display: block;
    font-size: .85em;
}

.input-metro {
    border: 1px solid #bbb;
    font-size: 1em;
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
    height: 25px;
    margin-bottom: 5px;
    padding: 0px 5px;
    width: 250px;
}

    .input-metro.wide {
        width: 450px;
    }


/* Styles for basic forms
-----------------------------------------------------------*/
fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}

textarea {
    min-height: 75px;
}

.editor-label {
    margin: 1em 0 0 0;
}

.editor-field {
    margin: 0.5em 0 0 0;
}


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #d00;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #d00;
    /*background-color: #fee;*/
}

.validation-summary-errors {
    font-weight: bold;
    color: #f00;
}

.validation-summary-valid {
    display: none;
}

#PasswordStregth {
    width: 180px;
    float: left;
    height: 10px;
}

#strength-text {
    float: left;
    padding-left: 10px;
}


/* Responsive form mobile */
@media (max-width: 640px) {
    body {
        margin: 0;
    }

    div.login {
        width: 100%;
    }

    table.header td {
        padding: 0;
    }

    .logoSi {
        width: 230px;
    }

    .logoSdr, .hrLogin {
        display: none;
    }

    table.login {
        background-color: #3c76ad;
        padding: 40px 0px;
    }

    span.subtitulo, span.label {
        color: #fff !important;
    }

    span.subtitulo {
        font-size: 3em;
    }

    span.label {
        font-size: 1.3em;
    }

    a.linkReset {
        color: #fff;
    }

    .input-metro {
        font-size: 1.3em;
        height: 30px;
    }

    table.footer {
        background-color: #444;
        color: #ddd;
    }

    td.center {
        text-align: left;
    }

    td.version {
        text-align: right;
    }

    .gray, .digiCert {
        display: none;
    }

    .button-metro {
        background-color: #666;
        color: #fff;
        font-size: 1.3em;
        height: 60px;
        padding: 0;
        width: 260px;
    }
}