*{
  box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -o-box-sizing:border-box;

  
}
body{
font-family: 'Roboto', sans-serif;
}
.login_wraper{padding: 20px 0 10px 0;background-size: cover; width: 100%; height: 100%; position: fixed; overflow-y:scroll;}
.login1{padding: 20px 0 10px 0; background:#9FB6CD; background-size: cover; width: 100%; height: 100%; position: fixed; overflow-y:scroll;}
.login2{padding: 20px 0 10px 0; background:#E0FFFF; background-size: cover; width: 100%; height: 100%; position: fixed; overflow-y:scroll;}
.login_wraper .carousel-control.left {
  background: transparent;
}
.login_wraper .carousel-control.right {
  background: transparent;
}
.login_wraper .carousel-inner img{
width: 100%;
}
.login_wraper .carousel-control{width: 5%;}
.login_wraper .carousel-caption{position: absolute; top: 20px; right: 30px; text-align: right;}
.login_wraper .carousel-caption ul li{display: inline-block; list-style-type: none;}
.login_wraper .carousel-caption p:first-child{font-size: 28px; color: #fddd00; font-weight: 500;}
.login_wraper .carousel-caption p{color: #2056a0; font-size: 28px; font-weight: 400; line-height: 1.1em;}
.login_wraper .login_form{background: #eee9e6; height: auto; width: 100%; margin-top: 20px;}
.login_wraper .login_form .login_details{padding-top: 27px;}
.login_wraper .login_form .login_details .form-control{border-radius: 0; margin-bottom: 20px; height: 40px;}
.login_wraper .login_form .login_details .pwd{padding-bottom: 10px; display: block; text-align: left; padding-left: 50px;width:40%;}
.login_wraper .login_form .login_details .pwd:hover{text-decoration:underline!important;}

.login_wraper .login_form .login_details .email{background: #eee9e6;}
.login_wraper .login_form .login_details .btn-default{width: 100%; background: #2056a0; padding: 10px 0; color: #fff; border: 1px solid #2056a0; font-size:20px;}
.login_wraper .login_form .login_details input[type="text"]{
        background:#fff url(../images/email.png)no-repeat 10px; padding-left: 55px;
    }
.login_wraper .login_form .login_details input[type="password"]{
        background:#fff url(../images/lock.png)no-repeat 10px; padding-left: 55px;
    }
.login_wraper .social_icons{padding-top: 20px;}
.login_wraper .social_icons li .fa-facebook{background: #6375a5; color: #fff; padding: 5px 12px; font-size:35px; margin-right: 10px; text-shadow:7px 4px 6px #294072;}
.login_wraper .social_icons li .fa-twitter{background: #6ecbee; color: #fff; padding: 5px; font-size:35px; text-shadow:5px 5px 6px #1b9df1;}
.login_wraper .right_blogs .img1{border: 2px solid #d8d8d8; padding: 5px; text-align: center;}
.login_wraper .right_blogs p{color: #1f56a0; padding-bottom: 5px; text-transform: uppercase; font-size: 16px;}
.login_wraper .right_blogs img{height: 95px; display: inline-block;}
.login_wraper .right_blogs figcaption{color: #454343; font-size: 13px; padding-top: 10px;}
.login_wraper .right_blogs .img2{border-left: 2px solid #d8d8d8; border-top: 2px solid #d8d8d8; border-right: 2px solid #d8d8d8;  padding: 12px; text-align: center;}
.login_wraper .footer_logo{padding-top: 10px;}
.login_wraper .footer_logo .text{float: left; background: #eee9e6; padding:15px 70px 3px 20px;}
.login_wraper .footer_logo .logo_bg{background: #eee9e6;}
.login_wraper .footer_logo .text p{border:none; padding:0;}
.login_wraper .footer_logo .text img{padding-left: 30px;}
.login_wraper .footer_logo p{text-align: justify; border: 2px solid #eee9e6; background: #eee9e6; padding: 10px; color: #2056a0;}







/******MEDIA QUERIES******/
/* Large screens ----------- */
@media only screen and (min-width : 1824px) {
.login_wraper{padding: 40px 0 10px;}
}
@media(max-width:768px){
  .login_wraper .col-sm-12{padding: 0;}
}
@media (min-width:600px) and (max-width:767px){
.login_wraper .footer_logo .logo_bg{margin-bottom: 20px;}
.login_wraper .footer_logo img{padding: 5px 0;}
}
@media (min-width:480px) and (max-width:599px){
  .login_wraper .footer_logo .logo_bg{margin-bottom: 20px;}
.login_wraper .footer_logo img{padding: 5px 0;}
.login_wraper .carousel-inner img{min-height: 250px;}
.login_wraper .carousel-caption p:first-child{font-size: 24px;}
.login_wraper .carousel-caption p{font-size: 20px;}
.login_wraper .social_icons li .fa-facebook{font-size: 30px;}
.login_wraper .social_icons li .fa-twitter{font-size: 29px;}
}
@media (min-width:375px) and (max-width: 414px){
.login_wraper .footer_logo .logo_bg{margin-bottom: 20px;}
.login_wraper .footer_logo img{padding: 5px 0;}
.login_wraper .carousel-inner img{min-height: 250px;}
.login_wraper .carousel-caption p:first-child{font-size: 24px;}
.login_wraper .carousel-caption p{font-size: 20px;}
.login_wraper .social_icons li .fa-facebook{font-size: 30px;}
.login_wraper .social_icons li .fa-twitter{font-size: 29px;}
}
@media (min-width:320px) and (max-width:479px){
.login_wraper .footer_logo .logo_bg{margin-bottom: 20px;}
.login_wraper .footer_logo img{padding: 5px 0;} 
.login_wraper .carousel-inner img{min-height: 250px;}
.login_wraper .carousel-caption p:first-child{font-size: 24px;}
.login_wraper .carousel-caption p{font-size: 20px;}
.login_wraper .social_icons li .fa-facebook{font-size: 30px;}
.login_wraper .social_icons li .fa-twitter{font-size: 29px;}
}

.login_wraper .login_form .code-input input[type=text] {
    width: 40px;
    height: 40px;
    text-align: center;
    font-size: 24px;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding-right: 37px;
}

.login-box {
    background: white;
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    width: 100%;
    max-width: 400px;
}
.auth-form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.auth-form h1,
.auth-form h2 {
    text-align: center;
    color: #333;
    margin-bottom: 1rem;
}

.btn-primary {
    background-color: #4a90e2;
    color: white;
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 4px;
    font-size: 1rem;
    cursor: pointer;
    width: 100%;
    transition: background-color 0.3s;
}

.btn-primary:hover {
    background-color: #357abd;
}

.btn-secondary {
    background-color: #f5f5f5;
    color: #333;
    padding: 0.75rem 1.5rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
    cursor: pointer;
    width: 100%;
    transition: background-color 0.3s;
}

.btn-secondary:disabled {
    background-color: #eee;
    color: #999;
    cursor: not-allowed;
}


.hidden {
    display: none;
}

.otp-container {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    margin: 1rem 0;
}

.otp-input{
    width: 40px !important;
    height: 40px !important;
    text-align: center;
    font-size: 1.25rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding-right: 7px !important;
}

.otp-input:focus {
    border-color: #4a90e2;
    outline: none;
}

.resend-container {
    text-align: center;
    margin: 1rem 0;
}

@media (max-width: 480px) {
    .login-box {
        padding: 1.5rem;
    }

    .otp-input {
        width: 35px;
        height: 35px;
    }
}

.container-fluid-login {
    max-width: 1280px;
}

.otp-container input {
    border: 0;
    /*background-color: #DEDBDB !important;*/
    background-color: #cfe2ff !important;
    color: black !important;
    font-weight: bold !important;
}

.ibtn {
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-family: Lato, sans-serif !important;
    background-color: #23394A !important;
    padding: 6px 28px !important;
    width: 35%  !important;
    font-weight: bold !important;
}
