Hi my site is displaying very badly on mobile devices when I checked it on MobileTest.me
The header takes up the whole screen.

On Desktops it's mostly OK except,
On some magnifications the tabs menu on the right side of the header logo picture extends down below the width of the logo banner.
Since they have the same background color this menu should never be taller than the logo header Image.

my site is HairOlicious.com

Thanks,
David

Below is the custom code I have that the developers provided:
I think the issue is my header width for laptops is too wide for the cell phones but I'm not sure.

/*Changes page title color*/
div.before_blog_1 .entry a {
text-decoration: underline;
color: #009933;
}

/*Sets underline style and color to links*/
.single-post .entry a {
text-decoration: underline;
color: #cc00cc;
}

/*Changes the color and font-size of headings*/
h1, .single-post .entry h1 {
color: #009933;
font-size: 55px !important;
}
.single-post .entry h2 {
color: #009933;
font-size: 40px; font-weight;800; !important;
}
.single-post .entry h3 {
color: #009933;
font-size: 35px !important;
}
.single-post .entry h4 {
color: #8920a0;
font-size: 24px !important;
}
.single-post .entry h5 {
color: #8920a0;
font-size: 20px !important;
}
/*get rid of italics*/
p, .single-post .entry p {
font-size: 24px;
font-style: regular !important;
}

/*body font size see www.wpbeginner.com/plugins/how-to-hide-p...press-single-pages*/
body { font-size: 25px !important; }

#top-nav-list.top-nav-list { font-size: 0px !important; }

/* Changes title text to SOME STRANGE 14 COLOR*/
.bwg_slideshow_title_text { color:#f92109; }

/* Changes description font-size to PRETTY BIG DOESN\\\\\\\'T WORK */
.bwg_slideshow_description_text { font-size: 40px; }

/* Changes button text to green */
.business_elite.btn_trans { color: #8FFF96; }

/* Font size for menu Changes font size of top nav */
#top-nav > div > ul > li > a, #top-nav > div > ul > li > a:link, #top-nav > div > ul > li > a:visited, #top-nav > div > div > ul > li > a, #top-nav > div > div > ul > li > a:link, #top-nav > div > div > ul > li > a:visited { font-size: 20px !important; }

/* Header scroll*/
header.sticky_header {
position: fixed;
height: 15 px;
z-index: 10;
top: 0;
}

.before_blog_1 { margin-top: 200px; }

.custom-header-a img {
width: 100% !important;
margin: 0 auto;
display: block;
}

@media only screen and (max-width : 767px){
header.sticky_header { height: 30px; }
header.sticky_header>div { margin-top: 5px; }
.before_blog_1 { margin-top: 60px; }
}

#top-nav > div ul, #top-nav > div > div ul {
background-color: rgba(153,255,102, 0.1);
}

#top-nav {
box-sizing: border-box;
position: relative;
z-index: 15;
text-align: right;
}

#menu-button-block {
background-color: #32ce04;
}

/* css line 2985 to 3004 chg button block for cell phones to below code */
#menu-button-block {
background-position: right center;
background-repeat: no-repeat;
background-position-x: 96%;
margin-bottom: 10px;
position: relative;
top: 0px;
height: 0px;
width: 20%;
}

#menu-button-block a, #menu-button-block a:link,
#menu-button-block a:visited, #menu-button-block a:active,
#menu-button-block a:focus, #menu-button-block a:active {
padding: 6px 0px 0px 16px;
color: #fb1818;
text-align: left;
font-size: 15px;
display: block;
height: 15px;
}

/* css line 2985 to 3004 chg button block for cell phones to above code */
body {
font-family: Open Sans, sans-serif;
font-weight: normal;
letter-spacing: 0.00em;
text-transform: none;
font-variant: normal;
font-style: normal;
}

Hi David,

Thanks for using our themes.

We are kindly asking you to share the link to your website and tell us what exactly do you want to change?

Thanks and have a wonderful day!

Hi my site is hairolicious.com/
It displays fine on a laptop but on a cell the header logo is way too small and the menu items are below the header not to the right of the header as they should be.

Hi David,

Thanks for using our Themes

Please note that the theme has been developed in this way. In small screens, the logo and menu should appear in the center of the screen.

This way it looks beautiful and user-friendly.

Thanks and have a good day!