Tiny Font in Tables

Hi mooshonov,

Make sure to properly indent your css code, this way it’s easier to read and debug if there are issues.
then you can group the code if it has similar properties, for example this code:

.avia_pricing_minimal td {
    font-size: 20px;
}

.avia_pricing_minimal th {
    font-size: 20px;
}

can be written as:

.avia_pricing_minimal td,
.avia_pricing_minimal th {
    font-size: 20px;
}

then you can merge the media queries for example there are multiple:

@media only screen and (max-width: 479px) {
    //some css code here
}

you can have just one of that and just insert the content.

It would also be good to have your media queries at the bottom.

Best regards,
Nikko

Hi mooshonov,

Try using this, let us know if this helps.

.avia-button,
.single_add_to_cart_button,
.woocommerce-page .button {
    font-size: 18px !important;
}

#sub_menu1 {
    z-index: 301;
}

.avia_pricing_minimal td,
.avia_pricing_minimal th {
    font-size: 20px;
}
  
#scroll-top-link {
    right: auto !important;
    left: 50px!important;
}

#top div .product_on_sale .inner_product_header {
    padding-left: 47px !important;
    padding-right: 15px !important;
}
  
#top #main .single-product-main-image .onsale {
    right: auto;
}
  
.av_header_transparency #header_main .main_menu ul:first-child > li > a {
    color: #fff;
}
  
.page-id-8105 .entry-content-wrapper select option {
    background-color: black;
}

span.minitext {
    display: none !important;
}
    
#top .price span {
    font-size:26px !important;
}

.woocommerce td {
    font-size: 16px;
}

h2.woocommerce-loop-product__title {
    font-size:22px !important;
}
  
@media only screen and (max-width: 767px) {
    .responsive #top .logo{
        width: 100% !important;
    }
  
    .responsive #top .logo a {
        float: left;
        padding-right: 100px;
        padding-top: 0;
    }
}
  
@media only screen and (min-width: 480px) and (max-width: 990px) {
    #top .no_margin.av_two_fifth {
        padding: 20px 30px !important; 
    }
}

@media only screen and (max-width: 479px) {
    #top .no_margin.av_two_fifth,
    #top .no_margin.av_three_fifth {
        width: 100%;
    }

    #top .no_margin.av_two_fifth {
        padding: 30px !important;
    }

    .flex_cell {
        display: block;
    }
}

Best regards,
Nikko

Hi mooshonov,

I’ve just refactored and shortened the css code you have.
So far I don’t see any useless css codes, but some duplicates and some also that needs to be grouped.

Best regards,
Nikko

Hi mooshonov,

No problem, glad that we could help :)
Feel free to create a new thread, if you need further assistance.
Thanks for using Enfold and have a great day!

Best regards,
Nikko