/*---------------------------------------------*/
html
{ padding: 0; margin: 0; width: 100%; }

.clear
{ clear: both; }

article,section,hgroup,aside,footer,nav,header
{ display: block; }

h1,h2,h3,h4,h5,h6
{ font-family: Arial; }

body
{
	border-top: 4px solid #a30808;
	background-color: #00041D;
	/*background-image: url("../img-lg/bg.jpg");*/
	background-repeat: no-repeat;
	color: #fff;
	padding: 0;
	margin: 0;
	font-family: Arial;
	width: 100%;
}

@font-face {
    font-family: 'Shona';
    src: url('../fonts-lg/Shonarb.ttf') format('truetype');
    font-style: normal;
}
.font
{ font-family: Shona; }

.color_white
{ color: #ffffff; }

.border_bottom
{ border-bottom: 1px solid #1d213c; }

.bg_red
{ background-color: #A30708; }

.bg_login
{ background-color: #1cb3fa; color: #ffffff; }

.white_bar
{ background-color: #E8E8E8;
	box-shadow: 0 0 5px #000;
	    -moz-box-shadow: 0 0 5px #000;
	        -webkit-box-shadow: 0 0 5px #000;
	            -ms-box-shadow: 0 0 5px #000;
	                -o-box-shadow: 0 0 5px #000; height:20px; }
.input_bg
{ background-color: #636675; color: #fff; }

.margin_top
{ margin-top: 30px; }

.txt_shadow
{ text-shadow:0 0 3px #000; }

.align-center
{ text-align: center; }

.bg_black
{ background-color: #000; }

.border
{ border:1px solid red; }

.border1
{ border:1px solid blue; }

.target
{ text-decoration: none; }

.target:hover
{ color: #998b8b; text-decoration: none; }

.img
{ margin-top: 24px; margin-left: -65px; }

/* style add by azh*/
.validation-summary-errors
{ color: red; position: relative; bottom: 25px; }

.hrms-validation-color .validation-summary-errors ul
{ list-style-type: none; }

.hrms-validation-color
{ color: red; }

.validation-summary-errors ul 
{ background: #01051e; padding: 7px 0 7px 40px; border-radius: .4rem; /*border: 1px solid #ffffff;*/ width: 55%; margin-left: 99px; }

.validation-summary-errors ul 
{ font-size: 14px; }

.msg-icon 
{ position: absolute; left: 125px; top: 12px; font-size: 22px; z-index: 1; }

.hidden-footer
{ display: none; }

@media (min-width: 900px)  {
    .login-hidden-md-lg 
    { bottom:0; }
}
.msgBar
{ color: red; background-color: green; width: 100%; line-height: 24px; }

input 
{ outline: none; border: none; }

textarea 
{ outline: none; border: none; }

textarea:focus, input:focus 
{ border-color: transparent !important; }

input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }

textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; }
textarea:focus::-moz-placeholder { color:transparent; }
textarea:focus:-ms-input-placeholder { color:transparent; }

input::-webkit-input-placeholder { color: #fff;}
input:-moz-placeholder { color: #fff;}
input::-moz-placeholder { color: #fff;}
input:-ms-input-placeholder { color: #fff;}

textarea::-webkit-input-placeholder { color: #fff;}
textarea:-moz-placeholder { color: #fff;}
textarea::-moz-placeholder { color: #fff;}
textarea:-ms-input-placeholder { color: #fff;}

label 
{ margin: 0; display: block; }

/*---------------------------------------------*/
button 
{ outline: none !important; border: none; background: transparent; }

button:hover 
{ cursor: pointer; }

iframe 
{ border: none !important; }

/*------------------------------------------------------------------
[ Input ]*/
.input100 {
  font-size: 15px;
  color: #fff;
  line-height: 1.2;
  display: block;
  width: 100%;
  height: 45px;
  background: transparent;
  padding: 0 5px 0 38px;
}

/*---------------------------------------------*/ 
.focus-input-icon {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 2px;
  left: 0;
  pointer-events: none;
}

.focus-input-icon::before {
  content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: #fff;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}
.focus-input-icon::after {
  /*font-family: 'Material-Design-Iconic-Font';*/
  font-size: 22px;
  color: #fff;
  display: block;
  width: 100%;
  position: absolute;
  top: 10px;
  left: 0px;
  padding-left: 5px;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}
.focus-input-icon1::after
{ content: '\f007'; }

.focus-input-icon2::after
{ content: '\f023'; }

.input100:focus {
  padding-left: 5px;
}

.input100:focus + .focus-input-icon::after {
  top: -22px;
  font-size: 18px;
}

.input100:focus + .focus-input-icon::before {
  width: 100%;
}

.has-val.input100 + .focus-input-icon::after {
  top: -22px;
  font-size: 18px;
}

.has-val.input100 + .focus-input-icon::before {
  width: 100%;
}

.has-val.input100 {
  padding-left: 5px;
}

@media (min-width: 992px) {
    .login-input
    { position: relative; left: 114px; }

    .wrap-input50
    { width: 55%; }

    .white_bar
    { height: 20px; }

    .mobile-view
    { display: none; }
}

@media (max-width: 768px) {
    .wrap-input50
    { width: 100%; position: relative; left: 15px; }

    .login-btn-label
    { margin-bottom: 8px !important; }

    .login-btn-div
    { width: 100%; }

    .login-btn
    { width: 100%; }

    .white_bar
    { height: 10px; }

    .pull-left img
    { width: 70%; }

    .mobile-view
    { display: block; }

    .mobile-view img
    { width: 27%; float: left; margin-left: 16px; margin-top: 8px; }

    .mobile-lb
    { position: absolute; top: 40px; }
}

@media screen and (max-height: 320px){ /*Responsive lanscape*/
    footer 
    { display: none; }

    .login-btn-div
    { width: 35%; }

    .mobile-lb
    { top: 0; right: -5px;}

    .img-responsive
    { width: 65%; }
}

@media only screen and (max-width: 568px) and (max-height: 320px) {
    .hidden-footer
    { display: block; text-align: center; }
}

@media only screen and (max-width: 240px) and (max-height: 320px) {
    .img-responsive
    { width: 100%; }

    .login-btn-div
    { width: 100%; position: relative; top: 38px; }

    .hidden-footer
    { display: none; }
}

@media only screen and (max-width: 320px) and (max-height: 240px) {
    .img-responsive
    { width: 100%; }

    .mobile-lb
    { width: 75%; left: 75px; }

    .login-btn-div
    { right: 15px;  }
}

@media only screen and (max-width: 240px) and (max-height: 320px) {
    .mobile-lb
    { left: 0 !important; width: 100%; }
}

/*@media only screen and (max-width: 384px) and (max-height: 600px) {
    .mobile-lb
    { left: 73px; }
}*/

@media only screen and (max-width: 600px) and (max-height: 384px) {
    .mobile-view
    { display: none; }

    .white_bar
    { height: 0; }

    .pull-right
    { text-align: center; float: none !important; }
}

@media only screen and (max-width: 768px) and (max-height: 1024px) {
    .pull-right
    { float: none !important; text-align: center; }

     
}

@media only screen and (max-width: 1024px) and (min-width: 900px) and (max-height: 768px) {
    /*.wrap-input50
    { width: 78%; }*/

    .max-width-1024
    { position: relative; left: 59px; }

    .login-btn-label
    { width: 58%; }

    .login-btn-div
    { width: 29%; }

    .login-btn
    { width: 100%; position: relative; left: 15px; }
}

/*@media screen and (max-width: 600px) and (min-width: 501px) , screen and (max-height: 320px) {
    .mobile-lb
    { right: 115px; }
}*/

@media only screen and (max-width: 600px) and (min-width: 500px) {
    .mobile-lb
    { right: 90px; }
}

@media only screen and (max-width:768px){
    .width-100-per{
         width:100%;
     }
     .width-80-per{
         width:80%;
     }
}
/*@media screen and (max-width: 399px), screen and (max-height: 320px) {
    .mobile-lb
    { right: 60px; }
}*/
.login-footer
    { position: fixed; bottom: 0; left: 0; width: 100%; }

.wrap-input50 
{ position: relative; border-bottom: 2px solid /*#7f8191;*/ rgba(255,255,255,0.24); margin-bottom: 30px; }

.login-input100
{ width: 100%; }

input.input_bg::-webkit-input-placeholder { /* Chrome */
  opacity: 0.5;
}
input.input_bg:-ms-input-placeholder { /* IE 10+ */
  opacity: 0.5;
}
input.input_bg::-moz-placeholder { /* Firefox 19+ */
  opacity: 0.5;
}
input.input_bg:-moz-placeholder { /* Firefox 4 - 18 */
  opacity: 0.5;
}

/*For validate Placeholder Color*/
.placeholder-color::-webkit-input-placeholder { /* Chrome */
  color: red;
}
.placeholder-color::-ms-input-placeholder { /* IE 10+ */
  color: red;
}
.placeholder-color::-moz-placeholder { /* Firefox 19+ */
  color: red;
}
.placeholder-color::-ms-input-placeholder { /* Firefox 4 - 18 */
  color: red;
}


/*Validation Input Field*/
#uservalidateIcon, #passvalidateIcon
{ position: absolute; top: 20px; right: 10px; color: red; }