Неккоректно отображается header

/*!
Theme Name: YegresTheme
Theme URI: http://underscores.me/
Author: Sergey Kutashevskiy
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: yegrestheme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

YegresTheme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/


@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 200;
  src: url("assets/fonts/Lato/Lato-Light.ttf") format("woff2");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  src: url("assets/fonts/Lato/Lato-Regular.ttf") format("woff2");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 500;
  src: url("assets/fonts/Lato/Lato-Medium.ttf") format("woff2");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 600;
  src: url("assets/fonts/Lato/Lato-Semibold.ttf") format("woff2");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 700;
  src: url("assets/fonts/Lato/Lato-Bold.ttf") format("woff2");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 200;
  src: url("assets/fonts/Roboto/Roboto-Light.ttf") format("woff2");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("assets/fonts/Roboto/Roboto-Regular.ttf") format("woff2");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src: url("assets/fonts/Roboto/Roboto-Medium.ttf") format("woff2");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("assets/fonts/Roboto/Roboto-Bold.ttf") format("woff2");
}

::-webkit-input-placeholder {
  color: #666;
}

::-moz-placeholder {
  color: #666;
}

:-ms-input-placeholder {
  color: #666;
}

::-ms-input-placeholder {
  color: #666;
}

::placeholder {
  color: #666;
}

::-moz-selection {
  background-color: #FF6056;
  color: #fff;
}

::selection {
  background-color: #FF6056;
  color: #fff;
}

html {
  font-size: 16px;
}

input, textarea {
  outline: none;
}

input:focus:required:invalid, textarea:focus:required:invalid {
  border-color: red;
}

input:required:valid, textarea:required:valid {
  border-color: green;
}

body {
  font-size: 1rem;
  min-width: 320px;
  position: relative;
  line-height: 1.65;
  font-family: 'Roboto', sans-serif;
  overflow-x: hidden;
  color: #333;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Lato', sans-serif;
}

header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  padding: 15px 56px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 99999;
}


header .main-menu {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

header .main-menu ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

header .main-menu ul, header .main-menu li {
  text-decoration: none;
  padding: 0;
  margin: 0;
  list-style-type: none;
}

header .main-menu li {
  margin-right: 48px;
}

header .main-menu li a {
  color: #333333;
  font-family: 'Lato';
  font-weight: 500;
  font-size: 1.125rem;
}

header .main-menu li a:hover {
  text-decoration: none;
  color: rgba(51, 51, 51, 0.8);
}

.hamburger {
  padding: 0;
  padding-top: 6px;
}

.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
  background-color: #333333;
  border-radius: 0px;
  width: 38px;
}

.logo img {
  height: 20px;
}

.welcome {
  width: 100%;
  height: 100vh;
  background-image: url("assets/img/@1x/background-home.jpg");
  background-size: cover;
  background-position: left center;
}

.welcome .block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 56px;
  height: 100%;
  width: 50%;
  background-color: rgba(255, 255, 255, 0.25);
}

.welcome .block h1 {
  font-size: 2rem;
}

.welcome .block p {
  font-size: 1.125rem;
  padding: 0;
  padding-bottom: 16px;
}

.m-button {
  position: relative;
  text-decoration: none;
  color: #ffffff;
  background-color: #FF6056;
  padding: 8px 48px;
  font-size: 1.25rem;
  border-radius: 5%;
  letter-spacing: 2px;
}

.m-button:after {
  position: absolute;
  width: 100%;
  height: 3px;
  bottom: 0;
  left: 0;
  background-color: #890800;
  opacity: 0.2;
  border-radius: 5%;
  content: '';
}

.m-button:hover {
  text-decoration: none;
  color: #ffffff;
  background-color: rgba(255, 96, 86, 0.8);
}

.head-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 32px;
}

.head-section a {
  color: #333333;
  font-size: 1.625rem;
}

.head-section a:hover {
  opacity: 0.7;
}

.head-section h2 {
  margin: 0;
}

.trips {
  padding: 72px 56px;
  background-color: #D1F9FC;
}

.trips .container-trips {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.trips .container-trips .trip {
  width: 31%;
  background-color: #fff;
  border: 1px solid #d3d3d3;
  color: #333333;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

.trips .container-trips .trip:hover {
  text-decoration: none;
  -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
          box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
}

.trips .container-trips .trip .trip-header {
  padding: 8px;
}

.trips .container-trips .trip .trip-header h3 {
  color: #456062;
  font-size: 1.2rem;
}

.trips .container-trips .trip .trip-header p {
  margin-bottom: 8px;
  color: #727070;
}

.trips .container-trips .trip img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  height: 250px;
}

.trips .container-trips .trip .trip-footer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 8px;
  color: #727070;
}

.about {
  padding: 72px 56px 144px;
  background-color: #D1F9FC;
}

.about .container-about {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.about .container-about .about-preview {
  background-color: #fff;
  width: 55%;
  border: 1px solid #d3d3d3;
}

.about .container-about .about-preview p {
  padding: 0;
  margin: 0;
  padding: 16px;
  color: #727070;
  font-size: 1.125rem;
}

.about .container-about .about-preview img {
  width: 100%;
}

.about .container-about .about-card {
  width: 40%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.about .container-about .about-card .blank {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px 24px;
  background-color: #fff;
  border: 1px solid #d3d3d3;
}

.about .container-about .about-card .blank p {
  padding: 0;
  margin: 0;
  margin-left: 32px;
  font-size: 1.125rem;
  font-weight: 400;
  color: #456062;
  line-height: 1.4;
}

.about .container-about .about-card .blank img {
  width: 56px;
}

footer {
  background-color: #333333;
  padding: 48px 56px;
  color: #ffffff;
}

footer a:hover {
  opacity: 0.7;
  text-decoration: none;
}

footer ul, footer li {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-decoration: none;
}

footer .footer-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 16px;
  border-bottom: 2px solid #ffffff;
}

footer .footer-top .logo a {
  opacity: 1;
}

footer .footer-top .social {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

footer .footer-top .social li {
  margin-left: 32px;
}

footer .footer-top .social li a {
  color: #ffffff;
}

footer .footer-top .social li a i {
  font-size: 1.75rem;
}

footer .footer-bottom {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 16px;
}

footer .footer-bottom .footer-menu ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

footer .footer-bottom .footer-menu ul li {
  margin-right: 32px;
}

footer .footer-bottom .footer-menu ul li a {
  font-size: 1.125rem;
  color: #fff;
}

footer .footer-bottom .copyright {
  font-size: 1.125rem;
}

.mobile-menu {
  display: none;
  position: absolute;
  z-index: 9999;
  width: 50%;
  height: 100vh;
  right: 0;
  background-color: #D1F9FC;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-animation: open .25s ease-in 1;
          animation: open .25s ease-in 1;
}

.mobile-menu ul, .mobile-menu li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.mobile-menu li {
  margin-bottom: 16px;
}

.mobile-menu li a {
  color: #333333;
  font-size: 1.5rem;
  text-align: center;
  font-family: 'Lato', sans-serif;
  font-weight: 500;
}

.mobile-menu li a:hover {
  text-decoration: none;
  opacity: 0.7;
}

@-webkit-keyframes open {
  0% {
    width: 0%;
  }
  50% {
    width: 25%;
  }
  100% {
    width: 50%;
  }
}

@keyframes open {
  0% {
    width: 0%;
  }
  50% {
    width: 25%;
  }
  100% {
    width: 50%;
  }
}

.is-open {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.display-none {
  display: none;
}
.header-position {
  position: relative !important;
  background-color: #D1F9FC;
}
@media (max-width: 1399.98px) {
  header {
    padding: 16px 32px;
  }
  .welcome .block {
    padding: 0 32px;
  }
  .trips {
    padding: 72px 32px;
  }
  .trips .container-trips .trip {
    width: 32%;
  }
  .about {
    padding: 72px 32px 144px;
  }
  footer {
    padding: 48px 32px;
  }
}

@media (max-width: 1199.98px) {
  header {
    padding: 16px 24px;
  }
  .welcome .block {
    padding: 0 24px;
  }
  .trips {
    padding: 72px 24px;
  }
  .trips .container-trips .trip {
    width: 32%;
  }
  .about {
    padding: 72px 24px 144px;
  }
  footer {
    padding: 48px 24px;
  }
}

@media (max-width: 991.98px) {
  .destkop-menu {
    display: none;
  }
  .welcome .block {
    width: 100%;
  }
  .mobile-menu {
    width: 100%;
  }
  .trips .container-trips {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .trips .container-trips .trip {
    width: 100%;
  }
  .trips .container-trips .trip:not(first-child) {
    margin-bottom: 16px;
  }
  .trips {
    padding: 72px 64px;
  }
  .about {
    padding: 72px 64px 144px;
  }
  .about .container-about {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .about .container-about .about-preview {
    width: 100%;
  }
  .about .container-about .about-card {
    width: 100%;
  }
  .about .container-about .about-card .blank {
    margin-top: 16px;
  }
  .greeting {
    width: 65%;
  }
  @-webkit-keyframes open {
    0% {
      width: 0%;
    }
    50% {
      width: 50%;
    }
    100% {
      width: 100%;
    }
  }
  @keyframes open {
    0% {
      width: 0%;
    }
    50% {
      width: 50%;
    }
    100% {
      width: 100%;
    }
  }
}

@media (max-width: 767.98px) {
  header {
    padding: 16px 16px;
  }
  .welcome .block {
    padding: 0 16px;
  }
  .trips {
    padding: 72px 16px 72px;
  }
  .about {
    padding: 0px 16px 72px;
  }
  footer {
    padding: 48px 16px;
  }
  .greeting {
    width: 100%;
  }
  footer .footer-top .social {
    margin-left: 16px;
  }
  footer .footer-bottom .footer-menu ul li {
    margin-right: 0px;
  }
  footer .footer-bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: normal;
    -webkit-align-items: normal;
        -ms-flex-align: normal;
            align-items: normal;
  }
  footer .footer-bottom .footer-menu ul {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  footer .footer-bottom .copyright {
    font-size: 0.9rem;
    -webkit-align-self: center;
        -ms-flex-item-align: center;
                -ms-grid-row-align: center;
            align-self: center;
    margin-top: 16px;
  }
  footer {
    padding: 24px 16px 8px;
  }
}

@media (max-width: 575.98px) {
  html {
    font-size: 14px;
  }
  .about .container-about .about-card .blank {
    margin-top: 8px;
  }
  .trips .container-trips .trip {
    width: 100%;
  }
  .trips .container-trips .trip:not(first-child) {
    margin-bottom: 8px;
  }
  .logo img {
    height: 16px;
  }
  footer .footer-top .social li {
    margin-left: 16px;
  }
  footer .footer-bottom .footer-menu ul li {
    padding: 2px;
  }
  footer .footer-top .social li a i {
    font-size: 22px;
  }
  .about .container-about .about-preview p {
    padding: 8px;
  }
}

<?php
/**
 * The header for our theme
 *
 * This is the template that displays all of the <head> section and everything up until <div id="content">
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package YegresTheme
 */

?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="https://gmpg.org/xfn/11">

    <?php wp_head(); ?>
</head>

<body <?php body_class(); ?>>
<?php wp_body_open(); ?>
<div id="page" class="site">

<header id="masthead" class="header-main site-header <?php if (!is_front_page()) echo 'header-position'?>" > 
        <div class="logo"><a href="/"><img src="<?php echo get_template_directory_uri();?> /assets/img//logo-black.svg" alt="Логотип"></a></div>
        <div class="main-menu">
            
            <?php
            wp_nav_menu( [
                'theme_location'  => 'top-menu',
                'container'       => 'nav',
                'container_class' => 'destkop-menu',
                'menu_class'      => '',
                
            ] );
            ?>
            
            <a href="#" class="hamburger hamburger--slider">
                <span class="hamburger-box">
                    <span class="hamburger-inner"></span>
                </span>
                </button></a>
        </div>
    </header>

    <?php
            wp_nav_menu( [
                'theme_location'  => 'main-menu',
                'container'       => 'div',
                'container_class' => 'mobile-menu',
                'menu_class'      => 'm-menu',
                
            ] );
            ?>