.left-pane {background-color:#f9fafb;padding: 20px 50px;}

.left-pane img {max-width: 100%;}

.1right-pane {width: 40%;max-width: 500px;}

.top-banner1 {position:absolute; top: 10px;left: 10px;}

input[type=text],input[type=password] {width: 100%;}

.alert2,.alert {display:none;}



.input-row  {margin-bottom:20px;margin-top:5px;}

.loginErr {color: red;}

.login-pane .page-header {margin-bottom: 0px !important;}

#txtAccessCode {width: 150px !important;}

.info.mobile {display:none;}
.login-container,.lang-container {margin-left:auto;margin-right:auto;}

.verify-char {width: 80% !important;}


@media only screen and (min-width: 768px) {
    .left-pane img {max-width: 100%;}
     .login-container {margin-top:35%;}
    
}

@media only screen and (min-width: 576px) {
    .login-container {margin-top:40%;}
    .login-container,.lang-container {width:75%; }
    .lang-container {padding-top:20px;}
}

@media only screen and (max-width: 576px) {
    .left-pane img {max-width: 75%;}
    .left-pane {background-color:transparent;}
    .login-container {width:75%; margin-top:20px;}
    .info {display:none;}    
    .info.mobile {display:block; text-align:center;}    
    input[id$=btnLogin],input[id$=btnGetAccessCode] {width: 100%;}
    .lang-container {margin-left:0px;}

}

@media only screen and (max-width: 375px) {
    .img-container {margin-top:20px;}
    .left-pane img {max-width: 160px}
    .login-container {width:85%; margin-top:20px;}
    
    .page-header {text-align:center;}
    .left-pane {background-color:white;}

}