Попытка переместить блок текста заголовка вниз в адаптивном режиме для мобильных устройств ⇐ CSS

[Anonymous]

Я новичок в программировании (и на этом форуме), пытаюсь решить проблему, возникающую при перемещении блока текста в заголовке вертикально вниз в мобильном представлении, чтобы он не закрывал мое лицо на фоновом изображении. Он отлично смотрится на любом другом адаптивном экране/размере, но на мобильных устройствах его нужно немного опустить. Насколько я понимаю, фоновое изображение контролируется в файлеstyles.css. Я считаю, что блок текста контролируется текстовым блоком заголовка индексной страницы. Я исследовал это часами, включая все, что мог найти здесь, но ничего не работает. Его можно увидеть на сайте chriscummingscollection.com. Буду очень признателен за любую помощь!

/* ГЛАВНАЯ СТРАНИЦА ===================================*/ /* Заголовок */ заголовок { фон: прозрачный URL-адрес (../img/HomeHeaderImage_CC2.jpg) вверху по центру; размер фона: обложка; } .header-content { отступ: 120 пикселей 0 100 пикселей; } @media screen и (минимальная ширина: 992 пикселей) { .header-content { отступ: 160 пикселей 0 200 пикселей; } } @media screen и (минимальная ширина: 1200 пикселей) { .header-content { отступ: 200 пикселей 0 220 пикселей; } } @media screen и (минимальная ширина: 1400 пикселей) { .header-content { отступ: 375 пикселей 0 240 пикселей; } } .header-content > span:nth-child(1) { вес шрифта: 600; размер шрифта: 11 пикселей; Расстояние между буквами: 3 пикселя; } .header-content > span:nth-child(1)::before { содержание: ""; ширина: 50 пикселей; высота: 1 пиксель; поле слева: -25 пикселей; верх: 30 пикселей; осталось: 50%; позиция: абсолютная; фон: #b99867; } .header-content h1 { семейство шрифтов: "Big Caslon"; размер шрифта: 40 пикселей; } .header-content р { максимальная ширина: 720 пикселей; вес шрифта: 500; размер шрифта: 14 пикселей; } .header-content > span:last-child { максимальная ширина: 200 пикселей; вес шрифта: 500; размер шрифта: 14 пикселей; стиль границы: сплошной; ширина границы: 1 пиксель; border-color: rgba(255, 255, 255, 0,5) прозрачный rgba(255, 255, 255, 0,5) прозрачный; } .header-content > span:last-child .trace { ширина: 30 пикселей; высота: 1 пиксель; фон: rgba(255, 255, 255, 0,5); } ТЕКСТ ЗАГОЛОВКА INDEX.HTML

КРИС КАММИНГС ПРОИЗВОДСТВО «ВСЕ В ОДНОМ» Опытное производственное лидерство + инновационное творческое видение. Один профессионал, Мы профессионально справимся со всеми вашими производственными и дизайнерскими потребностями. Я курирую целевые настройки проекты от концепции до завершения для потрясающих, безупречных результатов.
ПОРТФОЛИО 2023