@font-face {
 font-family:Poppins-Regular;
 src:url(../fonts/poppins/Poppins-Regular.ttf)
}
@font-face {
 font-family:Poppins-Medium;
 src:url(../fonts/poppins/Poppins-Medium.ttf)
}
@font-face {
 font-family:Poppins-Bold;
 src:url(../fonts/poppins/Poppins-Bold.ttf)
}
@font-face {
 font-family:Poppins-SemiBold;
 src:url(../fonts/poppins/Poppins-SemiBold.ttf)
}
* {
 margin:0;
 padding:0;
 box-sizing:border-box
}
body,
html {
 height:100%;
 font-family:Poppins-Regular,sans-serif
}
a {
 font-family:Poppins-Regular;
 font-size:14px;
 line-height:1.7;
 color:#fff;
 margin:0;
 transition:all .4s;
 -webkit-transition:all .4s;
 -o-transition:all .4s;
 -moz-transition:all .4s
}
a:focus {
 outline:none!important
}
a:hover {
 text-decoration:none;
 color:#a64bf4
}
h1,
h2,
h3,
h4,
h5,
h6 {
 margin:0
}
p {
 font-family:Poppins-Regular;
 font-size:14px;
 line-height:1.7;
 color:#666;
 margin:0
}
ul,
li {
 margin:0;
 list-style-type:none
}
input {
outline: none;
border: 2px solid #01bbd4;
border-radius: 25px;
}
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:#adadad
}
textarea:-moz-placeholder {
 color:#adadad
}
textarea::-moz-placeholder {
 color:#adadad
}
textarea:-ms-input-placeholder {
 color:#adadad
}
button {
 outline:none!important;
 border:none;
 background:0 0
}
button:hover {
 cursor:pointer
}
iframe {
 border:none!important
}
.txt1 {
 font-family:Poppins-Regular;
 font-size:14px;
 line-height:1.5;
 color:#666
}
.txt2 {
 font-family:Poppins-Regular;
 font-size:14px;
 line-height:1.5;
 color:#333;
 text-transform:uppercase
}
.bg1 {
 background-color:#3b5998
}
.bg2 {
 background-color:#1da1f2
}
.bg3 {
 background-color:#ea4335
}
.limiter {
 width:100%;
 margin:0 auto
}
.container-login100 {
 width:100%;
 min-height:100vh;
 display:-webkit-box;
 display:-webkit-flex;
 display:-moz-box;
 display:-ms-flexbox;
 display:flex;
 flex-wrap:wrap;
 justify-content:center;
 align-items:center;
 padding:15px;
 background-repeat:no-repeat;
 background-position:center;
 background-size:cover
}
.wrap-login100 {
 width:500px;
 /*background:#fff;*/
 border-radius:10px;
 overflow:hidden
}
.login100-form {
 width:100%
}
.login100-form-title {
 display:block;
 font-family:Poppins-Bold;
 font-size:39px;
 color:#333;
 line-height:1.2;
 text-align:center
}
.wrap-input100 {
 width:100%;
 position:relative;
 /*border-bottom:2px solid #d9d9d9*/
}
.label-input100 {
 font-family:Poppins-Regular;
 font-size:14px;
 color:#333;
 line-height:1.5;
 padding-left:7px
}
.input100 {
 /*font-family:Poppins-Medium;*/
 font-size:16px;
 color:#fff;
 line-height:1.2;
 display:block;
 width:100%;
 height:55px;
 background:0 0;
 padding:0 7px 0 43px
}
.focus-input100 {
 position:absolute;
 display:block;
 width:100%;
 height:100%;
 top:0;
 left:0;
     color: #fff;
 pointer-events:none
 
}
.focus-input100::after {
 content:attr(data-symbol);
 font-family:Material-Design-Iconic-Font;
 color:#adadad;
 font-size:22px;
 display:-webkit-box;
 display:-webkit-flex;
 display:-moz-box;
 display:-ms-flexbox;
 display:flex;
 align-items:center;
 justify-content:center;
 position:absolute;
 height:calc(100% - 20px);
 bottom:0;
 left:0;
 padding-left:13px;
 padding-top:3px
}
.focus-input100::before {
 content:"";
 display:block;
 position:absolute;
 bottom:33px;
 left:30px;
 width:0;
 height:2px;
 /*background:#7f7f7f;*/
 -webkit-transition:all .4s;
 -o-transition:all .4s;
 -moz-transition:all .4s;
 transition:all .4s
}
.input100:focus+.focus-input100::before {
 width:100%
}
.has-val.input100+.focus-input100::before {
 width:100%
}
.input100:focus+.focus-input100::after {
 color:#a64bf4
}
.has-val.input100+.focus-input100::after {
 color:#a64bf4
}
.container-login100-form-btn {
 display:-webkit-box;
 display:-webkit-flex;
 display:-moz-box;
 display:-ms-flexbox;
 display:flex;
 flex-wrap:wrap;
 justify-content:center
}
.wrap-login100-form-btn {
 width:100%;
 display:block;
 position:relative;
 z-index:1;
 border-radius:25px;
 overflow:hidden;
 margin:0 auto;
 box-shadow:0 5px 30px 0 rgba(3,216,222,.2);
 -moz-box-shadow:0 5px 30px 0 rgba(3,216,222,.2);
 -webkit-box-shadow:0 5px 30px 0 rgba(3,216,222,.2);
 -o-box-shadow:0 5px 30px 0 rgba(3,216,222,.2);
 -ms-box-shadow:0 5px 30px 0 rgba(3,216,222,.2)
}
.login100-form-bgbtn {
 position:absolute;
 z-index:-1;
 width:300%;
 height:100%;
 background:#a64bf4;
 background:-webkit-linear-gradient(right,#00dbde,#fc00ff,#00dbde,#fc00ff);
 background:-o-linear-gradient(right,#00dbde,#fc00ff,#00dbde,#fc00ff);
 background:-moz-linear-gradient(right,#00dbde,#fc00ff,#00dbde,#fc00ff);
 background:linear-gradient(right,#00dbde,#fc00ff,#00dbde,#fc00ff);
 top:0;
 left:-100%;
 -webkit-transition:all .4s;
 -o-transition:all .4s;
 -moz-transition:all .4s;
 transition:all .4s
}
.login100-form-btn {
 font-family:Poppins-Medium;
 font-size:16px;
 color:#fff;
 line-height:1.2;
 text-transform:uppercase;
 display:-webkit-box;
 display:-webkit-flex;
 display:-moz-box;
 display:-ms-flexbox;
 display:flex;
 justify-content:center;
 align-items:center;
 padding:0 20px;
 width:100%;
 height:50px
}
.wrap-login100-form-btn:hover .login100-form-bgbtn {
 left:0
}
.validate-input {
 position:relative
}
.alert-validate::before {
 content:attr(data-validate);
 position:absolute;
 max-width:70%;
 background-color:#fff;
 border:1px solid #c80000;
 border-radius:2px;
 padding:4px 25px 4px 10px;
 bottom:calc((100% - 20px)/2);
 -webkit-transform:translateY(50%);
 -moz-transform:translateY(50%);
 -ms-transform:translateY(50%);
 -o-transform:translateY(50%);
 transform:translateY(50%);
 right:2px;
 pointer-events:none;
 font-family:Poppins-Regular;
 color:#c80000;
 font-size:13px;
 line-height:1.4;
 text-align:left;
 visibility:hidden;
 opacity:0;
 -webkit-transition:opacity .4s;
 -o-transition:opacity .4s;
 -moz-transition:opacity .4s;
 transition:opacity .4s
}
.alert-validate::after {
 content:"\f06a";
 font-family:FontAwesome;
 display:block;
 position:absolute;
 color:#c80000;
 font-size:16px;
 bottom:calc((100% - 20px)/2);
 -webkit-transform:translateY(50%);
 -moz-transform:translateY(50%);
 -ms-transform:translateY(50%);
 -o-transform:translateY(50%);
 transform:translateY(50%);
 right:8px
}
.alert-validate:hover:before {
 visibility:visible;
 opacity:1
}
@media(max-width:992px) {
 .alert-validate::before {
  visibility:visible;
  opacity:1
 }
}
.login100-social-item {
 font-size:25px;
 color:#fff;
 display:-webkit-box;
 display:-webkit-flex;
 display:-moz-box;
 display:-ms-flexbox;
 display:flex;
 justify-content:center;
 align-items:center;
 width:50px;
 height:50px;
 border-radius:50%;
 margin:5px
}
.login100-social-item:hover {
 color:#fff;
 background-color:#333
}
@media(max-width:576px) {
 .wrap-login100 {
  padding-left:15px;
  padding-right:15px
 }
}
