Hey webcami,

Try adding this code in Quick CSS (located in Enfold Child > General Styling):

#top .header_bg {
    background: transparent !important;
}

Let us know if this helps :)

Best regards,
Nikko

Hey DaveA,

Try adding this in Quick CSS (located in Enfold > General Styling):

@media only screen and (max-width:767px) {
  .home #av_section_1 .flex_column_table {
    margin-top: -110px !important;
  }
}

Just adjust the value as you see fit. Hope this helps :)

Best regards,
Nikko

Hi,

Sure. The ipad versions seems good, I have modified your css only for mobile version. I have added css classes to the paragraph/text in the layerslider and have added this code inside @media max-width:767px in Quick CSS:

#top.page-id-705 .avia-layerslider .ls-slide p {
height: auto !important;
line-height: 1.2 !important;
padding: 0 20px !important;
position: static;
width: 100% !important;
text-align: center;
-webkit-box-sizing: border-box !important;
box-sizing: border-box !important;
}

#top.page-id-705 .avia-layerslider .ls-slide p.ls-main-heading {
font-size: 28px !important;
padding: 30px 20px 0 !important;
}

#top.page-id-705 .avia-layerslider .ls-slide p.ls-subheading {
font-size: 18px !important;
padding: 10px 20px 0 !important;
}

#top.page-id-705 #wrap_all .ls-wp-fullwidth-container .ls-slide {
display: flex !important;
flex-direction: column;
align-items: center;
}

#top.page-id-705 .ls-wp-fullwidth-container {
    height: 74px !important;
}

Let us know if it’s good :)

Best regards,
Nikko

Hi,

I checked the screenshot you gave, I think the spaces on left and right is just right, though I’m not really sure if that’s what you wanted to point out, but if it is, try adding this code in Quick CSS:

.js_active .top_tab .tab {
    padding-left: 24px;
    padding-right: 24px;
}

Just adjust the values as you see fit. Hope this helps :)

Best regards,
Nikko

Hi,

I checked it on chrome and it seems to be working fine, can you tell us what browser you are using and OS (example windows 10 or mac Sierra), and provide a screenshot on how it looks on your desktop/laptop, just upload it in http://imgur.com/ or dropbox and post the link here.

Best regards,
Nikko

Hi,

I have modified the code in Form Test 2 page to this one:

<form  name="webshopform" method="post" action="http://URL/login.php" class="custom-login-form av-form-labels-hidden avia-builder-el-7  el_after_av_heading  avia-builder-el-last">
<fieldset>
<p class=" first_form  form_element form_element_third" id="gebruikersnaam"><input name="gebruikersnaam" class="text_input is_empty" type="text" id="gebruikersnaam" value="" placeholder="Gebruikersnaam*"></p>
<p class=" form_element form_element_third av-last-visible-form-element" id="wachtwoord"> <input name="wachtwoord" class="text_input is_empty" type="password" id="wachtwoord" value="" placeholder="Wachtwoord*"></p>
<p class="form_element form_element_third modified_width"><input type="submit" value="Login" class="button" data-sending-label="Login"></p>
</fieldset>
</form>

And added this css code in Quick CSS (located in Enfold > General Styling):

.custom-login-form .form_element_third {
    width: 32.6%;
    float: left;
    margin-left: 1%;
    clear: none;
}

.custom-login-form .first_form {
    clear: both;
    margin-left: 0;
}

.custom-login-form.av-form-labels-hidden p {
    margin-top: 8px;
    margin-bottom: 8px;
}

#top .custom-login-form .text_input, 
#top .custom-login-form .select, 
#top .custom-login-form .text_area {
    width: 100%;
    margin-bottom: 0;
    display: inline;
    min-width: 50px;
    padding: 13px;
    border-radius: 2px;
}

.custom-login-form .button {
    margin: 0;
    border-radius: 2px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-weight: normal;
    font-size: 0.92em;
    min-width: 142px;
    outline: none;
}

.custom-login-form p input, 
.custom-login-form p textarea, 
.custom-login-form p select, 
.custom-login-form p .input_checkbox_label {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

@media only screen and (max-width:479px) {
  .responsive .custom-login-form .form_element {
    width: 100%;
    clear: both;
    margin-right: 0;
    margin-left: 0;
    float: none;
  }
}

It should get the right design and works properly. Let us know if it’s also good on your end :)

Best regards,
Nikko

Hey ronensin,

please use different tickets for different questions.

1.) Use this code inside Quick CSS field:

#top #wrap_all .av-social-link-facebook {
background: #37589b;
}
li.social_bookmarks_gplus.av-social-link-gplus.social_icon_2 {
background: #de5a49;
}
li.social_bookmarks_youtube.av-social-link-youtube.social_icon_3 {
background: #a72b1d;
}
li.social_bookmarks_twitter.av-social-link-twitter.social_icon_4{
background: #46d4fe;
}

Best regards,
Andy