Hello,

Please add this code into your custom css box:

@media (max-width: 480px) {
#logo img { width: 100%;}
.mobile_small_menu { margin-left: -41px;}
}

Result screenshot. Let us know.

Best regards!

Hello,

Sorry for the late reply.
1-The line below the slider is actually a border. I see this is an added element. If you did not add the custom code then perhaps some plugins you have installed may have added it. Anyway, to remove it please add this code into your custom css box:

@media (max-width: 480px){
.header_wrapper.background--dark {
    border-bottom: none !important;
}}

I don’t see the white border in the side you are mentioning.

2- To remove logo from mobile menu overlapping, please add this code:

@media (max-width: 480px){
#logo {
    left: 65px !important;
}}

Let us know if you need further help.

Have a nice day!

Hello,

I checked your site in mobile and the menu does work as it’s supposed to do. Please see the screenshot.
What do you need to change?

Let us know.

Best regards!

Hello,

1-By default there is no button to automatically open in new tab. But you can use the “button” element of Visual Composer. It is programmed to open in new tab.

There isn’t a specific code snippet to make all available buttons open in new tabs. You have to find the responsible file and add the “target=_blank” into it.

2-You can change this using custom css. Add this code into your custom css box:

@media (max-width: 979px){
.mobile_small_menu { padding-right: 20px !important;}
#logo {
    left: 0 !important;
    right: 0 !important;
}}

Edit the values until you get what are you looking for.
Let us know if you have further questions.

Best regards!

If I read the above posts correctly, you did the below to make the header and menu sticky on the mobile site?  I tried doing this but it’s still not sticky. What else can I do?
<p style=”box-sizing: border-box; margin: 0px 0px 22px; color: #4b4d4d; font-family: Raleway; font-size: 14px;”>9-I added this code into the <code style=”box-sizing: border-box; font-family: Inconsolata, Consolas, Monaco, ‘Lucida Console’, monospace; font-size: 15px; background: #f9f9f9; display: inline-block; padding: 0px 5px; line-height: 25px; border: 1px solid #dddddd; max-width: 95%; vertical-align: middle; margin-top: -3px;”>@media block:</p>

<pre style=”box-sizing: border-box; overflow: auto; font-family: Inconsolata, Consolas, Monaco, ‘Lucida Console’, monospace; font-size: 15px; background: #f9f9f9; padding: 5px 10px; line-height: 18px; border: 1px solid #dddddd; max-width: 95%; vertical-align: middle; margin-top: 0px; margin-bottom: 24px; color: #4b4d4d;”><code style=”box-sizing: border-box; font-family: Inconsolata, Consolas, Monaco, ‘Lucida Console’, monospace; background: transparent; display: block; padding: 0px; line-height: 25px; border: none; max-width: 100%; vertical-align: middle; margin: 0px; overflow-wrap: normal; overflow: auto;”>.header_wrapper {
position: fixed !important;
margin-top: -2px;
}
 

Hello,

1-The menu is centered if you measure it with the header width, not the position of the logo above. However, you can always edit it’s position to your wish. Add this code itno your custom css box:

.header_10 #navigation nav {
    left: 53% !important;
}

Result screenshot. Edit the value to your wish.

2-This is the mobile header. It is set up to fit the width of a mobile screen so it is different from the desktop version. To make the background transparent please add this code into your custom css box:

@media (max-width: 979px){
.header_wrapper {
    background: rgba(255, 255, 255, 0) !important;
}}

3-Again, this is due to the default layout of mobile menu. To change the color of mobile menu item on hover, please add this code:

.menu-small ul.menu > li > a:hover {
    color: #f5e841 !important;
}

Change the color to your wish.

4-Add this code:

@media (max-width: 979px){
.header_10 #logo { left: 41% !important;}
}

Let us know.

Best regards!