﻿body{
    margin:0;
    padding:0;
    width:100%;
    height:100%;
    font-size:18px;
    overflow-x:hidden;
}

.account-login-content {
    background: #fff;
    background-size: cover;
    height: 100vh;
    justify-content: center;
    width: 100vw;
    min-width: 320px;
    align-items: center;
}

.account-login-content h2 span{
    display:block;
    width:100%;
}

    .account-login-content h2 span.sub {
        font-size:1.1rem!important;
    }

.account-login-content div{
    box-sizing:border-box;
}

    .account-login-content .login-content {
        margin: auto 0;
    }

.account-login-content:before {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    display: block;
    opacity: .3;
}

    .account-login-content.morning {
        background: url(/content/admin/img/bg.jpg) no-repeat center center;
        background-size: cover;
    }

        .account-login-content.morning:before {
            background: #FFC000;
        }

    .account-login-content.day {
        background: url(/content/admin/img/bg-day.jpg) no-repeat center center;
        background-size: cover;
    }

        .account-login-content.day:before {
            background: #77C0FF;
        }

    .account-login-content.night {
        background: url(/content/admin/img/bg-night2.jpg) no-repeat center center;
        background-size: cover;
    }

        .account-login-content.night:before {
            background: #77C043;
        }

    .account-login-content .inner {
        max-width: 515px;
        justify-self: center;
        margin-left: auto;
        margin-right: auto;
    }

    .account-login-content .account-login {
        padding: 4em;
        min-width: 320px;
        width: 98%;
        min-width: 300px;
        max-width: 40vw;
        justify-content: center;
        position: relative;
        z-index: 10;
        display:flex;
        justify-self: flex-end;
        align-self: flex-start;
        margin-left: auto;
        height: 100vh;
        align-items: center;
        min-width: 300px;
        background: #fff;
        flex-direction:column;
    }

        .account-login-content .account-login img {
            margin-bottom: 2em;
            margin-right: auto;
            max-height: 10px;
        }

        .account-login-content .account-login div, .account-login-content .account-login .k-textbox {
            width: 100%;
        }

        .account-login-content .account-login span, .account-login-content .account-login .k-textbox {
            font-size: 1rem;
        }

       .account-login-content .account-login .k-button {
            font-size: 1.3rem;
        }

      
        .account-login-content .account-login .k-textbox {
            margin-bottom: .6em;
            margin-top: .2em;
            min-height: 45px;
            background: #EBEBEB;
        }


        .account-login-content .account-login .k-button {
            width: 100%;
            margin-top: .3em;
            padding: 1em 0;
            background: rgba(0,0,0,0.8);
            color: #fff;
        }

            .account-login-content .account-login .k-button:hover {
                background: rgba(0,0,0,1.0);
            }

        .account-login-content .account-login h1 {
            text-align: center;
            margin-bottom: 2em;
            width: 100%;
            font-weight: 600;
            font-size:2rem;
        }

    .account-login-content h2, .account-login-content h2 span {
        font-size: 2.5rem !important;
    }

    .account-login-content span#Note.ie {
        color: #ff3500 !important;
        display: block;
        font-size: 1rem !important;
        font-weight: bold;
        margin-bottom: 1em !important;
    }

    .account-login-content span#Note a {
        text-decoration: underline;
    }

    .account-login-content h2 {
        margin-bottom: 1em;
        font-weight: normal;
    }

    .account-login-content .copy-info {
        align-self: flex-end;
        font-family: 'Open Sans', sans-serif;
        margin-top:auto;
    }

        .account-login-content .copy-info p, .account-login-content .copy-info p a {
            margin-bottom: .5em;
            font-family: 'Open Sans', sans-serif;
            font-size: .8rem;
        }

            .account-login-content .copy-info p a {
                color: #77C0FF;
            }

                .account-login-content .copy-info p a:hover {
                    opacity: .8;
                }

            .account-login-content .copy-info p:last-of-type {
                margin-bottom: 0;
            }


@media only screen and (min-width : 0px) and (max-width : 65rem) {
    .account-login-content .account-login {
        max-width: 80vw;
    }
}

@media only screen and (min-width : 0px) and (max-width : 45rem) {
    .account-login-content {
        align-items: center;
        align-content: center;
        justify-content: center;
        display: flex;
    }

    .account-login-content .account-login {
        padding: 4em 2em;
        width: 92%;
        min-width: 300px;
        justify-content: center;
        justify-self: center;
        align-self: center;
        margin:auto;
        height: auto;
    }

    .account-login-content .copy-info {
        margin-top: 2em;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .account-login-content .account-login {
        margin-right: auto;
    }
}
