body{


    font-family: 'Source Sans Pro', sans-serif;
  /*height: 100vh;*/
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#073f4e+0,aac5de+17,3a84c3+35,6199c7+48,419ad6+59,4bb8f0+71,3a8bc2+84,0e94a0+99 */
background-image:url("../img/CHSM_bg.jpg");
  background-repeat: no-repeat;
  background-position:center;
  background-attachment: fixed;
  background-size: cover;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  animation: NZ 40s infinite;
  background-color: #fff;

}

@keyframes NZ {
  0% {
    background-size: 100%;
  }
  45% {
    background-size: 130%;
  }
  100% {
    background-size: 100%;
  }
}


  .loder_area {
  margin: auto;
  width: 82px;
  /* border: 3px solid #73AD21; */
  padding: 10px;
  position: absolute;
  left: 46%;
  top: 33%;
  z-index: 99;
}
.loder_box{
width: 100%;
  height: 100%;
  display: none;
  position: fixed;
  top: 0px;
  left: 0px;
  background: rgba(0, 0, 0, 0.01);
  z-index: 9999999;
}

#message{
max-width: 60%;
margin: 0 auto;
position: fixed;
z-index: 9999;
display: none;
left: 0;
right: 0; 
font-size: 13px;
}
.logo_small_screen{
  display: none;
}.logo_small_screen img{
 width: 90px;
}
.right_area {
  margin-right: 20px; 
  padding-bottom: 18px;

}  
#login_form h3 {
  margin-bottom: 33px;
}
.back_ground {
  /*background: url('../img/left_image.jpg');*/
  background-repeat: no-repeat;
  background-size: 100% 100%;
  height: auto;
  margin: 0;
  border-radius: 5px 0 0 5px;
}

.right_ {
  padding-top: 20px;
  /*padding-bottom: 30px;*/
}

.back_ground.signup_background{
  height: auto;
}
.login_signup_area {
  margin: 108px auto 0 auto;
  background: #f8f8f8;
  border-radius: 5px;
  opacity: .9;
  box-shadow: 0px 1px 3px 2px #229fb3;
}
.login_signup_area input {
  border: none;
  background: #F6F6F6;
  border-bottom: 1px solid #3b3b3b;
}


.left_area {
  /* background: rgba(255, 255, 255, .6); */
  border-radius: 5px 0 0 0;
  padding: 15px;
  text-align: center;
}
.left_area img {
  /*border-radius: 5px 0 0 0;*/
  width: 90px;
}
.border_color_err{
  border-color: red;
}

/*==========================
new style
===========================*/
.user-input-wrp {
  position: relative;
  /*width: 50%;*/
}
.user-input-wrp .inputText{
  width: 100%;
  outline: none;
  border:none;
  border-bottom: 1px solid #414141;
  box-shadow: none !important;
}
.user-input-wrp .inputText:focus{
  border-color: #8BC8D2;
  border-width: medium medium 2px;
}
.user-input-wrp .floating-label {
  position: absolute;
  pointer-events: none;
  top: 27px;
  left: 10px;
  transition: 0.2s ease all;
  color: #5f5f5f;
  font-size: 14px;
}
.user-input-wrp input:focus ~ .floating-label,
.user-input-wrp input:not(:focus):valid ~ .floating-label{
  top: 0px;
  left: 10px;
  font-size: 13px;
  opacity: 1;
}

.form-control:focus {
  color: #5f5f5f;
  background-color: #fff;
  border-color: #000;
}

.form-group a {
  color: #17A2B8;
}

.login_signup_area h6 {
  color: #17A2B8;
  font-weight: bold;
}
/*==========================
responsive css
===========================*/

/* Desktop Screen*/
@media only screen and (min-width:992px) and (max-width:1199px){
 
}
/*Tablet Screen*/
@media only screen and (min-width:768px) and (max-width:991px) {
 
}
/*Small Mobile Screen*/
@media only screen and (max-width:767px){
  .back_ground{
    display: none;
   }
   .right_area {
  margin-left: 20px;
  margin-bottom: 37px;
}
.logo_small_screen{
  display: block;
}
.right_area h3{
  display: none;
} 
}
/* Large Mobile Screen and Here Responsive Menu */
@media only screen and (min-width:480px) and (max-width:767px) {
   .back_ground{
    display: none;
   }
   .right_area {
  margin-left: 20px;
  margin-bottom: 37px;
}
.logo_small_screen{
  display: block;
}
.right_area h3{
  display: none;
} 
}