WOOF - WooCommerce Products Filter

To make demo site more attractive and demonstrated different features the next code is applied:

1. In the plugin settings -> tab Advanced -> “Custom CSS code”

   .woof_price3_search_container{
       width: 100% !important;
       clear: both;
   }
   
   .woof_sid_auto_shortcode .woof_container_radio .woof_block_html_items,
   .woof_sid_auto_shortcode .woof_container_checkbox .woof_block_html_items,
   .woof_sid_auto_shortcode .woof_container_label .woof_block_html_items
   {
       min-height: 160px;
       max-height: 160px;
       overflow: auto;
       padding: 0 0 0 7px;
   }
   
   .woof_sid_auto_shortcode .woof_container_color .woof_block_html_items,
   .woof_sid_auto_shortcode .woof_container_image .woof_block_html_items,
   .woof_sid_auto_shortcode .woof_container_select .woof_block_html_items,
   .woof_sid_auto_shortcode .woof_container_slider .woof_block_html_items{
       min-height: 160px;
       max-height: 160px;
   }
   
   .woof_sid_auto_shortcode .woof_container_slider .woof_block_html_items{
       padding: 0 9px;
   }
   
   .woof_sid_auto_shortcode ul.woof_list.woof_list_label{
       margin-top: 9px !important;
   }
   
   .woof_sid_auto_shortcode .woof_checkbox_sales_container .woof_container_inner{
       padding-left: 20px;
   }
   
   .woof_sid_auto_shortcode .woof_author_search_container .woof_container_inner,
   .woof_sid_auto_shortcode .woof_by_rating_container .woof_container_inner{
       padding-top: 23px;
   }
   
   button.woof_submit_search_form,
   button.woof_reset_search_form{
       background: #6BBE92 !important;
       width: 100px;
       border: 0;
       padding: 10px 0;
       margin: 5px 0;
       text-align: center;
       color: #fff !important;
       font-weight: bold !important;
       transition: all .4s;
       font-size: 1.1em;
   }
   
   button.woof_submit_search_form:hover,
   button.woof_reset_search_form:hover{
       color: #fff !important;
       background: #6ddE92 !important;
   }
   
   .woof_container h4{
       margin-bottom: 11px !important;
       font-size: 1.32em !important;
       background: #f2f3f5;
       padding: 11px 7px;
       color: #333;
       line-height: 1.12em !important;
       text-align: center;
       border-radius: 3px;
   }
   
   .woof_color_term{
      border-radius: 80px !important;
   }
    
   .woof_color_term:hover{
       border-color: #444;
       border-style: double;
   }

2. Code for the rounded squares for color palette is taken here: https://products-filter.com/possible-color-selector-show-circular-shaped-colors-instead-square/
3. In the functions.php file of the current wp theme added the next PHP code:
   1. https://products-filter.com/hook/woof_get_more_less_button_xxxx/ – example for images
   2. https://products-filter.com/hook/woof_print_content_before_search_form/
4.  – here is images you can download and use