1.login-card {
2  background-color: #f8f8f8;
3  border-radius: 10px;
4  box-sizing: border-box;
5  padding: 20px;
6  max-width: 400px;
7  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);
8}
9
10.card-header {
11  text-align: center;
12  margin-bottom: 20px;
13}
14
15.card-header h1 {
16  font-size: 2em;
17  color: #333;
18  text-shadow: 1px 1px #ddd;
19}
20
21.form-group {
22  margin-bottom: 10px;
23}
24
25.form-group label {
26  display: block;
27  font-size: 1.2em;
28  color: #555;
29  margin-bottom: 10px;
30}
31
32input[type="text"],
33input[type="email"],
34input[type="password"] {
35  box-sizing: border-box;
36  padding: 10px;
37  border-radius: 5px;
38  border: none;
39  background-color: #f0f0f0;
40  font-size: 1.2em;
41  color: #555;
42  box-shadow: inset 0px 2px 5px rgba(0, 0, 0, 0.1);
43  transition: box-shadow 0.3s ease;
44}
45
46input[type="text"]:focus,
47input[type="email"]:focus,
48input[type="password"]:focus {
49  box-shadow: inset 0px 2px 5px rgba(0, 0, 0, 0.3);
50  outline: none;
51}
52
53input[type="submit"] {
54  background-color: #007bff;
55  border: none;
56  border-radius: 5px;
57  color: #fff;
58  cursor: pointer;
59  font-size: 1.2em;
60  padding: 10px;
61  transition: background-color 0.3s ease;
62}
63
64input[type="submit"]:hover {
65  background-color: #0069d9;
66}
67
68.login-button {
69  background-color: #007bff;
70  border: none;
71  border-radius: 5px;
72  color: #fff;
73  cursor: pointer;
74  font-size: 1.2em;
75  padding: 10px;
76  width: 100%;
77  transition: background-color 0.3s ease;
78  transition: 0.25s;
79}
80
81.login-button:hover {
82  background-color: #0069d9e7;
83  -webkit-box-shadow: 0px 0px 30px 0px rgba(0,105,217,1);
84  -moz-box-shadow: 0px 0px 30px 0px rgba(0,105,217,1);
85  box-shadow: 0px 0px 30px 0px rgba(0,105,217,1);
86}
87