94 lines
1.9 KiB
CSS
94 lines
1.9 KiB
CSS
.footer {
|
|
margin-top: calc(var(--diagonal-space) * -1);
|
|
padding-top: calc(var(--diagonal-space) + var(--space-10));
|
|
padding-bottom: var(--space-10);
|
|
background-color: var(--grey-light);
|
|
-moz-osx-font-smoothing: grayscale;
|
|
-webkit-font-smoothing: antialiased;
|
|
row-gap: 4rem;
|
|
}
|
|
.footer__primary-navigation,
|
|
.footer__secondary-navigation,
|
|
.footer__ternary-navigation {
|
|
margin: 0;
|
|
padding: 0;
|
|
list-style: none;
|
|
}
|
|
.footer__primary-navigation li,
|
|
.footer__secondary-navigation li,
|
|
.footer__ternary-navigation li {
|
|
margin-bottom: var(--space-3);
|
|
}
|
|
|
|
.footer__link {
|
|
font-size: 0.8rem;
|
|
}
|
|
.footer__link:hover,
|
|
.footer__link:focus {
|
|
border-color: transparent;
|
|
}
|
|
|
|
.footer__newsletter-form fieldset {
|
|
border: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.footer__newsletter-input {
|
|
margin-bottom: var(--space-3);
|
|
padding: 1.25em 1.75em;
|
|
width: 100%;
|
|
font-family: var(--text);
|
|
font-weight: var(--text-regular);
|
|
font-size: 1rem;
|
|
background: transparent;
|
|
border: 1px solid var(--white);
|
|
}
|
|
.footer__newsletter-input::placeholder {
|
|
font-family: var(--text);
|
|
font-weight: var(--text-regular);
|
|
}
|
|
.footer__newsletter-button {
|
|
font-size: 1rem;
|
|
}
|
|
.footer__newsletter-button:hover,
|
|
.footer__newsletter-button:focus {
|
|
}
|
|
|
|
.footer__social-networks {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.footer__social-network {
|
|
filter: invert(1);
|
|
width: 24px;
|
|
transition: transform 0.2s;
|
|
}
|
|
.footer__social-network:hover,
|
|
.footer__social-network:focus {
|
|
transform: scale(1.2);
|
|
}
|
|
@media (min-width: 500px) {
|
|
.footer__social-network {
|
|
width: 32px;
|
|
}
|
|
.footer__social-networks li:not(:first-child) {
|
|
margin-left: var(--space-7);
|
|
}
|
|
}
|
|
@media (min-width: 800px) {
|
|
.footer {
|
|
padding-bottom: var(--space-20);
|
|
}
|
|
.footer__ternary-navigation {
|
|
margin-bottom: 0;
|
|
}
|
|
.footer__ternary-navigation li {
|
|
margin-bottom: 0;
|
|
}
|
|
.footer__ternary-navigation li:not(:last-child) {
|
|
margin-right: 4rem;
|
|
}
|
|
}
|