Input by arafatrahat94

1.form__group_one {
2  position: relative;
3}
4
5.form__group_oneform__field {
6  border: 1px solid silver !important;
7  border-radius: 5px;
8  box-sizing: border-box;
9  color: #0b2447;
10  height: 40px;
11  padding: 0rem 15px;
12  box-shadow: 5px 5px 0 0;
13}
14
15.form__group_oneform__field::placeholder {
16  color: transparent;
17}
18
19.form__group_oneform__field:placeholder-shown ~ .form__group_oneform__label {
20  top: 10px;
21  border-right: none;
22  border-left: none;
23}
24
25.form__group_oneform__label {
26  background-color: white;
27  border-left: 1px solid silver;
28  border-right: 1px solid silver;
29  color: #9b9b9b;
30  display: block;
31  font-size: 0.9em;
32  margin-left: 10px;
33  padding: 0 10px;
34  pointer-events: none;
35  position: absolute;
36  top: -10px;
37  transition: 0.2s;
38}
39
40.form__group_oneform__field:focus {
41  border: 1px solid #0b2447 !important;
42  outline: none;
43  box-shadow: none;
44  transform: matrix3d();
45  animation-duration: 1;
46}
47
48.form__group_oneform__field:focus ~ .form__group_oneform__label {
49  background-color: white;
50  border-right: 1px solid #0b2447;
51  border-left: 1px solid #0b2447;
52  color: #0b2447;
53  font-size: 0.9em;
54  margin-left: 10px;
55  padding: 0 10px;
56  position: absolute;
57  top: -10px;
58  transition: 0.2s;
59}
60