apothema

carousel-fix.css

/**
 * Carousel missing left border
 * Owl carousel removes the container element's left border to avoid having double borders on the left.
 */

/* Force parent element to show left border */
.owl-carousel {
  border-left: 1px solid #e3e3e3 !important;
}

.owl-item.active {
  border-left-color: white;
}

.owl-carousel:active .owl-item,
.owl-item.active+.owl-item {
  border-left-color: #e3e3e3;
}

menu-fix.js

/**
 * We create a timeout for menu-trigger in order to delay triggering the menu opening.
 * If the user leaves the trigger button or hovers again we cancel the timeout to avoid
 * the menu opening unexpectedly.
 *  
 * To try the solution in browser console we need to run the following command first:
 * `$('#open-mega-menu').unbind('mouseenter mouseleave');`
 * 
 * To use the solution we remove the `$('#open-mega-menu').hover(...);` command with the new code.
 * 
 */

var megaMenuTriggerTimeout = null;

function openMegaMenuWithDelay() {
  clearTimeout(megaMenuTriggerTimeout);
  megaMenuTriggerTimeout = setTimeout(openMegaMenu, 800);
}

function cancelMegaMenuOpen() {
  clearTimeout(megaMenuTriggerTimeout);
}

function openMegaMenu() {
  if ($('.js_mega_menu').hasClass('js_is_mobile')) {
    return false;
  }

  $('.js_mega_menu').css('top', '-41px');
  $('.js_mega_menu').removeClass('hide');
  $('.js_sub_item').removeClass('active');
  resizeMegaMenu();
}

$('#open-mega-menu').hover(openMegaMenuWithDelay);
$('#open-mega-menu').on('mouseleave', cancelMegaMenuOpen);

product-rating.html

<!--
 | Product rating - unexpected 1px space on the right
 | Simply adding pull-right to the col-md element fixes the problem because it forces the element to stick right.
-->

<div class="row">
    <div class="col-md-12">
        <div class="brand__box container-fluid">
            <div class="row">
                <div class="col-md-3 text-center Aligner">
                    <div class="Aligner-item">
                        product image
                    </div>
                </div>
                <div class="col-md-7">
                    product description
                </div>
                <div class="col-md-2 reviews__rating filter-blue Aligner">
                    <div class="text-center Aligner-item">
                        <div class="reviews__rating__total">4,6</div>
                        <div class="star-ratings-sprite"><span style="width:52%" class="star-ratings-sprite-rating"></span></div>
                        <p><a href="#">(250)</a></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>