Website header looks strang on google mobile test

Hello, when I run my website through google's mobile friendly test the header looks weird, some times the logo even shows up twice sometimes I run the test.

Here is the css I am using for mobile header

.main-navigation {
border-bottom: 2px #ba1f1f solid;
}

.post-template-default .widget_search {
margin-top: 57px;
}

@media (max-width: 768px) {
#mobile-header {
background-color: #ffffff;
}
.main-navigation .main-nav ul li a {
background-color: #ad0500;
}
button.menu-toggle {
color: #ad0500;
}
}

Any tips for me? If not no worries, but I figured it was worth asking