
.group-label{
  width: 100%;
  height: 3rem;
  margin-top: 3rem; 
  position: relative;
  padding-top: 13px;
}

.group-label{
}

.group-label input{
  width: 100%;
  height: 100%;
  color: white;
  border: 0;
  outline: none;
  font-size: 1.3rem;
} 

.group-label input[type='text'], 
.group-label input[type='password']{
  box-sizing: border-box;
  background-color: transparent;
  border-bottom: 1px solid white;
  transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -webkit-appearance:none;
  border-radius: 0;
  padding: 0 30px;
}


.group-label input:placeholder{
  color: transparent;

}

.group-label label{
  pointer-events: none;
  inter-events: none;
  position: absolute;
  top:0;
  left: 30px;
  margin-top: 25px;;
  font-size: 1.5rem;
  
  transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out; 
}

.group-label .user,
.group-label .pwd{
  pointer-events: none;
  inter-events: none;
  position: absolute;
  top:0;
  left: 0;
  margin-top: 25px;;
  font-size: 1.5rem;
  
  transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out; 
}

.group-label .eye{
  
  position: absolute;
  top:0;
  right: 0;
  margin-top: 25px;;
  font-size: 1.5rem;
  cursor: pointer;
  transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out; 
}

.group-label input:focus + label,
.group-label input:not(:placeholder-shown) + label{
  font-size: 13px;
  margin-top: 0;

}

.group-label input[type='text']:focus,
.group-label input[type='password']:focus,
.group-label input[type='text']:focus + label,
.group-label input[type='password']:focus + label,
.group-label input:focus ~ .user,
.group-label input:focus ~ .pwd,
.group-label input:focus ~ .eye{
  color: #05a7e6; 
  border-bottom-color: #05a7e6;      
}

.button{
  padding: 0;
  background-color: #05a7e6;
  color: white;
  cursor: pointer;
  box-shadow: 0px 5px 0px #036D97;
  box-shadow: 
}

.button:hover{
  background-color: #036D97;   
  box-shadow: 0px 5px 0px #024A67; 
}

.button:active{
  position: relative;
  top: 5px;
  box-shadow: none; 
  
}

.link a{
	color: inherit;
}
