Почему Не срабатывает в margin top через @media?
Потому, что стоит переопределение@media only screen and (max-width: 767px)
.single-featured-image-header img {
    margin-top: -22px;
}
строка 569 файл responsive.css
Сделайте себе за правило. Если вы верстаете desktop-first (от большей версии к мобильной), то медиа запросы должны идти в порядке убывания, чтобы для маленького разрешения был больший приоритет. Ну или используйте диапазоны в медиазапросах.
ну или как крайний вариант использовать !important