Hugging Face's logo

Spaces:
TheGreatUnknown
/
Electro-Con-Sim
Running

App Files Community
TheGreatUnknown commited on
Commit
566d814
·
verified ·
1 Parent(s): 6ce5ba0

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +80 -14
style.css CHANGED
@@ -1,28 +1,94 @@
 
 
 
 
 
 
 
 
1
  body {
2
- padding: 2rem;
3
- font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
 
 
 
 
 
 
4
  }
5
 
 
6
  h1 {
7
- font-size: 16px;
8
- margin-top: 0;
 
 
 
9
  }
10
 
 
11
  p {
12
- color: rgb(107, 114, 128);
13
- font-size: 15px;
14
- margin-bottom: 10px;
15
- margin-top: 5px;
16
  }
17
 
 
18
  .card {
19
- max-width: 620px;
20
- margin: 0 auto;
21
- padding: 16px;
22
- border: 1px solid lightgray;
23
- border-radius: 16px;
 
 
 
 
 
 
 
 
24
  }
25
 
 
26
  .card p:last-child {
27
- margin-bottom: 0;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
28
  }
 
1
+ /* General Reset */
2
+ * {
3
+ margin: 0;
4
+ padding: 0;
5
+ box-sizing: border-box;
6
+ }
7
+
8
+ /* Body Styling */
9
  body {
10
+ font-family: 'Inter', sans-serif;
11
+ background-color: #121212; /* Dark theme background */
12
+ color: #e0e0e0; /* Light gray text */
13
+ padding: 2rem;
14
+ display: flex;
15
+ justify-content: center;
16
+ align-items: center;
17
+ min-height: 100vh;
18
  }
19
 
20
+ /* Headings */
21
  h1 {
22
+ font-size: 24px;
23
+ font-weight: 600;
24
+ text-align: center;
25
+ color: #ffffff;
26
+ margin-bottom: 10px;
27
  }
28
 
29
+ /* Paragraphs */
30
  p {
31
+ color: #b0b0b0;
32
+ font-size: 16px;
33
+ line-height: 1.6;
34
+ text-align: center;
35
  }
36
 
37
+ /* Card Container */
38
  .card {
39
+ max-width: 650px;
40
+ padding: 20px;
41
+ background: #1e1e1e; /* Dark gray card background */
42
+ border-radius: 16px;
43
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
44
+ border: 1px solid rgba(255, 255, 255, 0.1);
45
+ transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
46
+ }
47
+
48
+ /* Smooth Hover Effect */
49
+ .card:hover {
50
+ transform: translateY(-5px);
51
+ box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
52
  }
53
 
54
+ /* Last Paragraph Spacing Fix */
55
  .card p:last-child {
56
+ margin-bottom: 0;
57
+ }
58
+
59
+ /* Buttons */
60
+ button {
61
+ background: linear-gradient(135deg, #6a11cb, #2575fc);
62
+ border: none;
63
+ padding: 12px 20px;
64
+ color: #fff;
65
+ font-size: 16px;
66
+ font-weight: bold;
67
+ border-radius: 8px;
68
+ cursor: pointer;
69
+ transition: all 0.3s ease-in-out;
70
+ }
71
+
72
+ button:hover {
73
+ background: linear-gradient(135deg, #2575fc, #6a11cb);
74
+ transform: scale(1.05);
75
+ }
76
+
77
+ /* Responsive Design */
78
+ @media (max-width: 768px) {
79
+ body {
80
+ padding: 1rem;
81
+ }
82
+
83
+ .card {
84
+ padding: 15px;
85
+ }
86
+
87
+ h1 {
88
+ font-size: 20px;
89
+ }
90
+
91
+ p {
92
+ font-size: 14px;
93
+ }
94
  }