Элементы меню вылазят на просмотр фото

Добрый вечер!
Подскажите пожалуйста, возможно ли убрать элементы меню при просмотре фотографий в полном размере? На главной странице отображаются нормально а на странице Portfolio первые элементы фото налазят на меню. На телефоне тоже самое. Тема стоит fotogenic. Плагин для фотогалереи использую visual-portfolio (для просмотра в полном размере фото в настройках плагина ставил библиотеку PhotoSwipe). Использовал custom css для переопределения некоторых классов:

.footer-info-wrap, .vp-pagination__item, .entry-title {
	display: none !important;
}
.site-info {
	text-align: center !important;
}
#content {
	background: none !important;
}
#masthead {
	padding: none !important;
}
.fancybox-toolbar {
    left: 0 !important;
    top: 0 !important;
    position: absolute !important;
}
#site-navigation ul li a:hover {
    color: #fff !important;
    background: #e0863c !important;
}
#site-navigation ul li a {
    color: #e0863c !important;
}
#masthead.shrink {
    background: #fff !important;
}
#masthead .social-icons ul li a > svg.svg-inline--fa.fa-facebook-f.fa-w-10 {
    color: blue; !important;
    opacity: 1 !important;
}
#masthead .social-icons ul li a:hover > svg.svg-inline--fa.fa-facebook-f.fa-w-10 {
    color: blue !important;
    opacity: 1 !important;
}
#masthead .social-icons ul li a > svg.svg-inline--fa.fa-instagram.fa-w-14 {
    color: red; !important;
    opacity: 1 !important;
}
#masthead .social-icons ul li a:hover > svg.svg-inline--fa.fa-instagram.fa-w-14 {
    color: red !important;
    opacity: 1 !important;
}
#masthead .social-icons ul li a {
    color: #D4AF37;
    opacity: 1 !important;
}
i.fa.fa-facebook {
	color: blue !important;
    opacity: 1 !important;
}
i.fa.fa-instagram {
	color: red !important;
    opacity: 1 !important;
}
.slider {
    padding-top: 25px !important;
    margin-top: 25px !important;
}
#masthead .menu-toggle a {
	color: #e0863c !important;
    font-family: "Roboto", "Arial", serif !important;
    font-weight: 150 !important;
    font-size: 15px !important;
}
#masthead .menu-toggle a > svg.svg-inline--fa.fa-bars.fa-w-14 {
	color: #D4AF37 !important;
    font-family: "Roboto", "Arial", serif !important;
    font-weight: 150 !important;
    font-size: 15px !important;
}
#site-navigation {
    background: #fff none repeat scroll 0 0 !important;
}
.aligncenter {
	text-align: center !important;
    padding-top: 15px !important;
    font-size: 14px !important;
}
.footer {
	position: absolute;
    left: 0;
    overflow: hidden;
    bottom: 0;
    color: #fff;
    width: 100%;
    background: #000;
    height: 60px;
}
.fotogenic-header-img {
	padding: 100px 0 30px !important /*100px 0 30px*/;
}
.fotogenic-header-img:before {
	content: "";
    background: rgba(255, 255, 255, 0) !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

Кто-то сталкивался с таким.. в чем возможна проблема? Фотографии проложил: foto

Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]