Необходим код установки адаптивного логотипа CSS/HTML чтобы он не менял расположение в зависимости от разрешения экрана - вопрос №3035148

Здравствуйте! Второй день пытаюсь установить логотип на WP сайт посредством блока div и стиля css соответственно, но не получается. Его нужно поставить поверх фонового хедера, изображения. Необходима фиксация, чтобы при изменении разрешения экрана, логотип оставался на том же месте, куда установлен и не съезжал. Fixed не помогает. Помимо этого, пытался разрулить ситуацию с помощью @media screen и тега <Picture>, для замены изображений согласно разрешению экрана. Сама тема WP полностью адаптивна, а логотип всё портит.
Понять бы как зафиксировать родительский контейнер, чтоб изображение в нём не смещалось… или как лучше сделать?
Итак, что имеется:
Страница где нужна установка логотипа, пусть называется index.html
Код:
<div id=«header-logo»>
<div class=«logopic»><a href=/><img src=«ссылка/logo.png» width=«242px»; height=«auto»></div></div></a>

Далее, файл стиля style.css
#header-logo {
position:relative;
top:-480px;
left:600px;
width:242px;
height:115px;

}
.logopic {
position:absolute;
}

В качестве примера сайта, прилагаю схему для наглядности..