strong{font-weight:700;}
input, select, textarea{ outline:none;}
input[type="submit"], input[type="button"]{-webkit-appearance:none; }
input[type="text"],input[type="password"], textarea{-webkit-appearance:none; }
input, button { border: none;outline: none;}
*, *:before, *:after {box-sizing: border-box;margin: 0;padding: 0;}

/* headings */
h1, h2, h3, h4, h5, h6 {font-size:100%;font-weight:normal;padding:0 0 10px 0;}
h1{font-size: 30px;}
h2{font-size: 28px; font-weight:600;}
h3{font-size: 26px;}
h4{font-size: 24px;}
h5{font-size: 20px;}
h6{font-size:18px;}

button{outline: none;}
ul{margin:0px;padding:0px;}
li{list-style:none;text-decoration:none;}
a{text-decoration:none;color:#000;}
i{font-style:normal;}
img{vertical-align:top;}
body {overflow-x: hidden;}

ul[class*="grid-"]{display: inline-block; vertical-align: top; width: 100%;}
ul.grid-4 > li{float: left; width: 25%; padding:15px;}
ul.grid-3 > li{float: left; width: 33.33%; padding:20px 15px;}
ul.grid-2 > li{float: left; width: 50%; padding:20px 15px;}	
html{height:100%;}
body{width:100%; height:100%; margin:0px; padding:0px;   font-family: 'Poppins', sans-serif;font-size:14px; color:#333; line-height:24px;background:#eaeef3;letter-spacing:1px; }

.clear{clear:both;}
.row{margin:0px -15px;}
.tip {font-size: 20px;margin: 40px auto 50px;text-align: center;}

/*=========================
	main css
=======================*/
.logo img{max-width: 80px;}

.form-element input[type="text"], .form-element input[type="password"], .form-element input[type="email"], .form-element input[type="search"] {display: block; width: 100%;height: 35px; padding: 0; font-size: 14px;  line-height: 1.42857143; color: #666;background-color: #ffffff;border: none;border-bottom: 1px solid #e0e0e0;border-radius: 0;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.form-element {position: relative;margin: 15px 0;display: inline-block;width: 100%;}
.form-element select:focus {border:0px;border-bottom: solid 1px #019F98;}
.form-element input:focus {border-bottom: solid 1px #019F98; outline: none;}
.form-element textarea:focus {border-bottom: solid 1px #000;}

.button {font-size: 15px;border-radius: 2px;display: block;width: 100%;padding: 10px 24px;border: 0 none;position: relative;overflow: hidden;cursor: pointer;vertical-align: middle;border: none;background:#A9069C; color: #fff;}
.button::before{content:"";width: 0;height: 1px;position: absolute;transition: all 0.2s linear;
  background: #fff;}

.button::after{content:"";width: 0;height: 1px;position: absolute;transition: all 0.2s linear;background: #fff;}
.button:hover { background:#A9069C;}
.button span::before, .button span::after{content:"";width:1px;height:0;position: absolute;transition: all 0.2s linear;background: #fff;}
.button:hover::before, .button:hover::after{width: 100%;}
.button:hover span::before, .button:hover span::after{height: 100%;}

.button::before{left: 50%;top: 3px;transition-duration: 0.4s;}
.button::after{left: 50%;bottom: 3px;transition-duration: 0.4s;}
.button span::before{left: 3px;top: 50%;transition-duration: 0.4s;}
.button span::after{right: 3px;top: 50%;transition-duration: 0.4s;}
.button:hover::before, .button:hover::after{left: 3px; width:calc(100% - 6px);}
.button:hover span::before, .button:hover span::after{top: 3px;height: calc(100% - 6px);}


.form-element .flip-change, .flip-back {display: inline-block;cursor: pointer;font-size: 14px;float: right;font-weight:500;}
.flip-back a{color: #FFC840;}
.flip-back{text-align:center;float:none;   }
.form-element label {font-weight: 400; white-space: nowrap;-ms-transition: all 200ms ease 0s;  -webkit-transition: all 200ms ease 0s; transition: all 200ms ease 0s; color: #959595;}
.form-element label.checkbox {cursor: pointer;}


.login-wrapper {width: 100%; min-height: 100%;/*background: url(../images/image_3.jpg) #fff no-repeat;*/ background-position: center 180px;  background-size:contain; display: flex;justify-content: center;align-items: center;padding:0px 15px; }
.login-wrapper:before{content: ""; position: fixed; left: 0;top: 0; bottom: 0; right: 0; background-color: rgba(38, 58, 72,0.6); background-size: cover;background-attachment: fixed;}
.login-container {overflow: hidden;position: relative;width: 970px; margin: 50px auto; background: #fff;    z-index: 1;min-height:470px; }
.login-container .col-6{width:50%;float: left;padding: 45px 40px; }
.login-container .col-6.login-content-2{position:relative;}
.login-container .col-6 .form-bx{ float: right;  position: absolute; top: 0;
    padding: 45px 50px;width:100%;box-sizing:border-box;  }
.login-container .login-content-1:before{content:'';position:absolute;top:0px;left:0px;bottom:0px;     background-color: rgba(40, 45, 51, 0.98);width:50%;       z-index: 1;}
.login-container .login-content-1 .logo{width:220px;position:relative;z-index:1}
.login-container .login-content-1 {color:#fff;}  
.login-container .login-content-1 h2{margin:20px 0px 20px;line-height: 32px;position:relative;z-index:1}
.login-container .login-content-1 ul{margin:20px 0px 60px;position:relative;z-index:1}
.login-container .login-content-1 ul li{list-style-type: circle;    margin: 5px 0px 5px 20px;}
.login-container .login-content-2 h2{ font-size: 20px;margin: 25px 0px 0px;letter-spacing: 0;}
.forgot-form,  .login-form{right: 100%; opacity: 0; -webkit-transition: .3s all ease-in-out;-o-transition: .3s all ease-in-out; transition: .3s all ease-in-out;}
.forgot-form.show, .login-form.show{ -webkit-transition: .3s all ease-in-out; -o-transition: .3s all ease-in-out; transition: .3s all ease-in-out; opacity: 1; right: 0;}
.forgot-form p{border-left: 4px solid #1E5147;padding: 8px; margin-left: 0; margin-bottom: 20px; background-color: #fff;  box-shadow: 0 1px 1px 0 rgba(0,0,0,.1); letter-spacing: 0;  font-size: 13px;
line-height: 20px;margin-top: 10px;color: #626262;}
.error-box{border-left: 4px solid #dc3232;    padding: 12px 10px; margin-left: 0; margin-bottom: 20px; background-color: #fff;  box-shadow: 0 1px 1px 0 rgba(0,0,0,.1); letter-spacing: 0;  font-size: 13px;
line-height: 20px;margin-top: 10px;color: #626262;max-width: 250px;position: fixed;right: 0;
    top: 20px;z-index:2; -webkit-transition: .3s; -o-transition: .3s;   transition: .3s;  -webkit-transform: translate(500px,10px);  -ms-transform: translate(500px,10px);   transform: translate(500px,10px); }
.error-box.success{border-left: 4px solid #FFC840;}

.error-box.error.show-error, .error-box.success.show-error{ opacity: 1;-webkit-transform: translate(0px,10px); -ms-transform: translate(0px,10px); transform: translate(0px,10px);}    
.error-box strong{color:#626262}
.center{text-align:center; }
.link-expired{margin:40px 0px 0px;text-align:center; }
.link-expired p{color:#959595;font-size:15px; }
.link-expired svg{width:80px;fill:#dc3232; }
.login-container .login-content-2 .link-expired h2{margin: 5px 0px 0px;padding: 0px;}
/**check box**/
.checkbox, .radio {display: inline-block;  position: relative; vertical-align:middle; padding: 0 0 0 25px; height: 20px;float:left;}
.checkbox input,.radio input {top: 0;left: 0;margin: 0 !important;z-index: 1;cursor: pointer;opacity: 0;filter: alpha(opacity=0);}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {position: absolute;argin-left: -20px;margin-top: 4px \9;}
.checkbox .input-helper:before,
.radio .input-helper:before,
.checkbox .input-helper:after,
.radio .input-helper:after {-webkit-transition: all;-o-transition: all;transition: all;-webkit-transition-duration: 250ms;  transition-duration: 250ms;-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;backface-visibility: hidden;position: absolute; content: "";}
.checkbox .input-helper:before,
.radio .input-helper:before {left: 0;border: 1px solid #ccc;}
.checkbox.disabled, .radio.disabled { opacity: 0.6;filter: alpha(opacity=60);}
.checkbox input {width: 17px;height:17px;}
.checkbox input:checked + .input-helper:before {-webkit-transform: scale(0);-ms-transform: scale(0);-o-transform: scale(0);transform: scale(0);}
.checkbox input:checked + .input-helper:after {  -webkit-transform: scale(1) rotate(-50deg); -ms-transform: scale(1) rotate(-50deg);-o-transform: scale(1) rotate(-50deg);transform: scale(1) rotate(-50deg); opacity: 1;filter: alpha(opacity=100);}
.checkbox .input-helper:before {top: 3px;width: 17px; height: 17px;}
.checkbox .input-helper:after {opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0) rotate(80deg);
  -ms-transform: scale(0) rotate(80deg);-o-transform: scale(0) rotate(80deg);transform: scale(0) rotate(80deg);  width: 22px;height: 9px;border-bottom: 2px solid #019F98; border-left: 2px solid #019F98; border-bottom-left-radius: 2px;left: -1px;  top: 1px;}
  .mobile-logo{display:none; }
/**responsive**/



@media (max-width:991px) {
/**login**/
.login-container .login-content-1 .logo {width: 170px;}
.login-container .login-content-1 h2{font-size:23px; }
.login-container .login-content-1 ul li{font-size: 13px;}
.login-container .col-6 .form-bx, .login-container .col-6{ padding: 40px 35px;}
.login-container .login-content-1:before{width:45%;}
.login-container .login-content-1{width:45%; }
.login-container .col-6.login-content-2{width: 55%;}
}


@media (max-width:767px) {
.login-container{min-height:auto;margin: 15px auto;}
.login-container .login-content-1 h2, .login-container .login-content-1 ul, .login-container .login-content-1:before{display:none;}
.login-container .login-content-1{width:100%;background:#FFC840;}
.login-container .col-6 .form-bx, .login-container .col-6 {
    padding: 25px 25px;}
.login-container .col-6.login-content-2{width:100%; }    
.login-container .login-content-2 h2{margin-top:10px; }
.login-container .col-6.login-content-2{min-height:420px; }
.login-container .login-content-1 .logo svg{display:none; }
.login-container .login-content-1 .logo .mobile-logo, .login-container .login-content-1 .logo .mobile-logo svg{display:block; }
.login-container .login-content-1 .logo { width: 120px; margin: 0 auto;}

}
@media (max-width:599px) {
.login-container .login-content-1 .logo { width: 70px; margin: 0 auto;}
.mobile-logo svg{height:80px; }

}







