Контент начальной загрузки выходит из поля зрения при изменении размера

Question

Я исследую с помощью начальной загрузки и использую навигационную панель с flexbox, и всякий раз, когда я изменяю размер своего браузера до меньшего размера, он выходит из поля зрения любого эксперта по начальной загрузке или любого, кто может указать, что я делаю неправильно ??

ПРИМЕЧАНИЕ

Я внедряю свой загрузчик с Laravel 5.7

<div class="container">
    <nav class="navbar fixed-top navbar-light main-color">
        <ul class="nav navbar-nav flex-row align-items-center w-100">
            <div class="d-flex flex-row align-items-center w-25 justify-content-around">
                <li class="nav-item">
                <span style="font-size:30px;cursor:pointer;color:white" onclick="openNav()">&#9776;
                </li>
                <li class="nav-item">
                    <a href="{{route('home')}}" class="navbar-brand nav-link">
                    <img src="{{asset('images/logo/logo-white-small.png')}}" class="brand-logo">
                    </a>
                </li>
            </div>
        </ul>
    </nav>
</div>

ПОЛНЫЙ ВИД

SHRINK BROWSER