Hi Nikko, if it would just be simpler to do custom icons there instead of the social icon system that is fine too. Whatever is easier.

Thank you Nikko, I altered the code as instructed but I am not seeing any change. I’m still seeing the icons in two places. Here is my final code:

@media only screen and (max-width:767px) {

.responsive #top #header .social_bookmarks {
display: block!important;
}

.responsive #top #wrap_all #header .social_bookmarks,
.responsive #top #wrap_all #header .social_bookmarks li,
.responsive #top #wrap_all #header .social_bookmarks li a {
height: 30px;
}

.responsive #top #wrap_all .main_menu .avia-menu .av-burger-menu-main,
.responsive #top #wrap_all .main_menu .avia-menu .av-burger-menu-main a {
height: 80px !important;
line-height: 80px !important;
}

.responsive #top .logo {
width: 100%;
padding-top: 20px;
}

.responsive .logo img {
margin: 0 auto;
}

.responsive #top #wrap_all .main_menu {
position: static;
display: flex;
}

.responsive #top #wrap_all .main_menu .avia-menu {
width: 50%;
order: 2;
}

.responsive #top #wrap_all .main_menu .avia-menu .av-burger-menu-main {
float: right;
}

.responsive #top #wrap_all .main_menu .social_bookmarks {
width: 50%;
order: 1;
}

.responsive #top #wrap_all .main_menu .social_bookmarks {
width: 50%;
order: 1;
text-align: left;
}

.responsive #top #wrap_all .inner-container > .social_bookmarks {
display: none !important;
}
}

Thank you all for your help. Guenni007 that was perfect. I just noticed your edit after I solved it but I think we are both on the same track. I did this to fix it:

.avia_desktop #top .av-section-mobile-video-disabled
{
height: calc(100vh – 88px) !important;
}

Thank you again so much for your help!

I also have all plugins disabled and am running the lastest version of wordpress.