.main.login .login__leftColEuronet{
background:top left / cover no-repeat url(../images/login/left-eur-bg.jpg);
}

.main.login .login__leftColPOC{
    background:top left / cover no-repeat url(../images/login/poc.jpg);
}    

.main.login .login__leftCol{
background:top left / cover no-repeat url(../images/login/left-idfc-bg.jpg);
}

.main.login .login__rightCol-container{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
position:relative;
}
.main.login .login__rightCol-setting{
position: absolute;
top: 6%;
right: 15%;
}
.main.login .login__rightCol-setting > a > span{
color:#000000;
font-size:calc(1.6rem + 0.22vw);
}
.main.login .login__rightCol-logo > a{
display:inline-block;
}
.main.login .login__rightCol-logo > a > img.logo-dark{
display:none;
}

.main.login .login__rightCol-sub{
width:100%;
}

.main.login .login__rightCol-sub .form-group {
position:relative;
}
.main.login .login__rightCol-sub .form-group > .form-control{
border:0px;
background-color:#F7F8FA;
}
.main.login .login__rightCol-sub .form-group > .form-control.focus,.main.login .login__rightCol-sub .form-group > .form-control:focus{
box-shadow:none;
}
.main.login .login__rightCol-sub .form-group > .form-control + span[class^="material-icons"]{
position: absolute;
top: 0.7rem;
left: 0.6rem;
color:#7B7C7D;
}
.main.login .login__rightCol-sub .form-group.user-name > .form-control + span[class^="material-icons"]{
top: 0.75rem;
}
.main.login .login__rightCol-sub .form-group.password > .form-control + span[class^="material-icons"]{
top: 0.85rem;
}
.main.login .login__rightCol-sub .form-group.forgot-pass > a{
color:#7B7C7D;  
}
.main.login .login__rightCol-sub .btn.submit{
font-family:'Roboto-Light';
color:#FFFFFF;
background-color:#25D366;
border-radius:0.3rem;
}


/* Login dark-theme styling started */

.dark{
background:#1A202E;
}
.dark .main.login .login__rightCol-logo > a >img.logo-light{
display:none;
}
.dark .main.login .login__rightCol-logo > a >img.logo-dark{
display:block;
}
.dark .main.login .login__rightCol-setting > a > span {
    color: #ffffff;
}
.dark .main.login .login__rightCol-sub .form-group > .form-control {
    background-color: #242D40;
}
.dark .main.login .login__rightCol-sub .form-group > .form-control + span[class^="material-icons"] {
    color: #9296A0;
}
.dark .main.login .login__rightCol-sub .form-group > .form-control {
color:#9296A0;
}
.dark .main.login .login__rightCol-sub .form-group > .form-control::placeholder {
    color:#9296A0;
    }
.dark .main.login .login__rightCol-sub .form-group > .form-control::-moz-placeholder {
    color:#9296A0;
    }
.dark .main.login .login__rightCol-sub .form-group > .form-control::-webkit-input-placeholder {
    color:#9296A0;
    }
.dark .main.login .login__rightCol-sub .form-group.forgot-pass > a {
    color: #BBBDC1;
}
    
    

/* Login dark-theme styling ended */

@media screen and (max-width:1500px){
.main.login .login__rightCol-sub{
max-width:315px;
}
.main.login .login__rightCol-logo{
margin-bottom:4.5rem;
}
.main.login .login__rightCol-logo > a >img{
width:205px;
}
.main.login .login__rightCol-sub .form-group.user-name {
margin-bottom: 1.65rem;
}
.main.login .login__rightCol-sub .form-group.password {
margin-bottom: 1rem;
}
.main.login .login__rightCol-sub .form-group.forgot-pass{
margin-bottom: 1.75rem;
}
.main.login .login__rightCol-sub .form-group > .form-control{
height:calc(2.375em + .75rem + 2px);
padding-left:2.6rem;
}
.main.login .login__rightCol-sub .btn.submit{
    padding: 0.75rem;
    width: 150px;
}
}

@media screen and (max-width:1800px) and (min-width:1501px){
.main.login .login__rightCol-sub{
max-width:350px;
}
.main.login .login__rightCol-logo{
margin-bottom:5rem;
}
.main.login .login__rightCol-logo > a >img{
width:220px;
}
.main.login .login__rightCol-sub .form-group.user-name {
margin-bottom: 1.6rem;
}
.main.login .login__rightCol-sub .form-group.password {
margin-bottom: 1.1rem;
}
.main.login .login__rightCol-sub .form-group.forgot-pass{
margin-bottom: 1.85rem;
}
.main.login .login__rightCol-sub .form-group > .form-control{
height:calc(2.45em + .75rem + 2px);
padding-left: 2.6rem;
}
.main.login .login__rightCol-sub .btn.submit{
padding: 0.775rem;
width: 155px;
}
}
@media screen and (min-width:1801px){
.main.login .login__rightCol-sub{
max-width:400px;
}
.main.login .login__rightCol-logo{
margin-bottom:6rem;
}
.main.login .login__rightCol-logo > a >img{
width:235px;
}
.main.login .login__rightCol-sub .form-group.user-name {
margin-bottom: 1.75rem;
}
.main.login .login__rightCol-sub .form-group.password {
margin-bottom: 1.25rem;
}
.main.login .login__rightCol-sub .form-group.forgot-pass{
margin-bottom: 2rem;
}
.main.login .login__rightCol-sub .form-group > .form-control{
height:calc(2.7rem + .75rem + 2px);
padding-left: 2.7rem;
}
.main.login .login__rightCol-sub .form-group.user-name > .form-control + span[class^="material-icons"] {
top: 1.1rem;
}
.main.login .login__rightCol-sub .form-group.password > .form-control + span[class^="material-icons"] {
top: 1.15rem;
}
.main.login .login__rightCol-sub .btn.submit{
padding: 0.8rem;
width: 165px;
}
}

@media screen and (min-width:1201px){
.main.login .login__rightCol-sub .form-group > .form-control{
font-size: calc(0.587rem + 0.22vw);
}
.main.login .login__rightCol-sub .form-group.user-name > .form-control + span[class^="material-icons"]{
font-size: calc(1.1rem + 0.22vw);
}
.main.login .login__rightCol-sub .form-group.password > .form-control + span[class^="material-icons"]{
font-size: calc(0.825rem + 0.22vw);
}
.main.login .login__rightCol-sub .btn.submit{
font-size: calc(0.54rem + 0.22vw);  
}
}

@media screen and (max-width:1200px){
.main.login .login__rightCol-sub .form-group > .form-control{
font-size: 0.8rem ;
}
.main.login .login__rightCol-sub .form-group.user-name > .form-control + span[class^="material-icons"]{
font-size: 1.35rem;
}
.main.login .login__rightCol-sub .form-group.password > .form-control + span[class^="material-icons"]{
font-size: 1.1rem;
}
.main.login .login__rightCol-sub .btn.submit{
font-size: 0.75rem ; 
}
}

@media screen and (max-width:767px){
.main.login .login__rightCol{
background:top left / cover no-repeat url(../images/login/left-bg.jpg);
background-attachment: fixed;
}
.main.login .login__rightCol-setting > a > span{
color:#ffffff;
}
.main.login .login__rightCol-sub .form-group.forgot-pass > a{
color:#ffffff;
}

/* Login dark-theme styling started */

.dark .main.login .login__rightCol {
    height: 100vh;
}
.dark .main.login .login__rightCol-container {
    top: 15px;
    background: rgba(0,0,0,0.7);
    border-radius: 0.25rem;
    height: calc(100vh - 30px);
}

/* Login dark-theme styling ended */

}

@media screen and (max-height:400px){
    .main.login .login__rightCol-logo {
        margin-bottom: 1.5rem;
    }
    .main.login .login__rightCol-sub .form-group.user-name {
        margin-bottom: 1.35rem;
    }
    .main.login .login__rightCol-sub .form-group.password {
        margin-bottom: 0.7rem;
    }
    .main.login .login__rightCol-sub .form-group.forgot-pass {
        margin-bottom: 1.25rem;
    }
}
