f7db72ce97
Added appropriate styling to match the design in both locations Confirmed the changes look good Let me complete this task.
91 lines
1.6 KiB
CSS
91 lines
1.6 KiB
CSS
footer {
|
|
background: var(--bg-card);
|
|
padding: var(--spacing-xl) var(--spacing-md);
|
|
margin-top: calc(2 * var(--spacing-xl));
|
|
border-top: 1px solid var(--border-color);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: var(--spacing-lg);
|
|
}
|
|
|
|
.contact-block {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
gap: var(--spacing-lg);
|
|
margin-bottom: var(--spacing-sm);
|
|
}
|
|
|
|
.contact-item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-sm);
|
|
}
|
|
|
|
.contact-item i {
|
|
color: var(--primary);
|
|
font-size: 1.2rem;
|
|
}
|
|
|
|
.contact-item .signal-icon {
|
|
color: var(--primary);
|
|
width: 1.2rem;
|
|
height: 1.2rem;
|
|
}
|
|
|
|
.contact-item a {
|
|
color: var(--text-muted);
|
|
text-decoration: none;
|
|
transition: color var(--transition-speed) ease;
|
|
}
|
|
|
|
.contact-item a:hover {
|
|
color: var(--primary);
|
|
}
|
|
|
|
.contact-item:hover .signal-icon {
|
|
color: var(--primary);
|
|
}
|
|
|
|
.social-links {
|
|
display: flex;
|
|
gap: var(--spacing-lg);
|
|
justify-content: center;
|
|
}
|
|
|
|
.social-links a {
|
|
color: var(--text-muted);
|
|
text-decoration: none;
|
|
transition: color var(--transition-speed) ease;
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.social-links a:hover {
|
|
color: var(--primary);
|
|
}
|
|
|
|
.legal-links {
|
|
text-align: center;
|
|
font-size: 0.9rem;
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
.legal-links a {
|
|
color: var(--text-muted);
|
|
text-decoration: none;
|
|
margin: 0 var(--spacing-sm);
|
|
transition: color var(--transition-speed) ease;
|
|
}
|
|
|
|
.legal-links a:hover {
|
|
color: var(--primary);
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.contact-block {
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
}
|