
/* #### Generated By: http://www.cufonfonts.com #### */


body{
    padding: 0;
    margin: 0;
    font-family: 'Open Sans', sans-serif !important;
}
@media screen and (max-width: 767px){
  .loginForm {
     width: 100% !important;
     margin: 0 auto;
     margin-top: 0px;
 }
 .welcomeText{
   margin-top: 30px;
 }
 }


.loginscreen {
  position: relative;
  /* overflow: hidden; */
  /* height: 83vh; */
}

.loginscreen .b-layer {
  position: relative;
  height: 450px;
}

.loginscreen  .layer-bg {
  position: absolute;
  overflow: hidden;
  height: 450px;
  width: 100%;
  left: 0;
  top: 0;
}
/* .layer-bg:after {
  content: '';
  display: block;
  position: absolute;
  width: 230px;
  height: 230px;
  background: transparent;
  border-radius: 50%;
  border: 1px solid #57cbcf;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -115px;
}*/

.loginscreen  .layer-bg-mod {
  /* position: relative; */
  /* overflow: hidden; */
  height: 518px;
}

.loginscreen  .b-layer-big {
  position: relative;
  height: 600px;
}

.loginscreen  .layer-big-bg {
  position: absolute;
  overflow: hidden;
  height: 600px;
  width: 100%;
  left: 0;
  top: 0;
}
.loginscreen  .layer-big-bg:after {
  content: '';
  display: block;
  position: absolute;
  width: 230px;
  height: 230px;
  background: transparent;
  border-radius: 50%;
  border: 1px solid #6fd386;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -115px;
}

.loginscreen  .shape-bg {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 368px;
}
.loginscreen  .shape-bg:before {
  content: '';
  width: 100%;
  height: 368px;
  background-image: url("http://iocl.synergyteletech.com/fillnow/assets/dashboard/banner-three-shape.png");
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: top;
  position: absolute;
  bottom: 0;
  left: 0;
}

.fill-text-css{
    position: relative;
}



.loginscreen  .page-layer-bg4 {
    background-image: url(https://synergy.xsinfoways.net/ofo/assets/dashboard/loginbg.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    top: 0;
}

.loginscreen  .layer-bg-mod:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #246bad;
    background: -moz-linear-gradient(top, #246bad 0%, #00c8c8 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #246bad), color-stop(100%, #00c8c8));
    background: -webkit-linear-gradient(top, #246bad 0%, #00c8c8 100%);
    background: -o-linear-gradient(top, #246bad 0%, #00c8c8 100%);
    background: -ms-linear-gradient(top, #246bad 0%, #00c8c8 100%);
    background: linear-gradient(to bottom, rgb(0, 115, 190) 0%, #0073be 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#246bad', endColorstr='#00c8c8',GradientType=0 );
    opacity: 1.8;
}
.loginscreen  .loginWrapper{
    position:relative
}

.loginscreen  .loginContent{
    /* position:absolute; */
    /* top: 109px; */
    /* width: 100%; */
    /* top: 50%; */
    left: 50%;
    /* right: 50%; */
    /* left: 50%; */
    /* transform: translate(-50%, -50%); */
}


.fill-text-css{
        background-image: url(http://xsinfoways.net/fillnowloginscreen/img/loginbg.jpg);
    height: 416px;
    background-position: center;
}

.fill-text-css:before{
    position: absolute;
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /* background-color: #ffffffde; */
    box-shadow: 3px 0 15px 5px #0000000d;
    background-image: linear-gradient(45deg, #d8fdd0c2, #ffffff);
}


.loginscreen  .inputImage{
     background: url(http://iocl.synergyteletech.com/fillnow/assets/dashboard/mailicon.png);
     background-position: 14px 12px;
     background-repeat: no-repeat;
     /* position: relative; */
     /* z-index: 1; */
}
.loginscreen  .inputImage .form-control{
    background: #d84c4c00 ! important;
    margin: 18px 0;
    padding-left: 52px;
    box-shadow: none;
    /* border-color: #0000004f; */
    border-radius: 2px;
    width: 100%;
    height: 40px;
    border: none;
    box-shadow: 2px 2px 6px 3px #25252536;
}

.loginscreen  .loginForm{
    background-color:#fff;
    padding: 0;
    width: 48%;
    border-radius: 6px;
    position: absolute;
    z-index: 13;
    box-shadow: 2px 6px 32px 4px #9494943d;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -23%);
    transform: translate(-50%,7%);
}

.loginscreen  .loginText{
    color: #0073be;
    font-size: 40px;
    position:relative;
    z-index:2;
  margin-top: 0px;
  font-family: 'Stencil';
  font-weight: 700;
    text-transform:uppercase;
    line-height: 52px;
    padding: 81px 30px;
}

.loginscreen  .loginText span{
    color: #4fb050;
}

.loginscreen  .pass{
  background: url(http://iocl.synergyteletech.com/fillnow/assets/dashboard/passwordicon.png);
     background-position: 13px 11px;
     background-repeat: no-repeat;
}
.loginscreen  input[type='checkbox']{
    width: 15px;
    height: 15px;
    vertical-align: bottom;
    margin-right: 10px !important;
}

.loginForm-inner{
    padding: 30px;
}


.loginscreen  .btn-login{
    display: block;
    width: 100%;
    padding: 6px;
    box-shadow: none;
    border-radius: 4px;
    border: none;
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    background: #d03344;
    margin: 19px 0;
    box-shadow: 2px 6px 10px 2px #edecec;
    }
.loginscreen  .forgetPass{
    color:#0073be;
    
}
.loginscreen  .logoWrapper{
    margin-bottom: 25px;
}

.loginscreen  .register{
    display:flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.loginscreen  .register p{
    color:#0073be
}

@media screen and (max-width: 767px){
    .loginscreen  .loginForm{
        width: 100% !important;
    margin: 0 auto;
    margin-top: 0px;
        
    }
    @media screen and (max-width: 360px){
      .loginscreen .register{
font-size: 13px;
          
      }
    }
    
.loginscreen  .loginContent{
    top:0
}
.loginscreen  .loginText{
  font-size: 28px;
    padding: 10px;
    text-align: center;
    line-height: 37px;
}
.loginForm-inner{
  padding: 7px 15px !important;
}

}

.fill-text-css {
   
    height: auto;
    background-position: center;
}

}

@media screen and (max-width: 1024px){
    
    .loginscreen  .loginForm{
        width:100%
    }
}
.loginscreen  .introd{
    font-size:20px;
    text-align:center
}
.loginscreen  p.agreementTxt{
    color:#000;
    text-align:center;
    margin-top:0
}
.loginscreen  .person{
  background: url(http://iocl.synergyteletech.com/fillnow/assets/dashboard/personicon.png);
     background-position: 13px 11px;
     background-repeat: no-repeat;
}
.loginscreen  .phone{
     background: url(http://iocl.synergyteletech.com/fillnow/assets/dashboard/phone.png);
     background-position: 13px 11px;
     background-repeat: no-repeat;
}
.loginscreen .pasword{
  background: url(http://iocl.synergyteletech.com/fillnow/assets/dashboard/passwordicon.png);
  background-position: 13px 11px;
background-repeat: no-repeat;
}
.loginscreen .state{
  background: url(http://iocl.synergyteletech.com/fillnow/assets/dashboard/state.png);
  background-position: 13px 11px;
background-repeat: no-repeat;
}

.iocl-register{
  background: #066585;
  
    padding: 7px 12px;
    color: #fff;
    border-radius: 15px;
}

.iocl-forgot{
  background:#6c9849;
  padding: 7px 12px;
  color: #fff;
  border-radius: 15px;
}
.pow-text{
  text-align: center;
  text-transform: uppercase;
  font-family: 'Open Sans', sans-serif;
  color: #8e8e8e;
  font-size: 15px;
  font-weight: 600;
  margin: 8px 0;
}

 .bg-shape-inner {
  position: absolute;
  bottom: 114px;
}
.banner.banner-four{
  position: relative;
}
.banner.banner-four {
  height: 650px;
}

.forgot{
  bottom: -1px !important;
}

