.site-footer { color: #fff; font-weight: 100; margin-top: 80px; position: relative; } .site-footer__cover { background-color: rgba(0, 0, 0, 0.6); height: 100%; position: relative; } .site-footer__cover .container { display: grid; grid-template-columns: 1fr 360px; gap: 30px; } .site-footer__form { display: flex; align-items: center; } .site-footer p { color: #fff; font-weight: 100; font-size: 18px; } .site-footer__info { padding-top: 45px; } .site-footer__info-branding { margin-bottom: 50px; } .site-footer:before { content: ''; position: absolute; display: block; width: 100%; height: 100%; background-image: url(img/footer.webp); background-repeat: no-repeat; background-size: cover; } @media (min-width: 1000px) and (max-width: 1199px) { .site-footer__info { padding-top: 30px; } .site-footer__info-branding { margin-bottom: 40px; } .site-footer p { font-size: 16px; } } @media (max-width: 999px) { .site-footer .site-footer { color: #fff; font-weight: 100; margin-top: 80px; position: relative; } .site-footer .site-footer__cover { background-color: rgba(0, 0, 0, 0.6); height: 100%; position: relative; } .site-footer .site-footer__cover .container { display: grid; grid-template-columns: 1fr; gap: 30px; } .site-footer p { font-size: 14px; } .site-footer__info { padding-top: 20px; } .site-footer__info-branding { margin-bottom: 30px; } }