.custom-facet-thumbnail-custom {
        border: black;
        border-style: solid;
        border-width: 3px 2px 2px 2px;
}

.eltdf-content .eltdf-content-inner>.eltdf-full-width>.eltdf-full-width-inner {
        padding: 0px;
}

.title-text {
        opacity: 1;
}

.custom-facet-layout-custom {
        position: relative;
}

.custom-facet-layout-custom:hover .title-text {
        opacity: 1;
}

.title-text {
        padding-top: 135px;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        position: absolute;

        background: rgba(0, 0, 0, 0);
        color: white;
        text-align: center;
}

.custom-facet-result-custom:hover .title-text {
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        position: absolute;
        background: rgba(0, 0, 0, 0.5);
        transition: .2s ease;
        opacity: 1;
        color: var(--primary);
        text-align: center;
}

.title-text {
        color: white;
        text-align: center;
}

.custom-facet-result-custom {
        width: 20%;
        box-sizing: border-box;
}





/* Mobile Styles */
@media only screen and (max-width: 400px) {
        .title-text {
                padding-top: 165px;

        }
}

/* Tablet Styles */
@media only screen and (min-width: 401px) and (max-width: 960px) {
        .title-text {
                padding-top: 135px;
        }
}

/* tablet Styles */
@media only screen and (min-width: 961px) {
        .title-text {
                padding-top: 115px;
        }
}


/* Desktop Styles */
@media only screen and (min-width: 1680px) {
        .title-text {
                padding-top: 165px;
        }
}

@media only screen and (min-width: 2560px) {
        .title-text {
                padding-top: 220px;
        }
}



@media only screen and (max-width: 1160px) {
        .custom-facet-result-custom {
                width: 33.33%;
        }
}

@media only screen and (max-width: 768px) {
        .custom-facet-result-custom {
                width: 50%;
        }
}

@media only screen and (max-width: 480px) {
        .custom-facet-result-custom {
                width: 100%;
        }
}

.custom-facet-result-custom>div {
        position: relative;

}

.custom-facet-result-custom:hover>div.title-text {
        display: none;
}

.custom-facet-thumbnail-custom {
        background-color: #494949;
        display: block;
        height: 0;
        padding: 0 0 100% 0;
        background-position: center center;
        background-size: cover;
}


.custom-facet-meta-custom h2 {
        margin: 0 0 0 0;
        font-size: 24px;
        position: absolute;

}


.custom-facet-meta-custom .genre {
        margin-bottom: 0 0 8px 0;
        font-size: 1rem;
}

.custom-facet-meta-custom .band-size {
        margin-bottom: 0 0 0 0;
        font-size: 1rem;
}