Hey,

Try adding this css code:

@media only screen and (max-width:767px) {
  .responsive #top .logo {
    float: left;
  }
}

Let us know if this fixes it.

Best regards,
Nikko

Hi Alan,`

Instead of body, try to use #top instead. Also you can group up css selectors that uses same properties for example this:

#avia-menu {
font-family: ‘akkuratregular’;
}

#mobile-advanced {
font-family: ‘akkuratregular’;
}

can be changed to:

#avia-menu,
#mobile-advanced {
font-family: ‘akkuratregular’;
}

:)

Regards,
Nikko

Hi,

Oh sorry for that you can use this code instead:

#top td .tribe_events {
    background: #333 !important;
    border-bottom: 1px solid white !important;
}

Best regards,
Nikko

Hi,

Try change the code I gave you from:

#top td .tribe_events {
    background: #333 !important;
}

to:

#top td .tribe_events {
    background: #333 !important;
    border-bottom: 0 !important;
}

Let us know if this helps :)

Best regards,
Nikko

Hi,

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

@media only screen and (max-width:767px) {
  #top #wrap_all .grid-sort-container .flex_column.isotope-item {
    width: 100% !important;
    position: static !important;
    margin-bottom: 20px !important;
  }
}

Hope this helps :)

Best regards,
Nikko

Hi,

Just add this custom CSS code:

#top .main_color .price {
 display: none !important;
}

Best regards,
John Torvik

Hi Aleks,

Will be closing this duplicate thread. :) We will be answering in your other thread: https://kriesi.at/support/topic/masonry-gallery-images-lightbox/

Best regards,
Nikko

Hi,

Try to add this css code in Quick CSS (located in Enfold > General Styling):

#top .av_tab_section a {
    text-decoration: underline;
}

Hope this helps :)

Best regards,
Nikko

Hi,

Can you try to disable Autoptimize, clear the cache and try to check it again. If it’s not fixed, can you try disabling all plugins to see if there’s no plugin conflict.

Best regards,
Nikko

Hi,

I`ll provide some custom CSS code to change the column grid to 2X3 only in the iPad and only on this page.

@media screen and (min-width: 766px) and (max-width: 769px) {
   .page-id-19 .avia-builder-el-20 .first {
    clear: initial !important;
 }

.page-id-19 .avia-builder-el-20 .av_one_third {
  margin-top: 0 !important;
  margin-bottom: 30px;
  width: 50% !important;
 }

.page-id-19 .avia-builder-el-20 .column-top-margin {
  margin-top: 0 !important;
 }
}

let me know if it worked :)

Best regards,
John Torvik

Hi,

You’re welcome :) try changing this code I gave:

#top .clear_none {
  clear: none !important;
  margin-left: 6%;
}

to:

#top .clear_none {
  clear: none !important;
  margin-left: 6%;
  margin-top: 0 !important;
}

If the gap is too small change the margin-top value from 0 to 10px or try to experiment with the values. Hope this helps :)

Best regards,
Nikko

Hi,

Try to make the min-height and max-height from Victoria’s code the same value, then add this below:

/* For ipad/tablet in portrait mode */
@media only screen and (max-width:960px) and (min-width:768px) {
  #top .avia-slider-testimonials.avia-testimonial-wrapper {
    min-height: 400px !important;
    max-height: 400px !important;
  }
}

/* For mobile devices */
@media only screen and (max-width:767px) {
  #top .avia-slider-testimonials.avia-testimonial-wrapper {
    min-height: 600px !important;
    max-height: 600px !important;
  }
}

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

Best regards,
Nikko

Hey DROR,

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

@media only screen and (max-width:767px) {
  .responsive #top #info .flex_column_table {
    margin-top: 0 !important;
  }
}

Hope this helps :)

Best regards,
Nikko

Hey JennyGr,

Try to enable Custom Css Classes: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ then add a class name to the 1/2 colum, for example clear_none, then on Quick CSS (located in Enfold > General Styling) add this css code:

#top .clear_none {
  clear: none !important;
  margin-left: 6%;
}

@media only screen and (max-width:960px) {
  #top .clear_none {
    margin-left: 0 !important;
  }
}

Hope this helps :)

Best regards,
Nikko

Hi,

You need to put the codes in different files/locations, the css code should be added in Quick CSS (located in Enfold > Styling) or your custom css file like style.css of your child theme:

.main_menu ul:first-child > li > a { 
    font-size: 25px; 
}

#top .social_bookmarks li a { 
    font-size: 25px; 
}

strong.avia-testimonial-name {
   font-size: 20px !important;
}

These codes should go to functions.php:

// Register new icon as a theme icon
function avia_add_custom_icon($icons) {
	$icons['icon_name']	 = array( 'font' =>'fontello', 'icon' => 'ue800');
	return $icons;
}
add_filter('avf_default_icons','avia_add_custom_icon', 10, 1);

// Add new icon as an option for social icons
function avia_add_custom_social_icon($icons) {
	$icons['Icon Label'] = 'icon_name';
	return $icons;
}
add_filter('avf_social_icons_options','avia_add_custom_social_icon', 10, 1);

Best regards,
Nikko

Hey Terry,

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

#top td .tribe_events {
    background: #333 !important;
}

Hope this helps :)

Best regards,
Nikko

Hey!

You have to add a background color to the CSS selector.

#top #wrap_all .av-social-link-snap_chat:hover a{
    color:#fff; 
    ba

ckground-color: #FFFF00;
}

Also just to know it is making our work really hard, to have login and disable maintenance before manage to help you.
Please if you need further help, disable the maintenance so we can be able to help faster.

Regards,
Basilis

• This reply was modified 8 years, 12 months ago by Basilis.