@font-face{font-family:"gill"; src:url('../fonts/gill-sans-mt.ttf');}
@font-face{font-family:"cali"; src:url('../fonts/Calibri.ttf');}

body{background:url(../../images/bg.jpg) no-repeat center fixed; background-size:100% 100%; padding:0; margin:0;}
/****************************login page*************************/
header{margin-bottom:5%;}
header h3{background:url(../../images/emblem.png) no-repeat 3px 0; font-size: 18px; min-height: 75px; padding: 20px 0 0 55px; margin:5px 0; color:#555; letter-spacing:.6px; text-shadow:0 0 4px #fff; line-height: 26px;}
header h3>span{font-size:36px; color:#333; font-family:"cali";}
.login {background:#fff; padding:10px 50px 20px; margin:0 10px; box-shadow: 0 20px 21px -5px #5c5c5c;}
.login label{font-weight:normal;}
.login input{height:2.2rem !important;}
.input-field input[type=text]:focus + label, .input-field input[type=password]:focus + label {color: #2a7bbf !important;}
.input-field input[type=text]:focus, .input-field input[type=password]:focus {
	border-bottom: 1px solid #2a7bbf !important;
	box-shadow: 0 1px 0 0 #2a7bbf !important;
}
.login .input-field{margin:10px 0;}
.box{background:url(../../images/bg2.png) no-repeat center; margin:0 10px; padding:30px; color:#fff; font-family:"cali"; font-size:30px; letter-spacing:1px; line-height: 30px;}
.box span{font-size:50px; font-family:"gill"; letter-spacing:4px;}
.form-control{font-size: 1rem; line-height: 1.5; height:20px;}
.captcha .input-field{width:50%; float:left;}
.captcha img{float:right; }/* 
.captach-img img{float:left; } */
.forget{margin-bottom:10px; text-align:right;}
.forget a{font-size:13px; color:#2a7bbf;}
.btn-main{background-color: #2a7bbf !important; color:#fff; font-size:16px;}
.btn-main:hover, .btn-main:focus{color:#fff;}
.errorMessage{position: absolute; left: 80px; bottom: 15px; color: red; font-weight: bold;}
footer{color:#111; font-size:12px; line-height:15px; letter-spacing:.5px; position:fixed; bottom:5px; width:100%; font-weight:700;}

@media only screen and (max-width: 992px){
.login{margin-bottom:25%;}
}
@media only screen and (max-width: 768px){
.login{margin:0 0 5% 0;}
footer{position:inherit;}
header h3>span{font-size:30px;}
.box{padding:40px 0; margin:0;}
.captcha .input-field{width:40%;}
}
@media only screen and (min-width: 768px) and (max-width: 1224px){
.col-sm-6{width:60%;}
.captcha .input-field{width:40%;}
.box{margin:0;}
.login{margin:0 0 5% 0;}
}
@media only screen and (min-width: 1224px) and (max-width: 1500px){
.captcha .input-field{width:35%;}
}