html,
body {
    height: 100%;
}

body {
    display: flex;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: #f5f5f5;
}

main {
    width: 100%;
    max-width: 400px;
    padding: 15px;
    margin: auto;
}

    main .checkbox {
        font-weight: 400;
    }

    main .form-control {
        position: relative;
        box-sizing: border-box;
        height: auto;
        padding: 10px;
        font-size: 16px;
    }

        main .form-control:focus {
            z-index: 2;
        }

#loginForm input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

#loginForm input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.field-validation-error {
    color: #f14c38;
}

.validation-summary-errors {
    color: #f14c38 !important;
    text-align: start;
}

    .validation-summary-errors ul {
        padding: 0;
    }

    .validation-summary-errors li {
        list-style-type: none;
        font-weight: normal !important;
        font-size: 12px;
        color: #f14c38 !important;
    }

.widepage {
    width: 80vw;
    position: relative;
    left: calc(-40vw + 50%);
}

.cryptedmail:after {
    content: attr(data-name) "@" attr(data-domain) "." attr(data-tld);
}

.cursor-pointer {
    cursor: pointer;
}