/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : April 12, 2018, 11:15:30 AM
    Author     : Ansar
*/

/* Generated by Font Squirrel (https://www.fontsquirrel.com) on August 27, 2016 */

@font-face {
  font-family: 'Gotham';
  src: url("../fonts/GothamBold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham';
  src: url("../fonts/Gotham-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham';
  src: url("../fonts/Gotham-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

/*sighn -in style start */

* {
  margin: 0;
  padding: 0;
}
html, body {
  margin: 0;
  height: 100%;
  font-family: 'Gotham';
}
h1, h2, h3, h4, h5, h6 {
  margin: 0;
}
p, li, ul, label{
  margin: 0px;
  padding: 0px;
  font-weight: 400;
  list-style: none;
}
b{
  list-style: none;
}
a {
  color: inherit;
  font-weight: 400;
}
a:hover, a:focus, a:active {
  outline: none !important;
  text-decoration: none !important;
}
.clear {
  clear: both;
}
.p-0{
  padding: 0!important;
}
body{
 background: url("../images/metro-bg.png") no-repeat scroll center center / cover ;
 background-attachment: fixed;
}
.log-in-wrapper{
  width:300px;
 height: 100%;
 display: table;
 margin: 0 auto;
}
.logIn-innerWrap{
display: table-cell;
vertical-align: middle;
  width: 100%;
}
.logIn-formWrap{
  width: 300px;
  min-width: 300px;
  height: auto;
  float: left;
  background-color:transparent; 
  border: 1px solid #fff;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  padding: 25px 25px;
}
.logo{
  float: left;
  width: 100%;
  margin: 30px 0 30px 0;
  text-align: center;
}
.logIn-formWrap .login-text{
  float: left;
  width: 100%;
  margin: 0 0 20px 0;
}
.login-text img{
  float: left;
}
.login-text p{
  float: left;
  font-size: 13px;
  font-weight: bold;
  color: #fff;
  margin: 3px 0 3px 5px;
}
.formWrap{
  float: left;
  width: 100%;
}
.formWrap [class*="row"]{
  margin-right: -15px !important;
  margin-left: -15px !important;
}
.formWrap form{
  float: left;
  width: 100%;
}
.formWrap .form-group{
  margin-bottom: 35px;
  position: relative;
}
.formWrap .form-group .form-control{
  width: 100%;
  height: 40px;
  padding: 5px 10px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  color: #000;
  font-size: 11px;
  box-shadow: none;
  font-family: 'Gotham';
}
.formWrap .form-group .custom-selectpicker{
  position: relative;
}
.formWrap .form-group .custom-selectpicker .form-control{
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  padding-right: 25px;
}
.formWrap .form-group .custom-selectpicker select option{
  font-weight: 300;
}
.formWrap .form-group .custom-selectpicker::before{
  content: '\f0d7';
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 13px;
  color: #000;
  font-family: fontAwesome;
  pointer-events: initial;
}
.formWrap .form-group .form-control:focus{
  outline: none;
  box-shadow: none;
}
.formWrap .loginSubmit{
  float: left;
  width: 100%;
}
.metro-login-wrapper .btn-gradient{
  float: left;
  width: 100%;
  height: 40px;
  padding: 9px 10px;
  font-size: 14px;
  font-weight: bold;
  color: #17264b;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background:
        linear-gradient(to left top, rgba(129, 197, 149, 1) 50%/*bottom-right color*/, rgba(210,236,220, 1) 100% /*middle color*/, rgba(255, 255, 255, 1) 100% /*top-left color*/),
        linear-gradient(rgba(129,197,149, 1), rgba(129,197,149, 1))/*"faked" black background make sure to add last or it will appear before the transparent/colored layer*/;
}
.metro-login-wrapper .btn-gradient:hover,
.metro-login-wrapper .btn-gradient:focus{
  outline: none;
  box-shadow: none;
}
.register-frgt-pass{
  padding: 25px 0 0 0;
  width: 100%;
  text-align: center;
}
.register-frgt-pass a{
  font-size: 11px;
  color: #fff;
}
.register-frgt-pass .forgot-pass{
  /* float: left; */
  text-align: center;
  color: #c1c1c1;
}
.register-frgt-pass .register-now{
  float: right;
  color: #a0ddf8;
}
.login-or-signup::before {
  content: "";
  position: absolute;
  top: 11px;
  left: 15px;
  display: block;
  width: 348px;
  height: 1px;
  margin-top: -1px;
  border-top: 1px solid #fff;
  z-index: -1;
}
.login-or-signup{
  text-align: center;
}
.login-or-signup .login-signup{
  position: relative;
  display: inline-block;
  font-size: 13px;
  color: #a0ddf8;
  padding: 0 5px;
  background-color: #17264b;
}
.login-signup-btns{
  float: left;
  width: 100%;
  margin-top: 15px;
}
.login-signup-btns .btn{
  float: left;
  width: 160px;
  padding: 7px 8px;
  text-align: center;
  border: 1px solid #fff;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
.login-signup-btns .btn:hover,
.login-signup-btns .btn:focus{
  outline: none;
  box-shadow: none;
}
.login-signup-btns .btn-fb{
  float: left;
}
.login-signup-btns .btn-google{
  float: right;
}

.logInfooter{
  float: left;
  width: 100%;
  text-align: center;
  margin: 30px 0 15px 0;
}
.social-media{
  float: left;
  width:100%;
  margin-bottom: 20px;
}
.social-media ul{
  list-style-type: none;
  display: inline-block;
  margin: 0 auto;
}
.social-media ul li{
  float: left;
  margin-right: 8px;
}
.social-media ul li:last-child{
  margin-right: 0;
}
.logInfooter p{
  float: left;
  width: 100%;
  text-align: center;
  font-size: 10px;
  color: #c1c1c1;
}
.logInfooter p.year{
  font-weight: bold;
}



/*---- Forgot password styles start ---*/
.metro-login-wrapper .forget-wrapper{
  margin: 0!important;
  border :0;
  padding-top: 0;
}
.metro-login-wrapper .forget-wrapper .btn-clicktologin{
  margin-top: 40px;
  margin-bottom: 15px;
}
.metro-login-wrapper .sigin-wrapper-section{
  padding: 0;
  border: 0;
}
.metro-login-wrapper .sigin-inner-wrapper{
  margin: 0;
}
.metro-login-wrapper .signin-top{
  margin-top: 0!important;
}
.metro-login-wrapper .sigin-wrapper-section .signin-btn{
  margin-bottom: 20px;
}
.metro-login-wrapper .sigin-wrapper-section .btn-clicktologin{
  margin-bottom: 15px;
  font-size: 13px;
  padding: 11px 5px;
}
.metro-login-wrapper .show-pass-outer {
  right: 0;
  top: 0;
  width: 35px;
  height: 40px;
  cursor: pointer;
}
.metro-login-wrapper .show-pass-outer .show-pass{
  top: 17px;
  right: 10px;
}

.metro-login-wrapper .required-error-msg{
  position: relative!important;
  top: 0;
  z-index: 12;
  /* height: 35px; */
  padding: 7px 10px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  width: 100%;
  font-size: 12px;
  margin:0 0 15px 0!important;
}
/* .metro-login-wrapper .signin .required-error-msg{
  width: 390px;
  left: -21px;
  top: -70px;
} */
.metro-login-wrapper .required-error-msg .fa{
  margin-right: 5px;
}
.metro-login-wrapper  .alert-popver{
  display: none;
  position: relative!important;
  float: left;
  width: 100%!important;
  margin-left: 0;
  padding: 10px 10px;
  left: initial;
  border-radius: 6px;
}

::-webkit-input-placeholder { font-size: 11px; }
::-moz-placeholder { font-size: 11px; } /* firefox 19+ */
:-ms-input-placeholder { font-size: 11px; } /* ie */
input:-moz-placeholder { font-size: 11px; }