@charset 'UTF-8';
.slick, .extension-slider {
    display: none;
}
.slick.slick-initialized, .extension-slider.slick-initialized {
    display: block;
}
.slick-list {
    padding-top: 1.5em;
}
.slick-paging-t .slick-arrow + .slick-list {
    padding-top: 4.5em;
}
.slick-paging-b .slick-arrow + .slick-list {
    padding-bottom: 4.5em;
}

.slick-vertical .slick-list {
    max-height: 100%;
    padding: 0!important;
}
.slick-vertical .slick-slide {
    border: none;
    cursor: pointer;
    margin-bottom: 7.5px;
}
.slick-vertical .slick-slide img {
    border-bottom: 3px solid transparent;
}

/* Arrows */
.slick-arrow {
    background-color: #ddd;
    border-radius: 0;
    color: #303030;
    cursor: pointer;
    display: inline-block;
    font-size: 2em;
    line-height: 1.25em;
    height: 1.25em;
    width: 1.25em;
    margin: 0;
    filter: alpha(opacity=100);
    opacity: 1;
    padding: 0;
    position: absolute;
    text-align: center;
    -webkit-transition: all 300ms;
    transition: all 300ms;
    z-index: 1;
}
.slick-paging-t .slick-arrow {
    top: 0.25em;
    left: 50%;
    right: 50%;
}
.slick-paging-b .slick-arrow {
    bottom: 0.25em;
    left: 50%;
    right: 50%;
}
.slick-paging-t .slick-prev, .slick-paging-tr .slick-prev, .slick-paging-b .slick-prev {
    margin-left: -1.3em;
}
.slick-paging-tr .slick-arrow {
    top: -2em;
    right: 0.5em;
}
.slick-paging-tr .slick-prev {
    margin-right: 1.3em;
}
.slick-paging-tl .slick-arrow {
    top: -2em;
    left: 0.5em;
}
.slick-paging-tl .slick-next {
    margin-left: 1.3em;
}

.slick-paging-s .slick-arrow {
    top: 0;
    bottom: 0;
    margin: auto 0;
}
.slick-paging-s .slick-prev {
    left: 15px;
}
.slick-paging-s .slick-next {
    right: 15px;
}

.products-slide .slick-paging-s .slick-arrow {
    top: 25%;
    bottom: auto;
    margin: 0;
    line-height: 3em;
    height: 3em;
}

.slick-vertical .slick-arrow {
    margin: 0;
    font-size: 1.5em;
    width: 100%;
    height: 1em;
    line-height: 1em;
}
.slick-vertical .slick-prev {
    top: 0;
}
.slick-vertical .slick-next {
    bottom: 0;
}

/* Dots */
.slick-dotted.slick-slider {
    margin-bottom: 4em;
}
.slick-dots {
    color: transparent;
    line-height: 1em;
    padding: 1em 0;
    text-align: center;
    position: absolute;
    bottom: -4em;
    left: 0;
    right: 0;
    margin: auto;
}
.slick-dots li {
    display: inline-block;
}
.slick-dots li button {
    border: none;
    display: block;
    width: 1em;
    height: 1em;
    margin: 0.5em;
    border-radius: 100%;
    background-color: #ddd;
    cursor: pointer;
    outline: none;
}
.slick-dots li button:hover, .slick-dots li button:focus, .slick-dots li.slick-active button {
    background-color: #666;
}

.slick-feature-slide {
    margin: 0!important;
    padding: 0;
}
.slick-feature-slide .slick-list {
    padding-top: 0;
}
.slick-feature-slide .slick-arrow {
    font-size: 1.5em;
    height: 1em;
    line-height: 1em;
    margin: 0 2.5px;
    text-align: center;
    width: 1em;
    right: 0.2em;
    top: -1.35em;
}
.slick-feature-slide .slick-prev {
    margin-right: 1.3em;
}

/* slider fuer artikelbild auf detailseite */
#product-image-thumbs {
    background-color: rgba(255,255,255,0.75);
    position: absolute;
    top: 0;
    left: calc(-15% - 15px);
    bottom: 0;
    margin: auto;
    width: 15%;
    -webkit-transition: left 0.3s ease 0s;
    transition: left 0.3s ease 0s;
}
.pswp-images-wrapper:hover #product-image-thumbs {
    left: 0;
}
#product-image-thumbs .slick-arrow {
    filter: alpha(opacity=0);
    opacity: 0;
}
#product-image-thumbs:hover .slick-arrow, #product-image-thumbs:focus .slick-arrow {
    filter: alpha(opacity=100);
    opacity: 1;
}
#product-image-detail, #product-image-thumbs {
    overflow: hidden;
}
#product-image-detail .slick-list {
    padding: 0;
}
#product-image-detail .product-image, #product-image-thumbs .product-image {
    height: 0;
    padding-top: 100%;
    position: relative;
}
#product-image-detail .product-image img, #product-image-thumbs .product-image img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: auto;
    max-height: 100%;
    width: auto;
    max-width: 100%;
}

/* extension slider */
.extension-slider {
    background-color: #f7f7f7;
}
.extension-slider.slick-dotted {
    margin-bottom: calc(4em + 30px);
}
.extension-slider .slick-list {
    padding-top: 0;
}
.extension-slider .stay-opac {
    filter: alpha(opacity=100)!important;
    opacity: 1!important;
}
.extension-slider .slick-arrow {
    font-size: 3em;
    width: 1em;
    height: 2em;
    line-height: 2em;
    filter: alpha(opacity=0);
    opacity: 0;
}
.extension-slider:hover .slick-arrow, .extension-slider:focus .slick-arrow {
    filter: alpha(opacity=100);
    opacity: 1;
}
.extension-slider.slick-paging-s .slick-prev {
    left: 0;
}
.extension-slider.slick-paging-s:hover .slick-prev, .extension-slider.slick-paging-s:focus .slick-prev {
    left: 1em;
}
.extension-slider.slick-paging-s .slick-next {
    right: 0;
}
.extension-slider.slick-paging-s:hover .slick-next, .extension-slider.slick-paging-s:focus .slick-next {
    right: 1em;
}

.extension-slider .slick-slide::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.extension-slider .slick-slide .video {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}
.extension-slider .slick-slide .video iframe {
    display: block;
    pointer-events: none;
    height: 100%;
    width: 100%;
}

.slide-caption {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 100%;
    width: 100%;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.slide-caption-inner {
    color: #303030;
    font-size: calc(7px + (14 - 7) * ((100vw - 320px) / (1920 - 320)));
    padding: 3em;
}

.slide-title {
    color: #fff;
    display: block;
    font-size: 2.5em;
    font-weight: bold;
    text-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px;
}
.slide-text {
    color: #fff;
    font-size: 1.5em;
    font-style: italic;
    margin-bottom: 15px;
    text-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px;
}
.slide-link.btn {
    font-size: 1em;
    pointer-events: all;
}

/* responsive */
@media (max-width: 567px) {
    .slick-dots {
        display: none!important;
    }
    .slick-dotted.slick-slider {
        margin-bottom: 0;
    }
    .extension-slider.slick-dotted {
        margin-bottom: 30px;
    }
    .extension-slider .slick-arrow {
        font-size: 5vw;
    }
}