html,
body {
    background: #000 !important;
}

a.item-nav-bottom,
a.item-nav-bottom:hover,
a.item-nav-bottom:focus {
    color: #fff;
}

.hero-banner,
.hero-banner .slider-img {
    display: block;
    width: 100%;
}

.hero-banner .slider-img {
    height: auto;
    max-width: none;
    object-fit: contain;
}

.place-img-rtp .btn-play {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease;
}

.place-img-rtp:hover .btn-play,
.place-img-rtp:focus-within .btn-play {
    opacity: 1 !important;
    visibility: visible;
    pointer-events: auto;
}

.place-img-rtp:hover .rtp-card-img,
.place-img-rtp:focus-within .rtp-card-img {
    filter: grayscale(100%);
    opacity: .55;
    transform: scale(1.05);
    transition: all .2s ease;
}

.icon-card-bg.is-active {
    background: #000;
    box-shadow: inset 0 -3px 0 var(--first-color);
}

.icon-card-bg.is-active p {
    color: #fff !important;
}

@media (hover: none) {
    .place-img-rtp .btn-play {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .place-img-rtp .rtp-card-img {
        opacity: .72;
    }
}