[laimas]

1) У меня разрешение Full HD, это 1920 х 1080, и уже для него размер шрифта слишком большой. Переключаясь в более низкое разрешение, все будет выглядеть еще более крупным. А пункт Период содержит форму, которая не открывается в popup, а непосредственно в меню, следовательно последний пункт меню при моем разрешение уже на границе "не видно" находится. При меньшем разрешении значит вообще будут скрыты последние элементы меню. Может быть все таки подумать над размером шрифта, как и над отступами между пунктами меню, которые также слишком велики.

2) Кнопка Close, которая у вас в коде здесь показана, оказывается относится к форме, а кнопка свернуть/развернуть панель, это логотип. Значит переносить нужно логотип.

3) <div class="bottom"></div> - что здесь, что на сервере, этот элемент пуст, и если он не используется значит его удалить.

4) Что нужно сделать. Вот html-структура панели как она выглядит на сайте (сокращение для повторяемых блоков и без вложенной формы):

<div class="skel-layers-fixed" id="header" style="backface-visibility: hidden; transition: -moz-transform 0.5s ease 0s, opacity 0.5s ease 0s;">

    <div class="top">
        
        <div id="logo">
            <div class="image avatar"><img /></div>
        </div>

        <div class="link_group">
            <div class="link_group_block"><a href="#" rel="period" class=""><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ПЕРИОД</span></a></div>
            <div class="link_group_block"><a href="#" rel="objects"><span style="border-bottom: 1px dashed #595a5d; margin-left: 30px;">ОБЪЕКТЫ</span></a></div>
			.....
        </div>
						
    </div>
				
    <div class="bottom"></div>
			
</div>

style="backface-visibility: hidden; transition: -moz-transform 0.5s ease 0s, opacity 0.5s ease 0s;" - пользы от этого не видно никакой. Более того, боковая панель имеет тень справа, есть ли от этого польза или нет, это вопрос спорный, но вот все popup не имеют теней, хотя их оттенить было куда более полезным.

В каком направлении нужно изменить структуру боковой панели и стили. Если элементы SPAN в элементах меню действительно нужны, то удалить у них прописанные в тегах стили

border-bottom: 1px dashed #595a5d; margin-left: 30px;

перенеся в border-bottom: 1px dashed #595a5d; в CSS, а margin-left: 30px; удалить вообще. Отступ слева 30px пунктам меню должен определять родительский элемент <div class="link_group">, в его стилях этот отступ и нужно прописать. Вот такая должна быть структура после изменений:

<div class="skel-layers-fixed" id="header">
    
    <div id="logo">
            <div class="image avatar"><img /></div>
    </div>
    
    <div id="swap">    
    
        <div class="link_group">
                <div class="link_group_block"><a href="#" rel="period"><span>ПЕРИОД</span></a></div>
                <div class="link_group_block"><a href="#" rel="objects"><span>ОБЪЕКТЫ</span></a></div>
                .....
        </div>
				
        <div class="bottom"></div>
    
    </div>
			
</div>

Здесь предполагается, что использутеся <div class="bottom"> и возможно иные блоки. Все блоки панели, которые при ее изменении перемещаются помещены в родительский блок <div id="swap">.

Внешние отступы слева в 30рх у элементов, о которых говорилось выше, можно и не задавать каждому из элементов родителя <div id="swap">, а задать такой отступ, но внутренний <div id="swap">.

Элемент <div id="swap"> и его дочерние элементы, как то <div class="link_group">, <div class="bottom"> и возможно другие, не должны иметь абсолютного позиционирования, как это указано у вас, этого совсем не требуется, да и усложняет изменения/дополнения в боковой панели. Сдвигать <div id="swap"> можно управляя его внешним отступом слева.

Подумайте, измените. А разобравшись с панелью, будете разбираться с остальным, чего у вас не так, а оно у вас есть, включая и ошибки.