/***************************************************************************
* Pagination
****************************************************************************/
.typo_slider_pagination button {
    background-color: transparent;
    border: 1px solid currentColor;
}
.typo_slider_pagination button.active {
    background-color: currentColor;
}

/***************************************************************************
* Arrows
****************************************************************************/
.typo_slider_prev, 
.typo_slider_next {
    width: calc(var(--typo-calc-size) * 1.5em); height: calc(var(--typo-calc-size) * 1.5em);
    /*width: 1.5em; height: 1.5em;*/
    background-color: #FFFFFF;
    background-size: 80% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    color: transparent;
    box-shadow: 0 0 1em rgba(0,0,0,0.1);
}
.typo_slider_prev {background-image: var(--typo-svg-arrow-left);}
.typo_slider_next {background-image: var(--typo-svg-arrow-right);}


/***************************************************************************
* Post Teaser Block = Slider
****************************************************************************/
.post_teaser_block.typo_slider.has_pagination,
.listing_block.typo_slider.has_pagination {
    padding-bottom: var(--typo-gap);
    padding-top: var(--typo-gap);
    overflow: visible;
}
.post_teaser_block.typo_slider .typo_slider_pagination,
.listing_block.typo_slider .typo_slider_pagination {
    bottom: 0;
}

.post_teaser_block.typo_slider .typo_slider_prev,
.listing_block.typo_slider .typo_slider_prev,
.post_teaser_block.typo_slider .typo_slider_next,
.listing_block.typo_slider .typo_slider_next {
    background-color: var(--typo-color-blue);
}

.post_teaser_block.typo_slider .typo_slider_prev,
.listing_block.typo_slider .typo_slider_prev {
    left: var(--typo-double-gap);
    background-image: var(--typo-svg-arrow-left-white);
}
.post_teaser_block.typo_slider .typo_slider_next,
.listing_block.typo_slider .typo_slider_next {
    right: var(--typo-double-gap);
    background-image: var(--typo-svg-arrow-right-white);
}

@media screen and (min-width: 64em){
    .post_teaser_block.typo_slider .typo_slider_prev,
    .listing_block.typo_slider .typo_slider_prev {
        left: calc(var(--typo-gap) * -3); 
    }
    .post_teaser_block.typo_slider .typo_slider_next,
    .listing_block.typo_slider .typo_slider_next {
        right: calc(var(--typo-gap) * -4);
    }
}