This repository has no description
1/* src/components/Footer/Footer.css */
2
3 .footer-container {
4 max-width: 1200px; /* Max width of the content */
5 margin: 0 auto; /* Center the content */
6 padding: 0 20px; /* Horizontal padding */
7 display: flex;
8 flex-direction: column;
9 align-items: center;
10 }
11
12 .footer-links {
13 margin-bottom: 10px;
14 }
15
16 .footer-links a {
17 margin: 0 10px; /* Spacing between links */
18 text-decoration: none;
19 color: #333333; /* Dark gray color for links */
20 font-size: 0.9rem;
21 transition: color 0.3s ease;
22 }
23
24 .dark-mode .footer-links a {
25 color: white;
26 }
27
28 .footer-links a:hover {
29 color: #3B9AF8; /* Change color on hover */
30 }
31
32 .footer-info p {
33 margin: 0;
34 color: #666666; /* Medium gray color for text */
35 font-size: 0.8rem;
36 }
37
38 /* Responsive Design: Adjust for smaller screens */
39 @media (max-width: 768px) {
40 .footer-container {
41 align-items: flex-start;
42 }
43
44 .footer-links {
45 width: 100%;
46 display: flex;
47 flex-wrap: wrap;
48 justify-content: center;
49 }
50
51 .footer-links a {
52 margin: 5px 10px;
53 }
54
55 .footer-info {
56 width: 100%;
57 text-align: center;
58 }
59 }
60
61 .footer {
62 background-color: var(--navbar-bg);
63 color: var(--navbar-text);
64 padding: 1rem 2rem;
65 text-align: center;
66 border-top: 5px solid var(--card-border);
67 border-bottom: none;
68 }