@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');


body {
  font-family: 'Poppins', sans-serif;
    font-size: 14px;
  font-weight: normal;
}
a{text-decoration: none;}

header{background: #192d73;}
.topbar{background:#f8d118!important;}
header h1{color: #fff; font-weight: 400; font-size: 2.2em;}
header .welcome{font-size:14px;}
header span{display: block; font-size: 20px; font-weight: normal; padding-top:5px;}
.mh_logo{height: 60px;}

.emb_logo{height: 60px;}

.mh_logo_dashboard{height: 45px; margin:8px 0 9px 30px;}



.yellow{width: 40%; background-color:#f8d118; position: relative; }
.yellow:after {
    background: #f8d118;
    box-shadow: .125rem 0 1.875rem rgba(0, 0, 0, .15);
    -webkit-clip-path: polygon(0 100%, 100% 0, 0 0);
    clip-path: polygon(0 100%, 100% 0, 0 0);
    content: "";
    height: 100%;
    position: absolute;
    right: -8.65rem;
    top: 0;
    width: 8.75rem;
    z-index: -1;
}

.login{width: 60%; padding-left: 8.75em;  height: 700px!important;}

.login:after {
    background-image:url(../images/mumbaiCity.jpg); background-repeat: no-repeat;
   background-position: bottom right;
    content: "";
    height: 100%;
    width: 100%;}

.login_content{border-radius: 5px; box-shadow: 0 0 35px 0 hsla(215, 9%, 64%, .15); max-width: 30%!important;  width: 100%; position: absolute;}
/*start login form*/

.login .form-group {
  position: relative;
  margin-bottom:0;
}

.login .form-control-placeholder {
  position: absolute;
  top: 0;
  padding: 7px 0 0 13px;
  transition: all 200ms;
  opacity: 0.5;
}

.login .form-control:focus + .form-control-placeholder,
.login .form-control:valid + .form-control-placeholder {
  font-size: 75%;
  transform: translate3d(0, -50%, 0);
  opacity: 1;
  background-color: white;
  padding: 0 5px;
  margin-left: 8px; 
}

.login .form-control:focus{ color: #212529; border: 1px solid #192d73;  outline: 0; box-shadow: none!important;}

.login .form-control {
    border-radius: 5px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .08);
    height: 56px;
    
    background-color:#fff!important;
}
/*end login*/

.ApplicantForm .form-control {
    border-radius: 5px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .08);
    height: 50px;
    background-color:#fff!important;
    color:#333!important;
    font-size:14px!important;
}

input::placeholder,
textarea::placeholder {
  color: #333!important;
}

input:-ms-input-placeholder,  /* IE 10-11 */
textarea:-ms-input-placeholder {
  color: #333!important;
}

input::-ms-input-placeholder, /* Edge */
textarea::-ms-input-placeholder {
  color: #333!important;
}
.ApplicantForm label{color:#000!important; padding:0 0 7px 0!important;}
.formBox{background: #f5f5f5;
    padding: 20px;
    border-radius: 10px;}
.formBox h5{font-size:14px; font-weight:bold; color:#333; }




.footer{background-image:none; padding-top:0; background-color:#000; position:fixed; bottom:0; width:100%; }

footer{background-image: url("../images/footer_img.jpg"); background-repeat:  repeat-x; padding-top:93px; background-color:#000}
footer p{color: #c7c7c7; margin:0; padding:0;}
footer a, footer a:focus, footer a:active, footer a:hover{color:#f8d118; }

/*for sidebar*/
    #sidebar {
      width: 250px;
      background: #1c2931;
      color: #fff;
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      padding-top: 4px;
      transition: all 0.3s;
      /*z-index: 1000;*/
    }

    #sidebar.collapsed {
     transform: translateX(-250px); /* slide off screen */
    }

    #sidebar ul {
      list-style: none;
      padding: 0;
     
    }

    #sidebar ul li a {
      display: block;
      padding: 10px 20px;
      color: #ccc;
      text-decoration: none;
       border-bottom: 1px solid #ffffff2e;
    }

#sidebar ul li a:hover{
  color: #fff;
  background-color: rgba(255, 255, 255, 0.1);
  outline: none;
}

#sidebar ul li a.active {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.15);
  font-weight: 500;
}

    #main-content {
      margin-left: 250px;
    
      transition: all 0.3s;
    
    }

    #main-content.full-width {
      margin-left: 0;
    }

    .sidebar-toggle {
    
    }
/*end sidebar*/

.topbar .btn-primary {
    background-color: #f8d118!important;
    border-color: #ffffff!important;
}

.topbar .btn-primary:hover, .btn-primary:active{
    background-color: #ebcc39!important;
    border-color: #ffffff!important;
}

.topbar .btn-primary:focus {
    box-shadow: none!important;
}

/* Optional – improve pagination look */
.grid-footer .pagination li {
    display: inline-block;
    margin: 0 4px;
}

.grid-footer .pagination li a,
.grid-footer .pagination li span {
    padding: 6px 12px;
    text-decoration: none;
    color: #0d6efd;
    border: 1px solid #dee2e6;
    border-radius: 5px;
}

.grid-footer .pagination li.active span {
    background-color: #0d6efd;
    color: #fff;
    border-color: #0d6efd;
}

.card{box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.1); border:0!important;}

.table > thead {
    background: #596770!important;
    color: #fff!important;
}

@media (max-width: 1024px) {
.login_content {max-width: 40%!important;}
.login{height: 550px!important;}
footer p{font-size: 12px;}
}

@media (max-width: 768px) {
.login{width: 100%!important; padding-left: 0!important; height: 550px!important;}
.login_content {max-width: 55%!important;}
.yellow{display: none!important;}
footer p{font-size: 10px;}
header h1 {font-size: 1.5em !important;}
header .welcome{font-size:12px;}
}

@media (max-width: 425px) {
.login{width: 100%!important; padding-left: 0!important; height: 500px!important;}
.login_content {max-width: 75%!important;}
header h1{font-size: 1em!important;}
header span{display: block; font-size: 14px; font-weight: normal; padding-top:5px;}
header .welcome{font-size:12px;}
}