Form by Spacious74

1.container {
2  border: solid 1px #8d8d8d;
3  padding: 20px;
4  border-radius: 20px;
5  background-color: #fff;
6}
7
8.container .heading {
9  font-size: 1.3rem;
10  margin-bottom: 20px;
11  font-weight: bolder;
12}
13
14.form {
15  max-width: 300px;
16  display: flex;
17  flex-direction: column;
18  gap: 20px;
19}
20
21.form .btn-container {
22  width: 100%;
23  display: flex;
24  align-items: center;
25  gap: 20px;
26}
27
28.form .btn {
29  padding: 10px 20px;
30  font-size: 1rem;
31  text-transform: uppercase;
32  letter-spacing: 3px;
33  border-radius: 10px;
34  border: solid 1px #1034aa;
35  border-bottom: solid 1px #90c2ff;
36  background: linear-gradient(135deg, #0034de, #006eff);
37  color: #fff;
38  font-weight: bolder;
39  transition: all 0.2s ease;
40  box-shadow: 0px 2px 3px #000d3848, inset 0px 4px 5px #0070f0,
41    inset 0px -4px 5px #002cbb;
42}
43
44.form .btn:active {
45  box-shadow: inset 0px 4px 5px #0070f0, inset 0px -4px 5px #002cbb;
46  transform: scale(0.995);
47}
48
49.input-field {
50  position: relative;
51}
52
53.input-field label {
54  position: absolute;
55  color: #8d8d8d;
56  pointer-events: none;
57  background-color: transparent;
58  left: 15px;
59  transform: translateY(0.6rem);
60  transition: all 0.3s ease;
61}
62
63.input-field input {
64  padding: 10px 15px;
65  font-size: 1rem;
66  border-radius: 8px;
67  border: solid 1px #8d8d8d;
68  letter-spacing: 1px;
69  width: 100%;
70}
71
72.input-field input:focus,
73.input-field input:valid {
74  outline: none;
75  border: solid 1px #0034de;
76}
77
78.input-field input:focus ~ label,
79.input-field input:valid ~ label {
80  transform: translateY(-51%) translateX(-10px) scale(0.8);
81  background-color: #fff;
82  padding: 0px 5px;
83  color: #0034de;
84  font-weight: bold;
85  letter-spacing: 1px;
86  border: none;
87  border-radius: 100px;
88}
89
90.form .passicon {
91  cursor: pointer;
92  font-size: 1.3rem;
93  position: absolute;
94  top: 6px;
95  right: 8px;
96}
97
98.form .close {
99  display: none;
100}
101