.splide{
padding-left: 20px !important;
padding-right: 20px !important;
}
.splide:not(:last-child) {
margin-bottom: 40px;
}
.splide__slide {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 3px 3px 20px;
list-style-type: none;
}
.splide__slide > *{
width: 100%;
height: 100%;
}
.splide__arrows {
position: absolute;
left: 0;
right: 0;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
width: 100%;
z-index: 2;
}
.splide__arrows .splide__arrow {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
background: transparent !important;
border: none !important;
padding: 0 !important;
outline: none !important;
}
.splide__arrows .splide__arrow:disabled {
display: none;
}
.splide__arrows .splide__arrow svg {
width: 26px;
}
.splide__arrows .splide__arrow svg path {
fill: #1C2991;
}
.splide__arrows .splide__arrow--next {
right: -20px;
}
.splide__arrows .splide__arrow--prev {
left: -20px;
-webkit-transform: translateY(-50%) rotate(180deg);
-ms-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
}
.splide-progress {
background: #FFFFFF;
margin: 20px 0;
}
.splide-progress:last-child {
margin-bottom: 0;
}
.splide-progress-bar {
background: #1C2991;
height: 2px;
-webkit-transition: width 400ms ease;
-o-transition: width 400ms ease;
transition: width 400ms ease;
width: 0;
}
.splide__pagination + .splide__pagination {
display: none;
}
.splide__pagination__page {
background: #1C2991;
border: 0;
border-radius: 50%;
display: inline-block;
height: 10px;
margin: 0 0.1rem;
padding: 0;
position: relative;
-webkit-transition: background-color 0.2s ease;
-o-transition: background-color 0.2s ease;
transition: background-color 0.2s ease;
width: 10px;
}
.splide__pagination__page.is-active {
background-color: #1C2991;
}
@media screen and (max-width: 640px) {
.splide{
padding-left: 0px !important;
padding-right: 0px !important;
}
.splide__arrows{
display: none;
}
}