Skip to content

Commit 432d643

Browse files
ovuiproductionovuiproduction
committed
css updated
1 parent 2c7acfa commit 432d643

52 files changed

Lines changed: 5169 additions & 5155 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎Home/index.css‎

Lines changed: 273 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,273 @@
1+
/* Custom Styles */
2+
:root {
3+
--primary-color: #00ff88; /* Neon Green */
4+
--secondary-color: #00b8ff; /* Neon Blue */
5+
--accent-color: #ff00ff; /* Neon Pink */
6+
--background-color: #1a1a1a; /* Dark Background */
7+
--text-color: #ffffff; /* White Text */
8+
--card-bg: #2a2a2a; /* Dark Card Background */
9+
--hover-effect: brightness(1.2); /* Hover Effect */
10+
}
11+
12+
/* General Styles */
13+
body {
14+
background-color: var(--background-color);
15+
color: var(--text-color);
16+
font-family: 'Arial', sans-serif;
17+
margin: 0;
18+
padding: 0;
19+
line-height: 1.6;
20+
}
21+
22+
/* Navbar */
23+
.navbar {
24+
background-color: var(--card-bg);
25+
padding: 1rem 2rem;
26+
display: flex;
27+
justify-content: space-between;
28+
align-items: center;
29+
border-bottom: 2px solid var(--primary-color);
30+
}
31+
32+
.navbar-brand {
33+
display: flex;
34+
align-items: center;
35+
font-size: 1.5rem;
36+
font-weight: bold;
37+
color: var(--primary-color);
38+
}
39+
40+
.navbar-brand i {
41+
margin-right: 0.5rem;
42+
}
43+
44+
.navbar-links {
45+
display: flex;
46+
align-items: center;
47+
gap: 1.5rem;
48+
}
49+
50+
.nav-link {
51+
color: var(--text-color);
52+
text-decoration: none;
53+
font-size: 1.1rem;
54+
transition: color 0.3s ease;
55+
}
56+
57+
.nav-link:hover {
58+
color: var(--primary-color);
59+
}
60+
61+
.dropdown {
62+
position: relative;
63+
}
64+
65+
.dropbtn {
66+
background-color: transparent;
67+
color: var(--text-color);
68+
font-size: 1.1rem;
69+
border: none;
70+
cursor: pointer;
71+
padding: 0.5rem 1rem;
72+
transition: color 0.3s ease;
73+
}
74+
75+
.dropbtn:hover {
76+
color: var(--primary-color);
77+
}
78+
79+
.dropdown-content {
80+
display: none;
81+
position: absolute;
82+
background-color: var(--card-bg);
83+
min-width: 160px;
84+
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
85+
z-index: 1;
86+
}
87+
88+
.dropdown-content a {
89+
color: var(--text-color);
90+
padding: 0.75rem 1rem;
91+
text-decoration: none;
92+
display: block;
93+
transition: background-color 0.3s ease;
94+
}
95+
96+
.dropdown-content a:hover {
97+
background-color: var(--primary-color);
98+
color: var(--background-color);
99+
}
100+
101+
.dropdown:hover .dropdown-content {
102+
display: block;
103+
}
104+
105+
106+
.hero {
107+
background: linear-gradient(to right, var(--background-color), var(--card-bg));
108+
padding: 5rem 2rem;
109+
text-align: center;
110+
}
111+
112+
.hero h1 {
113+
font-size: 3rem;
114+
font-weight: bold;
115+
color: var(--primary-color);
116+
margin-bottom: 1rem;
117+
}
118+
119+
.hero p {
120+
font-size: 1.2rem;
121+
color: var(--text-color);
122+
margin-bottom: 2rem;
123+
}
124+
125+
.main-container {
126+
padding: 2rem;
127+
}
128+
129+
.section {
130+
margin-bottom: 4rem;
131+
}
132+
133+
.section h2 {
134+
font-size: 2.5rem;
135+
font-weight: bold;
136+
color: var(--primary-color);
137+
margin-bottom: 2rem;
138+
text-align: center;
139+
}
140+
141+
.grid-container {
142+
display: grid;
143+
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
144+
gap: 2rem;
145+
justify-content: center;
146+
}
147+
148+
.card {
149+
background-color: var(--card-bg);
150+
border-radius: 10px;
151+
padding: 2rem;
152+
text-align: center;
153+
transition: transform 0.3s ease, box-shadow 0.3s ease;
154+
text-decoration: none;
155+
}
156+
157+
.card:hover {
158+
transform: translateY(-10px);
159+
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
160+
}
161+
162+
.icon {
163+
font-size: 3rem;
164+
color: var(--primary-color);
165+
margin-bottom: 1rem;
166+
transition: color 0.3s ease;
167+
}
168+
169+
.card:hover .icon {
170+
color: var(--secondary-color);
171+
}
172+
173+
.card p {
174+
font-size: 1.2rem;
175+
font-weight: bold;
176+
color: var(--text-color);
177+
margin-top: 1rem;
178+
transition: color 0.3s ease;
179+
text-decoration: none;
180+
}
181+
182+
.card a{
183+
text-decoration: none;
184+
}
185+
186+
.card:hover p {
187+
color: var(--primary-color);
188+
}
189+
190+
footer {
191+
background-color: var(--card-bg);
192+
padding: 2rem;
193+
text-align: center;
194+
border-top: 2px solid var(--primary-color);
195+
}
196+
197+
footer p {
198+
margin-bottom: 1rem;
199+
}
200+
201+
.social-links a {
202+
color: var(--text-color);
203+
font-size: 1.5rem;
204+
margin: 0 0.5rem;
205+
transition: color 0.3s ease;
206+
}
207+
208+
.social-links a:hover {
209+
color: var(--primary-color);
210+
}
211+
212+
/* Responsive Design */
213+
@media (max-width: 768px) {
214+
.navbar {
215+
flex-direction: column;
216+
align-items: flex-start;
217+
}
218+
219+
.navbar-links {
220+
flex-direction: column;
221+
align-items: flex-start;
222+
gap: 1rem;
223+
}
224+
225+
.hero h1 {
226+
font-size: 2rem;
227+
}
228+
229+
.section h2 {
230+
font-size: 2rem;
231+
}
232+
233+
.grid-container {
234+
grid-template-columns: 1fr;
235+
}
236+
}
237+
238+
.bot-icon{
239+
background-color: #1a1a1a;
240+
width:50px;
241+
height:50px;
242+
border-radius: 50%;
243+
position: fixed;
244+
bottom:2rem;
245+
right:2rem;
246+
text-decoration: none;
247+
display: flex;
248+
align-items: center;
249+
justify-content: center;
250+
z-index:1;
251+
}
252+
253+
.bot-icon:hover i{
254+
color: #00b8ff;
255+
}
256+
257+
.bot-icon i{
258+
font-size:18px;
259+
color:var(--primary-color);
260+
}
261+
262+
::-webkit-scrollbar {
263+
width: 8px;
264+
}
265+
266+
::-webkit-scrollbar-track {
267+
background: transparent;
268+
}
269+
270+
::-webkit-scrollbar-thumb {
271+
background: #555;
272+
border-radius: 4px;
273+
}

0 commit comments

Comments
 (0)