body {
    font-family: Calibri,Tahoma;
    background-color: #f6f6f6;
}
.input-group {
    padding-bottom: 20px;
}
.txtStyle {
    font-family: Calibri,Tahoma;
    font-size: 1em;
    margin: 0px;
}
.logoTitle {
    font-size: 1.8em;
    color: #0059BF;
    font-weight: 900;
    padding: 15px;
}
.title {
    font-size: 2em;
    color: black;
    font-weight: bold;
    letter-spacing: 1px;
}
.row {
    margin-right:0px;
    margin-left:0px;
}
.label {
    font-family: Calibri,Tahoma;
    font-size: 1em;
    color: #333;
}

.SigninButton {
    background-image: url(../Content/img/SignInButton.png);
    width: 336px;
    height: 59px;
}

.SigninButtonHottracked {
    background-image: url(../Content/img/SignInButtonActive.png);
}

.wrapper .sign-in-wrapper .sign-in-inner .login-area a img.SigninButton {
    height: 50px;
    background-size: 100% 100%;
}

.wrapper .sign-in-wrapper .sign-in-inner .login-area a img.SigninButtonHottracked {
    height: 50px;
    background-size: 100% 100%;
}

.dxeTextBox_Material {
    font-size: 1em;
}
.sign-in-inner .login-area .login-brand {
    margin-bottom: 20px;
}
.m-bottom-md{margin-bottom:20px}
.p-left{padding-left:16px;}
.m-top-md{margin-top:20px}
.p-top-sm {padding-top: 10px; padding-left:16px;}
.p-top-ms{padding-top:30px; padding-left:145px;}
.push {margin-top: 15px; }

.pull{
    margin-top: -10px;
}
.wrapper {
    position: relative;
    overflow: hidden;
    padding-top: 54px;
    min-height: 100%;
    padding-bottom: 45px;
}
.login-area {
    margin-top: 45px;
    margin-left: 300px;
    margin-right: 20px;
    min-height: 390px;
}

.login-input-area {
    /*margin-top: 35px;*/
    margin-left: 40px;
    margin-right: 40px;
    min-height: 350px;
}

.preload * {
    animation: none !important;
    -webkit-animation: none !important;
    -moz-animation: none !important;
    -ms-animation: none !important;
    -o-animation: none !important;
}
.sign-in-wrapper {
    min-height: 80vh;
    display: flex;
    align-items: center;
}
::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
.sign-in-wrapper .sign-in-inner {
    /*width: 770px;*/
    margin: auto;
    display: flex;
}

    .sign-in-wrapper .sign-in-inner > form {
        background: url(../Content/img/loginarea.png) no-repeat;
        /*width: 770px;*/
        height: 550px;
        padding: 20px;
        box-shadow: inset 0 0 0 rgba(0,0,0,0.1), 0 0 0 2px rgb(255,255,255), 0.3em 0.3em 1em rgba(0,0,0,0.1);
        border-radius: 25px;
    }

   
/*@media only screen and (max-width: 799px) {*/
    .sign-in-wrapper .sign-in-inner {

        margin: auto;
        display: flex;
    }

    .sign-in-wrapper .sign-in-inner > form {
        background: url(../Content/img/loginarea-blank.png) no-repeat;
        width: 442px;
        height: 580px;
        background-size: 100% 100%;
    }

    .wrapper .sign-in-wrapper .sign-in-inner .login-area {
        margin-left: 0px;
        margin-right: 0px;
    }
    .wrapper .sign-in-wrapper .sign-in-inner .login-area .login-input-area {
        margin-left: 50px;
        margin-right: 50px;
        min-height: 350px;
    }
    .wrapper .sign-in-wrapper .sign-in-inner .login-area a img.SigninButton {
        width: 310px;
        height: 47px;
        background-size: 100% 100%;
    }

    .wrapper .sign-in-wrapper .sign-in-inner .login-area a img.SigninButtonHottracked {
        width: 310px;
        height: 47px;
        background-size: 100% 100%;
    }
    
/*}*/
@media only screen and (max-width: 579px) {
    .sign-in-wrapper .sign-in-inner {
        width: 95%;
        margin: auto;
        display: flex;
    }

    .sign-in-wrapper .sign-in-inner > form {
        background: url(../Content/img/loginarea-blank.png) no-repeat;
        width: 390px;
        height: 620px;
        background-size: 100% 100%;
    }

    .wrapper .sign-in-wrapper .sign-in-inner .login-area {
        margin-left: 0px;
        margin-right: 0px;
    }
        .wrapper .sign-in-wrapper .sign-in-inner .login-area a img.SigninButton {
            width: 255px;
            height: 47px;
            background-size: 100% 100%;
        }

        .wrapper .sign-in-wrapper .sign-in-inner .login-area a img.SigninButtonHottracked {
            width: 255px;
            height: 47px;
            background-size: 100% 100%;
        }
}
@media only screen and (max-width: 370px) {
    .sign-in-wrapper .sign-in-inner {
        width: 95%;
        margin: auto;
        display: flex;
    }
}

.CommentsErrorValidator {
    display: block;
    float: right;
    margin-right: 4.3em;
    margin-top: -0.1em;
}

/*forget password*/
.mainwrapper .inner {
    width: 550px;
    margin: auto;
    display: flex;
}
.mainwrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
}
    .mainwrapper .inner > form {
        background: url(../Content/img/loginarea-blank.png) no-repeat;
        width: 550px;
        height: 550px;
        padding: 20px;
        box-shadow: inset 0 -3em 3em rgba(0,0,0,0.1), 0 0 0 2px rgb(255,255,255), 0.3em 0.3em 1em rgba(0,0,0,0.3);
        border-radius: 25px;
    }
    .mainwrapper .inner > form .login-area {
        margin-top: 40px;
        margin-left: 0px;
    }
@media only screen and (max-width: 750px) {
    .mainwrapper .inner {
        width: 75%;
        margin: auto;
        display: flex;
    }

    /*.login-area {
        margin-top: 20px;
        margin-left: 0px;
    }*/
    .mainwrapper .inner > form {
        height: 600px;
    }
}

@media only screen and (max-width: 499px) {
    .mainwrapper .inner {
        width: 90%;
        margin: auto;
        display: flex;
    }
        .mainwrapper .inner > form {
            background: url(../Content/img/loginarea-blank.png) no-repeat;
            height: 650px;
        }
}