Form by yashasvi9199

1.form {
2  display: flex;
3  flex-direction: column;
4  gap: 10px;
5  padding-left: 2em;
6  padding-right: 2em;
7  padding-bottom: 0.4em;
8  background-color: #171717;
9  border-radius: 25px;
10  transition: 0.4s ease-in-out;
11}
12
13.card {
14  background-image: linear-gradient(163deg, #00ff75 0%, #3700ff 100%);
15  border-radius: 22px;
16  transition: all 0.3s;
17}
18
19.card2 {
20  border-radius: 0;
21  transition: all 0.2s;
22}
23
24.card2:hover {
25  transform: scale(0.98);
26  border-radius: 20px;
27}
28
29.card:hover {
30  box-shadow: 0px 0px 30px 1px rgba(0, 255, 117, 0.3);
31}
32
33#heading {
34  text-align: center;
35  margin: 2em;
36  color: rgb(255, 255, 255);
37  font-size: 1.2em;
38}
39
40.field {
41  display: flex;
42  align-items: center;
43  justify-content: center;
44  gap: 0.5em;
45  border-radius: 25px;
46  padding: 0.6em;
47  border: none;
48  outline: none;
49  color: white;
50  background-color: #171717;
51  box-shadow: inset 2px 5px 10px rgb(5, 5, 5);
52}
53
54.input-icon {
55  height: 1.3em;
56  width: 1.3em;
57  fill: white;
58}
59
60.input-field {
61  background: none;
62  border: none;
63  outline: none;
64  width: 100%;
65  color: #d3d3d3;
66}
67
68.form .btn {
69  display: flex;
70  justify-content: center;
71  flex-direction: row;
72  margin-top: 2.5em;
73}
74
75.button1 {
76  padding: 0.5em;
77  padding-left: 1.1em;
78  padding-right: 1.1em;
79  border-radius: 5px;
80  margin-right: 0.5em;
81  border: none;
82  outline: none;
83  transition: 0.4s ease-in-out;
84  background-color: #252525;
85  color: white;
86}
87
88.button1:hover {
89  background-color: black;
90  color: white;
91}
92
93.button2 {
94  padding: 0.5em;
95  padding-left: 2.3em;
96  padding-right: 2.3em;
97  border-radius: 5px;
98  border: none;
99  outline: none;
100  transition: 0.4s ease-in-out;
101  background-color: #252525;
102  color: white;
103}
104
105.button2:hover {
106  background-color: black;
107  color: white;
108}
109
110.button3 {
111  margin-bottom: 3em;
112  padding: 0.5em;
113  border-radius: 5px;
114  border: none;
115  outline: none;
116  transition: 0.4s ease-in-out;
117  background-color: #252525;
118  color: white;
119}
120
121.button3:hover {
122  background-color: red;
123  color: white;
124}
125