Hey webguy007,
First you would need to move the menu text down to make room for the image:
#top #header .av-main-nav > li > a {
margin-top: 36px !important;
}
Then you can add your image above the text:

li#menu-item-3173 {
background-image: url(https://png.icons8.com/color/96/cccccc/morty-smith.png);
background-size: contain;
background-repeat: no-repeat;
background-position: 50% -1%;
}

Try adjusting the image url and position to suit.

Best regards,
Mike

Hey Olga,
Thank you for the login, I checked your Map API and it returned “Could not connect to Google Maps with this API Key”
I then checked my API and it worked.
Please try creating a new API key with no restrictions and see if that works for you.
Did you enter your billing info at Google Maps?

Best regards,
Mike

Hey nextlevelbros,
I took a look at your site and I see this css rule hiding your list items:

            /*WOOCOMMERCE*/
            /*THANK YOU PAGE HIDE TITLE AND SHARES*/
            .xlwcty_thankyou-template-default.woocommerce-order-received .post-entry .entry-footer div.av-share-box, .entry-content-header {
                display: none!important;
            }

If you added this css, please remove the last part with the comma

, .entry-content-header

Best regards,
Mike

Hey drewfr,
I took a look at your page, and I assume you would like this to work across your site, I also assume that these will always be in a text block element. In this case please try this code in the General Styling > Quick CSS field:

.av_textblock_section li {
padding: 0px !important;
}

Please clear your browser cache and check.

Best regards,
Mike

Hi,
Glad to hear, thanks :)
Unless there is anything else we can assist with on this issue, shall we close this then?

Best regards,
Mike

Hi,
I logged into your test site above and took a look at your issue, I found that you had this code in your Enfold Theme Options > General Styling > Quick CSS field

<script type="text/javascript">
    (function() {
        var trial = document.createElement('script');
        trial.type = 'text/javascript';
        trial.async = true;
        trial.src = 'https://easy.myfonts.net/v2/js?sid=190012(font-family=Cutz)&key=dY5c5sjKYZ';
        var head = document.getElementsByTagName("head")[0];
        head.appendChild(trial);
    })();
</script>

which was causing the error, I moved the code to your Enfold Theme Options > Google Services > Google Analytics Tracking Code to test and it corrected the error.
I would recommend adding this script to the end of your functions.php instead though, but you will need to do so via FTP or your hosting panel “file manager” the location of the file is:

\wp-content\themes\enfold\functions.php

To add it to the end of your functions.php I wrote it as a function, please use this code:

function myfonts_script(){
  ?>
  <script type="text/javascript">
    (function() {
        var trial = document.createElement('script');
        trial.type = 'text/javascript';
        trial.async = true;
        trial.src = 'https://easy.myfonts.net/v2/js?sid=190012(font-family=Cutz)&key=dY5c5sjKYZ';
        var head = document.getElementsByTagName("head")[0];
        head.appendChild(trial);
    })();
   </script>
  <?php
  }
  add_action('wp_footer', 'myfonts_script');

Please follow these steps to correct the error on your live site.

Best regards,
Mike

Hi,
Thanks for sharing your solution, unless there is anything else we can help with on this issue, shall we close this then?

Best regards,
Mike

Hey Moondreamer21,
If I understand correctly you would like the same dashed like under the post page title, Please try this code in the General Styling > Quick CSS field:

#top #wrap_all h1.post-title.entry-title {
border-bottom: 2px dashed #CCBDB8!important;
padding-bottom: 10px;
width: 100%;
}

Best regards,
Mike

Hey horacioaryan1972,
The reason your editor is not loading is because you are getting a 403 error:

/wp-admin/admin-ajax.php - Failed to load resource: the server responded with a status of 403 (Forbidden)

Since this is happening only on one page it could be a false positive in your Wordfence firewall, or your hosting firewall. I recommend disabling your Wordfence to see if that helps, if not try asking your webhost if they can see from the server log why you are getting a 403 error.

Best regards,
Mike

Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.

For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)

Best regards,
Mike

Hi,
Glad to see that you were able to get it working, to correct the color and font size please try this css:

.header_color .main_menu ul:first-child > li.menu-item-824 > a {
color: #fff !important;
font-size: 16px !important;
}
.header_color .main_menu ul:first-child > li.menu-item-822 > a {
color: #fff !important;
font-size: 16px !important;
}

please adjust the size to suit.
To adjust the location of the menu item in the menu for different screen sizes please try the following css. Please remove the other css so this will work correctly.
ENG:

@media only screen and (max-width: 476px) {
.av-burger-overlay-active li#menu-item-822.menu-item-822 {
    margin-left: -230px !important; 
    display: block !important;
    color: #fff !important;
    animation: fadein 10s;
}
@keyframes fadein{
    0% { opacity:0; }
    66% { opacity:0; }
    100% { opacity:1; }
}
}
@media only screen and (min-width: 477px) and (max-width: 770px) {
.av-burger-overlay-active li#menu-item-822.menu-item-822 {
    margin-left: -200px !important; 
    display: block !important;
    color: #fff !important;
    animation: fadein 10s;
}
@keyframes fadein{
    0% { opacity:0; }
    66% { opacity:0; }
    100% { opacity:1; }
}
}
@media only screen and (min-width: 771px) {
.av-burger-overlay-active li#menu-item-822.menu-item-822 {
    margin-left: -180px !important; 
    display: block !important;
    color: #fff !important;
    animation: fadein 10s;
}
@keyframes fadein{
    0% { opacity:0; }
    66% { opacity:0; }
    100% { opacity:1; }
}
}

ITA:

@media only screen and (max-width: 476px) {
.av-burger-overlay-active li#menu-item-824.menu-item-824 {
    margin-left: -230px !important; 
    display: block !important;
    color: #fff !important;
    animation: fadein 10s;
}
@keyframes fadein{
    0% { opacity:0; }
    66% { opacity:0; }
    100% { opacity:1; }
}
}
@media only screen and (min-width: 477px) and (max-width: 770px) {
.av-burger-overlay-active li#menu-item-824.menu-item-824 {
    margin-left: -200px !important; 
    display: block !important;
    color: #fff !important;
    animation: fadein 10s;
}
@keyframes fadein{
    0% { opacity:0; }
    66% { opacity:0; }
    100% { opacity:1; }
}
}
@media only screen and (min-width: 771px) {
.av-burger-overlay-active li#menu-item-824.menu-item-824 {
    margin-left: -180px !important; 
    display: block !important;
    color: #fff !important;
    animation: fadein 10s;
}
@keyframes fadein{
    0% { opacity:0; }
    66% { opacity:0; }
    100% { opacity:1; }
}
}

Best regards,
Mike

Hey WP Turned,
I have taken a look at your page and found that the reason your slider button is not working below 768px is because you have it pointing to the ID “#why-we-are-different” and you have the ID twice on the same page. So it points to the first of the two, and below 768px the first one is hidden. To correct this try creating a second button, so each have a unique ID, and then hide the button & element based on screen size. Or you could try using some JS to change the ID the botton points to based on screen size.

As for how your background looks on your iPhone, are you saying that the error shows on both Chrome and Safari on your iPhone?
I only have a Android, and the error doesn’t occur on Chrome or Firefox on the Android, Please see the screenshot in Private Content area. This seems to be a known iOS issue, please see this article for a solution: [Solved] Full Page Backgrounds on iOS (background-size: cover)
Otherwise I will ask the team to look at your issue with a iPhone to assist.

Best regards,
Mike

• This reply was modified 6 years, 10 months ago by Mike. Reason: found a possible solution on CSS Tricks

Hey kjwaggz,
Please try this code in the General Styling > Quick CSS field:

@media only screen and (max-width: 767px) { 
.phone-info a, .phone-info {
color: #000 !important;
}
.html_av-overlay-side #top #wrap_all .av-burger-overlay-scroll #av-burger-menu-ul a {
color: #000 !important;
}
.html_av-overlay-side-classic #top .av-burger-overlay li li .avia-bullet, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::before, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::after {
background-color: #000 !important; 
}
}

Best regards,
Mike

Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.

For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)

Best regards,
Mike

Hi,
I have included the icon set in the Private Content area, please try uploading via the Enfold Theme Options > Import/Export > Iconfont Manager

Best regards,
Mike