body {
    background: #efefef;
}

.login {
    background:#efefef; width:100%; min-height:875px;
}

.login-logo {
    padding:20px 0 40px 0;
}

.login-left {
    width:40%; 
    height:100%;
    float:left;
    padding:0 20px 0 20px;
    background:#efefef;
}

.login-right {
    width: 60%;
    height: 100%;
    float: left;
    background: #efefef;
}

.login-right img {
    height:100%;
    float:right;
}

.login-orange {
    background: #ff4e00;
    border: 1px solid #ff4e00;
    color:#fff;
}

.login-forgot {
    padding-top: 25px;
}

.login-forgot a {
    color:#666;
}

.login-forgot a:hover {
    color:#888;
}

@media only screen and (max-width: 1850px) {
    body {
        background: #25317b;
    }

    .login {
        min-height: 950px;
    }

    .login-logo {
        padding: 20px 0 20px 0;
        margin: 0 auto;
        text-align: center;
    }

    .login-left {
        width: 40%;
        height: auto;
    }

    .login-right {
        width: 60%;
        height: auto;
        padding: 0;
    }

        .login-right img {
            width: 100%;
            height: auto;
            max-height:925px;
        }
}


@media only screen and (max-width: 1024px) {

    .login-logo {
        padding: 20px 0 20px 0;
        margin: 0 auto;
        text-align: center;
    }

    .login-left {
        width: 100%;
        height: auto;
    }

    .login-right {
        width: 100%;
        height: auto;
        padding: 0;
    }

        .login-right img {
            width: 100%;
            height: auto;
        }
}



@media only screen and (max-width: 600px) {

    .login-logo {
        padding: 20px 0 20px 0;
        margin:0 auto;
        text-align: center;
    }

    .login-left {
        width: 100%;
        height: auto;
    }

    .login-right {
        width: 100%;
        height:auto;
        padding:0;
    }

    .login-right img {
        width:100%;
        height:auto;
    }
}