Form by akshat-patel28

1.form-container {
2  width: 350px;
3  height: 500px;
4  background-color: #fff;
5  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
6  border-radius: 10px;
7  box-sizing: border-box;
8  padding: 20px 30px;
9}
10
11.title {
12  text-align: center;
13  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
14        "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
15  margin: 10px 0 30px 0;
16  font-size: 28px;
17  font-weight: 800;
18}
19
20.form {
21  width: 100%;
22  display: flex;
23  flex-direction: column;
24  gap: 18px;
25  margin-bottom: 15px;
26}
27
28.input {
29  border-radius: 20px;
30  border: 1px solid #c0c0c0;
31  outline: 0 !important;
32  box-sizing: border-box;
33  padding: 12px 15px;
34}
35
36.page-link {
37  text-decoration: underline;
38  margin: 0;
39  text-align: end;
40  color: #747474;
41  text-decoration-color: #747474;
42}
43
44.page-link-label {
45  cursor: pointer;
46  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
47        "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
48  font-size: 9px;
49  font-weight: 700;
50}
51
52.page-link-label:hover {
53  color: #000;
54}
55
56.form-btn {
57  padding: 10px 15px;
58  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
59        "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
60  border-radius: 20px;
61  border: 0 !important;
62  outline: 0 !important;
63  background: teal;
64  color: white;
65  cursor: pointer;
66  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
67}
68
69.form-btn:active {
70  box-shadow: none;
71}
72
73.sign-up-label {
74  margin: 0;
75  font-size: 10px;
76  color: #747474;
77  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
78        "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
79}
80
81.sign-up-link {
82  margin-left: 1px;
83  font-size: 11px;
84  text-decoration: underline;
85  text-decoration-color: teal;
86  color: teal;
87  cursor: pointer;
88  font-weight: 800;
89  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
90        "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
91}
92
93.buttons-container {
94  width: 100%;
95  display: flex;
96  flex-direction: column;
97  justify-content: flex-start;
98  margin-top: 20px;
99  gap: 15px;
100}
101
102.apple-login-button,
103    .google-login-button {
104  border-radius: 20px;
105  box-sizing: border-box;
106  padding: 10px 15px;
107  box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px,
108        rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
109  cursor: pointer;
110  display: flex;
111  justify-content: center;
112  align-items: center;
113  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
114        "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
115  font-size: 11px;
116  gap: 5px;
117}
118
119.apple-login-button {
120  background-color: #000;
121  color: #fff;
122  border: 2px solid #000;
123}
124
125.google-login-button {
126  border: 2px solid #747474;
127}
128
129.apple-icon,
130    .google-icon {
131  font-size: 18px;
132  margin-bottom: 1px;
133}