Hi,

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

/*----------------------------------------
// CSS - Placeholder text
//--------------------------------------*/


/* Place holder text color */
::-webkit-input-placeholder {
color: #bbb!important;
}
::-moz-placeholder {
color: #bbb!important;
}
::-moz-placeholder {
color: #bbb!important;
}
::-ms-input-placeholder {
color: #bbb!important;
}


/* Clear placeholder text on focus*/
[placeholder]:focus::-webkit-input-placeholder {
transition: opacity 0.15s 0.15s ease;
opacity: 0;
}

/* Input field style */ 
#top input[type="text"], 
#top input[type="input"], 
#top input[type="password"], 
#top input[type="email"] {
    padding: 14px 6px;
    font-family: "quicksand",sans-serif;    
    background: #fff;
    border-radius: 0px;
}

Best regards,
Vinay

Hi,

I have adjusted the padding the rest of the logo looks good on my end. Please review the site and let us know.

Best regards,
Vinay

Hi,

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

CSS Snippet:

/* CSS - Shrinking logo */

.responsive #top .header-scrolled .logo {
    padding-top:5px!important;
}

.responsive #top .header-scrolled .logo img {
    max-height: 35px!important;
}

Best regards,
Vinay

Hi,

You can use a color section element and add it to the background image.

If you like to add this to the background of every page at once please check the Initial setup section

Best regards,
Vinay

Hi,

Thank you for sharing the credentials, I check your site but could not find any issue with the way the logo works.

Please clarify what exactly are you trying to achieve? and how we can reproduce the issue you are facing?

If you like the logo to appear in the same size as uploaded (selected size in media library) they try replacing the previous code with the below one.

/* Logo */

.responsive #top #header #header_main .inner-container .logo {
    display: flex;
    flex-basis: auto;
    /*width: auto;*/

    /* Define scalable min width of the logo on small screens */
    min-width: 100px;
    /* Define scalable max width of the logo on big screens */
    /* Logo width: (auto | 100% | px );  Set auto to display the uploaded image size */
    max-width: 180px;
    
    z-index: 9;
}


/* Logo image size */

.responsive #top #header .logo,
.responsive #top #header .logo a,
.responsive #top #header .logo img {
    width: auto;
        
    /* Height specification is not required. It is proportional to the max width of the logo */
    height: auto;    
    align-items: center;
    align-self: center;
    justify-content: center;
}

Best regards,
Vinay

Hey acscreativenew,

I checked your site but I do not see any API key in Enfold theme options > Google Services.

Please add a working API key and let us know if you still have any issue so we can take a closer look at this issue.

Best regards,
Vinay

Hi,

Please follow the steps correctly and it should work for you. In case you have any issue with it please feel free to get back to us. We will keep this ticket open until then.

Best regards,
Vinay

Hi,

Please remove the old code and try the updated code in our documentation. That should take care of the logo issue :)

Best regards,
Vinay

Hey saquasar,

Thank you for writing to us. I have added the below code to your Quick CSS

@media only screen and (min-width:768px) {
.html_bottom_nav_header .cart_dropdown {    
    position: absolute !important;
    right: auto !important;
    top: 68px !important;
    left: 50% !important;
    transform: translateX(235px);
}}

Please review the site and let us know if you have any issue.

Best regards,
Vinay

Hi,

I assure you it is not an issue with the theme. If the map elements work fine for others with a correct API key it should work for you as well. Let me take a closer look at this issue please post your login details in private message.

Best regards,
Vinay

Hi,

Glad we could help!

Please take a moment to review our theme and show your support https://themeforest.net/downloads
Don’t forget to bookmark Enfold Documentation for future reference.

Thank you for using Enfold :)

Best regards,
Vinay

Hi,

You can add the custom text now. Please check the second block of code in “Hamburger hover color” section. Adjust the min and max width value for “.av-hamburger-box” accordingly.

/*------------------------*/
/* Add text to the left side
   of the burger icon.
/*------------------------*/


.av-hamburger {
    min-width: 80px;
}

.av-hamburger .av-hamburger-box strong {
    display: block!important;
    position: absolute;
    left: calc( -100% - 10px);
    top: 50%;
    transform: translateY(-50%);
}

.av-hamburger .av-hamburger-box {    
    float: right;   
    max-width: 50px;
}


/*------------------------*/
/* Hamburger hover color
/*------------------------*/

.av-hamburger .av-hamburger-box strong {
    color: #000;
    visibility: hidden;
}

/* Add your custom menu text */
#top .av-hamburger .av-hamburger-box strong:before {
    content: 'menu';
    visibility: visible;
    line-height: 14px;
}

.av-burger-menu-main a:hover .av-hamburger .av-hamburger-box strong {
    animation: textcolor .35s forwards;
}

/* Burger menu hover color possible only for desktop*/

.av-burger-menu-main a .av-hamburger-inner,
.av-burger-menu-main a .av-hamburger-inner:before,
.av-burger-menu-main a .av-hamburger-inner:after {    
    background-color: #000;
}

.av-burger-menu-main a:hover .av-hamburger-inner,
.av-burger-menu-main a:hover .av-hamburger-inner:before,
.av-burger-menu-main a:hover .av-hamburger-inner:after {    
    animation: bgcolor .35s forwards;
}


@keyframes bgcolor {
  0% { background: #000; }
  100% { background: red; }
}

@keyframes textcolor {
  0% { color: #000 }
  100% { color: red; }
}

Best regards,
Vinay

Hi,

Glad we could help!

Please take a moment to review our theme and show your support https://themeforest.net/downloads
Don’t forget to bookmark Enfold Documentation for future reference.

Thank you for using Enfold :)

Best regards,
Vinay

Hi,

I think you are talking about the content width please check our documentation for more info.

Best regards,
Vinay

Hi,

Please replace the previous code with the below snippet.

CSS Snippet:

/*------------------------*/
/* Add text to the left side
   of the burger icon.
/*------------------------*/


.av-hamburger {
    min-width: 80px;
}

.av-hamburger .av-hamburger-box strong {
    display: block!important;
    position: absolute;
    left: calc( -100% - 10px);
    top: 50%;
    transform: translateY(-50%);
}

.av-hamburger .av-hamburger-box {    
    float: right;   
    max-width: 50px;
}


/*------------------------*/
/* Hamburger hover color
/*------------------------*/

.av-hamburger .av-hamburger-box strong {
    color: #000;
}

.av-burger-menu-main a:hover .av-hamburger .av-hamburger-box strong {
    animation: textcolor .35s forwards;
}

/* Burger menu hover color possible only for desktop*/

.av-burger-menu-main a .av-hamburger-inner,
.av-burger-menu-main a .av-hamburger-inner:before,
.av-burger-menu-main a .av-hamburger-inner:after {    
    background-color: #000;
}

.av-burger-menu-main a:hover .av-hamburger-inner,
.av-burger-menu-main a:hover .av-hamburger-inner:before,
.av-burger-menu-main a:hover .av-hamburger-inner:after {    
    animation: bgcolor .35s forwards;
}


@keyframes bgcolor {
  0% { background: #000; }
  100% { background: red; }
}

@keyframes textcolor {
  0% { color: #000 }
  100% { color: red; }
}

Best regards,
Vinay