@import "https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.css";

.owl-carousel .owl-item {
    padding: 0 10px;
}

.owl-theme p {
    font-size: 1rem;
    color: var(--colour_text_body);
}

.owl-buttons {
    position: absolute;
    top: -65px;
    right: 0;
    display: flex;
}

.owl-buttons .right,
.owl-buttons .left {
    background: var(--colour_button_normal);
    border: 1px solid var(--colour_button_normal);
    color: var(--colour_button_normal_text);
    font-size: 3rem;
    transition: all .3s;
    height: 40px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}

.owl-buttons .right:hover,
.owl-buttons .left:hover {
    background: var(--colour_button_hover);
    border: 1px solid var(--colour_button_hover);
    color: var(--colour_button_hover_text);
}

.owl-buttons .right:focus,
.owl-buttons .left:focus {
    background: var(--colour_button_pressed);
    border: 1px solid var(--colour_button_pressed);
    color: var(--colour_button_pressed_text);
}

@media all and (max-width: 767px) {
    .owl-buttons {
        display: block;
        position: static;
    }

    .owl-buttons .right,
    .owl-buttons .left {
        position: absolute;
        top: 23%;
    }

    .owl-buttons .left {
        left: 0;
    }

    .owl-buttons .right {
        right: 0;
    }

    .owl-carousel {
        padding: 0 50px;
        margin: 0;
    }
}

.related-item-container {
    font-size: 1.1rem;
    color: #000;
    font-weight: 100;
    padding-bottom: 20px;
}

.related-item-header .title {
    margin-bottom: 20px;
}

.related-item__soled, .related-item__reserved {
    z-index: 20;
    font-size: 0.8rem;
    padding: 0 10px;
    top: -5px;
}

.related-item__soled {
    background: #be5754;
}

.related-item__reserved {
    background: #0f1d56cc;
}

.related-item__image {
    padding-top: 100%;
    margin-bottom: 5px;
    background: var(--items-bg);
}

.related-item__image__container{
    top: 0;
    left: 0;
}

.related-item__title {
    font-size: 1.1rem;
    margin: 0 0 5px;
    color: var(--colour_text_body);
}

.related-item__price {
    font-size: 1rem;
    margin-bottom: 20px;
}

.related-item-container:hover {
    color: inherit;
}

.related-item__btn-container {
    top: 0;
    left: 0;
    z-index: 10;
    opacity: 0;
}
.related-item__btn-container *,
.related-item__btn-container .btn {
    color: var(--colour_text_body);
}
.related-item-container:hover .related-item__btn-container {
    opacity: 1;
}

.second-image-template .related-item-container:hover .static-image{
    opacity: 0;
}

.second-image-template .related-item-container:hover .hover-image {
    opacity: 1;
}

.related-item__image__container img {
    object-fit: contain;
}

.static-image {
    opacity: 1;
    transition: all 1.3s;
}

.hover-image {
    left: 0;
    top: 0;
    opacity: 0;
    transition: all 1.3s;
}

.artist__reserved {
    background: #0f1d56cc;
}
.artist_out-of-stock{
    background-color: #7e7e7e;
}

.artist__soled, .artist__reserved,.artist_out-of-stock {
    z-index: 20;
    font-size: 0.8rem;
    padding: 0 10px;
    top: 0;
    color: #ffffff;
    right: 0;
}

.artist__soled{
    background: #be5754;
}


.related-item-container .sold,.related-item-container .reserved,.related-item-container .out-of-stock {
    z-index: 200;
    top: 0;
    left: 0;
    right: auto;
    letter-spacing: 1px;
    font-size: 12px;
    color: #ffffff;
    padding: 0 10px;
}

.related-item-container .sold {
    background-color: #b50000;
}

.related-item-container .reserved {
    background-color: #0f1d56cc;
}

.related-item-container .out-of-stock{
    background-color: #7e7e7e;
}
