/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Slider family. This enables the ability to
	a family of widgets in a single update without touching the structure of the widget and without needing
	to duplicate efforts across several widget-specific CSS files.
*/


.ccl-widget.core-slider .glide__arrows button.glide__arrow.glide__arrow--right:after, 
.ccl-widget.core-slider .glide__arrows button.glide__arrow.glide__arrow--left:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(180deg);
    background-image: url(/includes/public/assets/shared/icon-arrow-right-blue.svg);
    width: 7px;
    height: 15px;
    background-size: contain;
    background-repeat: no-repeat;
}

.ccl-widget.core-slider .glide__arrows button.glide__arrow.glide__arrow--right:after {
    transform: translate(-50%, -50%);
}

.ccl-widget.core-slider .glide__arrows button.glide__arrow {
    background: transparent;
    box-shadow: none;
    width: var(--space-5);
    height: var(--space-5);
    margin: 0;
}

.ccl-widget.core-slider .glide__arrows button.glide__arrow:focus {
	outline: none;
}

@media (min-width: 40em) {
    .ccl-widget.core-slider .glide__arrows button.glide__arrow.glide__arrow--right:after, 
    .ccl-widget.core-slider .glide__arrows button.glide__arrow.glide__arrow--left:after {
        width: 13px;
        height: 30px;
    }

}