

*, body {
    padding: 0px;
    margin: 0px;
}

body {
    background: #dedede url(../../images/bg.jpg) no-repeat;
    background-size: cover;
    background-position: 0;
    font-family: 'Open Sans', sans-serif;
    line-height: 24px;
    position: relative;
    font-size: 14px;
    height: 100vh;
    padding-top: 150px;
}



.login-box{
	height: 590px;
	width: 45%;
	background: #fff;
	margin: auto;
	box-shadow: 0px 0px 5px 5px #e0e0e0;
}

.login-box .loginImg{
	display: inline-block;
	width: 52%;
	vertical-align: top;
	background: #ffffff url(../../images/loginimg.jpg) no-repeat;
	background-size: cover;
	height: 100%;
}


.login-box .loginForm{
	display: inline-block;
	width: 47%;
	vertical-align: top;
	text-align: center;
}

.login-box .loginForm .lgf-header{padding: 30px 0;padding-bottom: 0;}
.login-box .loginForm .lgf-body{text-align: left;padding: 0 30px;margin: 40px 0;}
.login-box .loginForm .lgf-body h2{
    margin: 0;
    font-size: 1.8em;
    line-height: 1.5em;
    margin-bottom: 20px;
}
.login-box .loginForm .lgf-body h2>strong{display: block;}
.lgf-body .alert-danger ul{list-style: none;}
.lgf-body .alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
    padding: 7px 10px;
    margin-bottom: 11px;
}
.login-box .loginForm .lgf-body form{width: 100%;}
.login-box .loginForm .lgf-body form .form-group{margin-bottom: 6px;position: relative;}
.login-box .loginForm .lgf-body form .form-group i.fa{position: absolute;top: 10px;left: 15px;font-size: 1.4em;color: #4c55a4;}
.login-box .loginForm .lgf-body form .form-group .form-control{border-radius: 20px;height: 40px;background: #f4f2ff;border: 0;box-shadow: none;text-indent: 40px; line-height: 40px;-webkit-appearance: none;}
.login-box .loginForm .lgf-body form .form-group .lgf-btn{transition: .2s;outline: none;border-radius: 20px;border: none;background: #4c55a4;color: #fff;padding: 5px 25px;margin-top: 15px;box-shadow: 0 3px 3px 1px #848ee6;}
.login-box .loginForm .lgf-body form .form-group .lgf-btn:hover{box-shadow: 0 -3px 3px 1px #848ee6;}
.login-box .loginForm .lgf-body form .form-group .forgotPass{padding-top: 20px;transition: .2s;display: block;font-weight: bold;color: #9aa4ff;text-decoration: none;font-size: 1em;}
.login-box .loginForm .lgf-body form .form-group .forgotPass:hover{color: #4c55a4;}
.login-box .loginForm .lgf-footer{text-align: left;padding: 0 30px;}
.login-box .loginForm .lgf-footer p{}
.login-box .loginForm .lgf-footer p>a{transition: .2s;font-weight: bold;color: #9aa4ff;text-decoration: none;}
.login-box .loginForm .lgf-footer p>a:hover{color: #4c55a4;}


@media(max-width:1440px){
	body{
		padding: 50px 0;
		padding-bottom: 0;
	}
	.login-box {
		height: 541px;
		width: 55%;
	}
	.login-box .loginForm .lgf-header img{
		width:40%;
	}
	.login-box .loginForm .lgf-body {
		padding: 0 35px;
		margin: 20px 0;
	}
	.login-box .loginForm .lgf-footer {
		text-align: left;
		padding: 0px 35px;
	}
	.login-box .loginForm .lgf-body h2 {
    	font-size: 1.5em;
	}
	.login-box .loginForm .lgf-body form .form-group .form-control {
		height: 35px;
		line-height: 25px;
	}
}
@media(max-width:1366px){
	
	.login-box {
		height: 514px;
		width: 55%;
	}
	.login-box .loginForm .lgf-body form .form-group .forgotPass{    font-size: 0.94em;}
}
@media(max-width:1280px){
	.login-box {
		height: 504px;
		width: 60%;
	}
	.login-box .loginImg {
    	width: 50%;
	}
	.login-box .loginForm {
    	width: 48%;
	}
	.login-box .loginForm .lgf-body form .form-group .form-control{line-height: 25px;}
}

@media(max-width:1152px){
	.login-box {
		height: 529px;
		width: 70%;
	}
	.login-box .loginImg {
    	width: 50%;
 }
	.login-box .loginForm {
    	width: 49%;
 }
	.login-box .loginForm .lgf-body form .form-group .forgotPass {
    font-size: 0.9em;
}
}

@media(max-width:1024px){
	.login-box {
		height: 441px;
		width: 70%;
	}
	.login-box .loginImg {
    	width: 47%;
 }
	.login-box .loginForm {
    	width: 52%;
 }
	.login-box .loginForm .lgf-header {
    	padding: 25px 0 0 0;
	}
	.login-box .loginForm .lgf-body {
		padding: 0px 30px;
		margin: 15px 0;
	}
	.login-box .loginForm .lgf-body h2 {
		font-size: 1.3em;
		margin-bottom: 10px;
	}
	.login-box .loginForm .lgf-body form .form-group .lgf-btn{
		margin-top:5px;
	}
	.login-box .loginForm .lgf-header img {
		width: 35%;
	}
	.login-box .loginForm .lgf-body form .form-group .forgotPass {
    	padding-top: 10px;
	}
	.login-box .loginForm .lgf-footer {
		padding: 0px 30px;
		
	}
}
@media(max-width:768px){
	.login-box {
		height: 415px;
		width: 80%;
	}
	.login-box .loginForm .lgf-header img {
		width: 30%;
	}
	.login-box .loginForm {
		width: 47%;
	}
	.login-box .loginImg {
		width: 52%;
	}
	.login-box .loginForm .lgf-body {
		padding: 0px 0px;
		margin: 20px 0;
	}
	.login-box .loginForm .lgf-body form {
		width: 95%;
	}
	.login-box .loginForm .lgf-footer {
		padding: 0px;
	}
	.login-box .loginForm .lgf-body form .form-group .form-control{
		height: 30px;
		padding-left: 35px;
	}
	.login-box .loginForm .lgf-body form .form-group i.fa {
		top: 8px;
		left: 15px;
		font-size: 1em;
	}
	.login-box .loginForm .lgf-body form .form-group .lgf-btn{
		padding: 3px 25px;
	}
}

@media(max-width:640px){
	body{
		background-image: none;
		background: #4c55a4;
		padding: 0;
	}
	.login-box {
		height: auto;
		width: 90%;
		box-shadow: none;
		background: transparent;
	}
	.login-box .loginForm {
		width: 100%;
		padding: 0;
	}
	.login-box .loginForm .lgf-header{background: #fff;padding: 10px 0;margin: 0 -31px;}
	
	
	.login-box .loginImg {
		width: 52%;
		display: none;
	}
	.login-box .loginForm .lgf-body form .form-group .form-control {
		height: 40px;
		padding-left: 9px;
		background: #ffffff;
	}
	.login-box .loginForm .lgf-body h2 {
		font-size: 1.5em;
		margin-bottom: 20px;
		color: #fff;
	}
	.login-box .loginForm .lgf-body form .form-group .lgf-btn {
		background: #7987ff;
		color: #ffffff;
		box-shadow: none;
		padding: 7px 30px;
		margin-top: 10px;
	}
	.login-box .loginForm .lgf-body form .form-group .forgotPass {
    	color: #fff;
	}
	.login-box .loginForm .lgf-body form .form-group {
    margin-bottom: 19px;
    position: relative;
}
#captcha{color: #fff;}
	.login-box .loginForm .lgf-footer p{color:#fff;}
	.login-box .loginForm .lgf-footer p>a {
		font-weight: normal;
		color: #b9c0ff;
	}
	.login-box .loginForm .lgf-body form {
		width: 100%;
	}
	.login-box .loginForm .lgf-body form .form-group i.fa {
		top: 10px;
		left: 15px;
		font-size: 1.3em;
	}
	.form-group.Captchatext{    margin-top: -8px;}
	.login-box .loginForm .lgf-body form .form-group .forgotPass {
		padding-top: 20px;
	}
	.form-group.forgotbutton{    margin-top: -29px;}
	
}

@media(max-width:576px){

.login-box .loginForm .lgf-body form .form-group .form-control {
    text-indent: 45px;
    line-height: 28px;
}
.login-box{    width: 86%;}

}

