body {
  background: #0288d1;
  background-image:url(../images/loginBg.jpg);
  background-size:cover;
  background-position: bottom;
}

a {
  transition: all .2s ease-in-out;
  color: #0cc7d5;
}

a:hover, a:focus {
  color: #000;
  text-decoration: none;
}
.loginArea>.row {
    height: 100%;
}
.loginBox{background:#fff;border-radius: 5px;box-shadow: 0 0 11px rgba(0, 0, 0, 0.7);}
.login-header{display:block;padding: 10px 20px; border-bottom: 1px solid #eee; position:relative}
@keyframes sliding {
    from {
        transform: scaleX(0);
        opacity:0;
    }

    to {
        transform: scaleX(1);
        opacity:1;
    }
}
.login-header .loader {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    width: 100%;
    animation-name: sliding;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    transition: .5s ease-in;
    background: #0cc7d5;
    transform-origin: left;
    display: none;
}

.login-header img{display:inline-block;vertical-align:middle;width: 20%;}
.login-header h1{display:inline-block;vertical-align:middle;width: 75%;font-size: 2.5em;margin-left: 15px;}
.login-header h1>span{font-size: 2rem;margin-bottom:5px;display:block;color: #0cc7d5;}
.login-header h1>small{display:block;font-size:1.2rem}
.login-tabs{margin: 10px 0;}
.login-tabs .nav-item{}
.login-tabs .nav-item .nav-link{font-size:1.25em;position:relative;color: #b5b5b5;}
.login-tabs .nav-item .nav-link:hover{color:#333}
.login-tabs .nav-item .nav-link:after{
  position:absolute;
  bottom:0;
  left:0;
  content:'';
  height:2px;
  width:100%;
  background:#0cc7d5;
  display:none;
}
.login-tabs .nav-item.active .nav-link{color: #333;}
.login-tabs .nav-item.active .nav-link:after{display:block}
.login-body{
    padding: 15px 20px;
}
.login-body .form-group{margin-bottom: 25px;}


.login-body .form-group .input-group{}
.login-body .form-group .input-group .input-group-prepend{}
.login-body .form-group .input-group .input-group-prepend .input-group-text{
    background: transparent;
    border: 0;
    border-bottom: 2px solid #dedede;
    border-radius: 0;
}
.login-body .form-group .input-group .form-control{
    border: 0;
    border-bottom: 2px solid #dedede;
    border-radius: 0;
    background: transparent;
}
.login-body .form-group .input-group .form-control:focus {
  box-shadow: none;
  border-color: #0cc7d5;
}
.login-body .form-group .login-btn{
  background: #0cc7d5;
    display: inline-block;
    padding: 0.4rem 1rem;
    text-transform: uppercase;
    font-size: 120%;
    min-width: 170px;
    border-radius: 30px;
    color: #fff;
    border: 0;
    transition: .2s;
}
.login-body .form-group .login-btn:hover {
    background: #009da9;
}
.cap-img {
	float: left;
	height: 41px;
	width: 125px;
	margin-left: 10px;
	border-radius: 3px 0 0 3px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-image: none;
	border: 1px solid #ccc;
	text-align: center;
}

	.cap-img img {
		object-fit: contain;
	}

#img-captcha {
	float: left;
	width: 40px;
	padding: 5px 0;
	font-size: 20px;
	color: #fff;
	text-align: center;
	background-color: #336db1;
	border-radius: 0 4px 4px 0;
	border-left: none;
}
#img-captcha:hover {background-color: #4693ec;}
.login-footer{padding: 10px 20px;border-top: 1px solid #eee;}
.login-footer p{margin:0;font-size:.8em; color:#999}