Input by liyaxu123

1.form-control {
2  position: relative;
3  margin: 20px 0 40px;
4  width: 190px;
5}
6
7.form-control input {
8  background-color: transparent;
9  border: 0;
10  border-bottom: 2px #fff solid;
11  display: block;
12  width: 100%;
13  padding: 15px 0;
14  font-size: 18px;
15  color: #fff;
16}
17
18.form-control input:focus,
19.form-control input:valid {
20  outline: 0;
21  border-bottom-color: lightblue;
22}
23
24.form-control label {
25  position: absolute;
26  top: 15px;
27  left: 0;
28  pointer-events: none;
29}
30
31.form-control label span {
32  display: inline-block;
33  font-size: 18px;
34  min-width: 5px;
35  color: #fff;
36  transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
37}
38
39.form-control input:focus+label span,
40.form-control input:valid+label span {
41  color: lightblue;
42  transform: translateY(-30px);
43}