Skip to content

Commit b89d3d7

Browse files
Create style.css
1 parent f9d13a2 commit b89d3d7

File tree

1 file changed

+144
-0
lines changed

1 file changed

+144
-0
lines changed

style.css

Lines changed: 144 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
/* General Reset */
2+
* {
3+
margin: 0;
4+
padding: 0;
5+
box-sizing: border-box;
6+
}
7+
8+
body {
9+
font-family: 'Poppins', sans-serif;
10+
line-height: 1.7;
11+
color: #fff;
12+
overflow-x: hidden;
13+
}
14+
15+
/* Hero Section */
16+
#hero {
17+
position: relative;
18+
height: 100vh;
19+
text-align: center;
20+
display: flex;
21+
align-items: center;
22+
justify-content: center;
23+
overflow: hidden;
24+
}
25+
26+
/* Rainbow Gradient Animation */
27+
#hero::before {
28+
content: "";
29+
position: absolute;
30+
top: 0; left: 0; right: 0; bottom: 0;
31+
background: linear-gradient(270deg, #ff6ec7, #ffa500, #00ffff, #7fff00, #ff4500);
32+
background-size: 1000% 1000%;
33+
animation: rainbow 20s ease infinite;
34+
z-index: 0;
35+
}
36+
37+
@keyframes rainbow {
38+
0% { background-position: 0% 50%; }
39+
50% { background-position: 100% 50%; }
40+
100% { background-position: 0% 50%; }
41+
}
42+
43+
/* Particles Canvas */
44+
#particles-js {
45+
position: absolute;
46+
width: 100%;
47+
height: 100%;
48+
z-index: 1;
49+
}
50+
51+
/* Hero Content */
52+
.hero-content {
53+
position: relative;
54+
z-index: 2;
55+
color: #fff;
56+
}
57+
58+
.logo {
59+
width: 120px;
60+
margin-bottom: 20px;
61+
border-radius: 50%;
62+
box-shadow: 0 0 15px rgba(255,255,255,0.7);
63+
}
64+
65+
h1 {
66+
font-size: 3rem;
67+
margin-bottom: 10px;
68+
}
69+
70+
.tagline {
71+
font-size: 1.2rem;
72+
margin-bottom: 20px;
73+
}
74+
75+
.cta-btn {
76+
display: inline-block;
77+
padding: 12px 24px;
78+
background: #000;
79+
color: #fff;
80+
border-radius: 30px;
81+
text-decoration: none;
82+
font-weight: 600;
83+
transition: 0.3s ease;
84+
}
85+
86+
.cta-btn:hover {
87+
background: #fff;
88+
color: #000;
89+
}
90+
91+
/* Sections */
92+
section {
93+
padding: 60px 20px;
94+
text-align: center;
95+
position: relative;
96+
animation: calmBG 25s ease infinite;
97+
background: linear-gradient(-45deg, #0f2027, #203a43, #2c5364, #1e3c72);
98+
background-size: 400% 400%;
99+
}
100+
101+
@keyframes calmBG {
102+
0% { background-position: 0% 50%; }
103+
50% { background-position: 100% 50%; }
104+
100% { background-position: 0% 50%; }
105+
}
106+
107+
section h2 {
108+
font-size: 2rem;
109+
margin-bottom: 20px;
110+
}
111+
112+
section p {
113+
max-width: 800px;
114+
margin: 0 auto 20px auto;
115+
font-size: 1.05rem;
116+
}
117+
118+
/* Lists in Code of Conduct */
119+
ul {
120+
max-width: 700px;
121+
margin: 20px auto;
122+
text-align: left;
123+
list-style-type: square;
124+
}
125+
126+
ul li {
127+
margin-bottom: 10px;
128+
}
129+
130+
/* Invitation Avatar */
131+
#invite img {
132+
border-radius: 50%;
133+
border: 2px solid #fff;
134+
margin-bottom: 10px;
135+
}
136+
137+
/* Footer */
138+
footer {
139+
padding: 20px;
140+
text-align: center;
141+
background: #111;
142+
font-size: 0.9rem;
143+
color: #bbb;
144+
}

0 commit comments

Comments
 (0)