/* Highlight carousel */
.h-row { margin-left: -6px; margin-right: -6px; }
.h-col-md-3, .h-col-md-9 { padding-left: 6px; padding-right: 6px; position: relative; }

.carousel-highlight .block-image {
    display: none;
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat;
    height: 60%;
    position: absolute;
    bottom: 6px;
    left: 6px;
    right: 6px;
}

.carousel-highlight .block-content.loading .actions { height: 24px; min-height: 0; margin: 0 auto; width: 100px; }

.carousel-highlight .block-content.loading .product-name a,
.carousel-highlight .block-content.loading .price,
.carousel-highlight .block-content.loading .actions { background-color: #EEEEEE; color: transparent; max-width: 100%; }

.h-col-md-3, .h-col-md-9 { box-sizing: border-box; }
.carousel-highlight .block-highlight:first-child .page-link { display: none; }

.carousel-highlight .slick-track { display: flex; }
.carousel-highlight .slick-slider .slick-slide { padding: 0; }

/* Carousel loading spinner */
.carousel-highlight .loading { align-self: center; }
.carousel-highlight .loading .spinner { display: none; margin: 16px 0; text-align: center; line-height: normal; }
.carousel-highlight .slick-initialized .loading .spinner { display: block; }

.carousel-highlight .loading .spinner > div {
    width: 16px;
    height: 16px;
    margin: 0 8px;
    background-color: #BEBEBE;
    border-radius: 100%;
    display: inline-block;
    animation: sk-bouncedelay 0.7s infinite ease-in-out both;
}

.carousel-highlight .loading .spinner .part1 { animation-delay: -0.16s; }
.carousel-highlight .loading .spinner .part2 { animation-delay: -0.08s; }

@-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% { -webkit-transform: scale(0) }
    40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
    0%, 80%, 100% { transform: scale(0); }
    40% { transform: scale(1.0); }
}

@media (min-width: 640px) {
    .h-col-md-3, .h-col-md-9 { float: left; }
    .h-col-md-3 { width: 25%; }
    .h-col-md-9 { width: 75%; }

    .carousel-highlight { display: flex; align-items: stretch; }

    .carousel-highlight .block-highlight:first-child .block-title {
        font-size: 20px;
        line-height: normal;
        margin: 20px 0 20px;
    }

    .carousel-highlight .block-highlight:first-child .block-title,
    .carousel-highlight .block-highlight:first-child .page-link {
        padding-left: 20px;
        padding-right: 20px;
    }

    .carousel-highlight.multirow .block-highlight:first-child .block-title { margin-top: 80px; position: relative; z-index: 1; }
    .carousel-highlight .block-highlight:first-child .page-link { display: block; position: relative; z-index: 1; }
    .carousel-highlight .block-highlight:first-child .block-image { display: block; }

    .carousel-highlight [data-slick] .slick-prev { left: 6px; }
    .carousel-highlight [data-slick] .slick-next { right: 6px; }
}

@media (max-width: 639px) {
    .carousel-highlight .slick-list { margin: 0; }
    .carousel-highlight [data-slick] .slick-prev { left: auto; right: 38px; top: -15px;}
    .carousel-highlight [data-slick] .slick-next { right: 6px; top: -15px; }
}