:root {
    --gold-color-1: #bf952e;
    --gold-color-2: #171717;
    --gold-color-3: #fff;
    
    --orange-color-1: #E87818;
    --orange-color-2: #333333;
    --orange-color-3: #fff;
    
    --blue-color-1: #1E73BE;
    --blue-color-2: #000;
    --blue-color-3: #fff;
    
    --red-color-1: #F93A3A;
    --red-color-2: #171717;
    --red-color-3: #fff;
    
    --yellow-color-1: #FECF12;
    --yellow-color-2: #212121;
    --yellow-color-3: #fff;
    
    --black-color-1: #000;
    --black-color-2: #333333;
    --black-color-3: #fff;
}

.splide__list {
    height: fit-content !important;
}

.splide__pagination__page {
    background-color: gray;
}

.splide__pagination__page.is-active {
    background-color: black;
}

.bg-gold-color-1, .hover-bg-gold-color-1:hover { background-color: var(--gold-color-1); }
.bg-gold-color-2, .hover-bg-gold-color-2:hover { background-color: var(--gold-color-2); }
.bg-gold-color-3, .hover-bg-gold-color-3:hover { background-color: var(--gold-color-3); }

.bg-orange-color-1, .hover-bg-orange-color-1:hover { background-color: var(--orange-color-1); }
.bg-orange-color-2, .hover-bg-orange-color-2:hover { background-color: var(--orange-color-2); }
.bg-orange-color-3, .hover-bg-orange-color-3:hover { background-color: var(--orange-color-3); }

.bg-blue-color-1, .hover-bg-blue-color-1:hover { background-color: var(--blue-color-1); }
.bg-blue-color-2, .hover-bg-blue-color-2:hover { background-color: var(--blue-color-2); }
.bg-blue-color-3, .hover-bg-blue-color-3:hover { background-color: var(--blue-color-3); }

.bg-red-color-1, .hover-bg-red-color-1:hover { background-color: var(--red-color-1); }
.bg-red-color-2, .hover-bg-red-color-2:hover { background-color: var(--red-color-2); }
.bg-red-color-3, .hover-bg-red-color-3:hover { background-color: var(--red-color-3); }

.bg-yellow-color-1, .hover-bg-yellow-color-1:hover { background-color: var(--yellow-color-1); }
.bg-yellow-color-2, .hover-bg-yellow-color-2:hover { background-color: var(--yellow-color-2); }
.bg-yellow-color-3, .hover-bg-yellow-color-3:hover { background-color: var(--yellow-color-3); }

.bg-black-color-1, .hover-bg-black-color-1:hover { background-color: var(--black-color-1); }
.bg-black-color-2, .hover-bg-black-color-2:hover { background-color: var(--black-color-2); }
.bg-black-color-3, .hover-bg-black-color-3:hover { background-color: var(--black-color-3); }

.text-gold-color-1, .hover-bg-orange-color-1:hover { color: var(--gold-color-1); }
.text-gold-color-2, .hover-bg-orange-color-2:hover { color: var(--gold-color-2); }
.text-gold-color-3, .hover-bg-orange-color-3:hover { color: var(--gold-color-3); }

.text-orange-color-1, .hover-text-orange-color-1:hover { color: var(--orange-color-1); }
.text-orange-color-2, .hover-text-orange-color-2:hover { color: var(--orange-color-2); }
.text-orange-color-3, .hover-text-orange-color-3:hover { color: var(--orange-color-3); }

.text-blue-color-1, .hover-text-blue-color-1:hover { color: var(--blue-color-1); }
.text-blue-color-2, .hover-text-blue-color-2:hover { color: var(--blue-color-2); }
.text-blue-color-3, .hover-text-blue-color-3:hover { color: var(--blue-color-3); }

.text-red-color-1, .hover-text-red-color-1:hover { color: var(--red-color-1); }
.text-red-color-2, .hover-text-red-color-2:hover { color: var(--red-color-2); }
.text-red-color-3, .hover-text-red-color-3:hover { color: var(--red-color-3); }

.text-yellow-color-1, .hover-text-.yellow-color-1:hover { color: var(--yellow-color-1); }
.text-yellow-color-2, .hover-text-.yellow-color-2:hover { color: var(--yellow-color-2); }
.text-yellow-color-3, .hover-text-.yellow-color-3:hover { color: var(--yellow-color-3); }

.text-black-color-1, .hover-text-.black-color-1:hover { color: var(--black-color-1); }
.text-black-color-2, .hover-text-.black-color-2:hover { color: var(--black-color-2); }
.text-black-color-3, .hover-text-.black-color-3:hover { color: var(--black-color-3); }

.irs-to, .irs-from {
    background-color: #D2E3F2 !important;
    top: 30px !important;
    color: black !important;
}

.irs-bar {
    background-color: var(--blue-color-1) !important;
}

.irs-from::before, .irs-to::before {
    border-top-color: transparent !important;
}

.irs-from::after, .irs-to::after {
    border-bottom-color: #D2E3F2 !important;
}

.irs-handle {
    border-color: var(--blue-color-1) !important;
    background-color: var(--blue-color-1) !important;
}

.irs--round .irs-handle {
    top: 3px !important;
}

.irs-line, .irs-bar {
    top: 13px !important;
}