/* =========================================
   HOVER MEDIA CAROUSEL
   ========================================= */


/* =========================================
   MAIN CAROUSEL
   ========================================= */

.wkit-hover-media-carousel-main {
    width: 100%;

    display: flex;
    align-items: center;

    position: relative;

    padding: 0;}/* =========================================
   SWIPER
   ========================================= */

.wkit-hover-media-swiper {
    width: 100%;
    overflow: hidden;}.wkit-wb-Widget_3mscd925 .wkit-hover-media-swiper .swiper-wrapper {
    align-items: center;}/* =========================================
   CARD
   ========================================= */

.wkit-hover-card {
    position: relative;

    height: 300px;
    width: max-content;

    overflow: hidden;

    border-radius: 0;

    flex-shrink: 0;

    margin-right: 20px;

    transition: 0.3s linear;}/* =========================================
   IMAGE
   ========================================= */

.wkit-hover-card .card-img {
    display: block;

    height: 300px;
    width: auto;

    max-width: none;

    object-fit: contain;}/* =========================================
   OVERLAY
   ========================================= */

.wkit-overlay {
    position: absolute;

    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 30px;

    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;

    gap: 0;

    background: transparent;

    opacity: 1;

    transition:
        background-color 0.3s ease-out,
        opacity 0.3s ease-out;}/* =========================================
   HOVER BACKGROUND
   ========================================= */

.wkit-hover-card:hover .wkit-overlay,
.wkit-hover-card.mobile-active .wkit-overlay {
    background-color: rgba(0, 0, 0, 0.75);}/* =========================================
   TITLE
   ========================================= */

.wkit-overlay .overlay-title {
    position: static;

    width: auto;
    max-width: 100%;

    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;

    font-size: 23px;

    color: #fff;

    text-align: right;

    margin: 0 0 20px 0;
    padding: 0;

    transform: none;

    transition:
        color 0.2s linear,
        opacity 0.3s ease-out;}/* =========================================
   TITLE ICON
   ========================================= */

.wkit-overlay .overlay-title .tp-title-icon {
    color: #fff;

    font-size: 20px;

    margin-left: 5px;

    transition: all 0.2s linear;}.wkit-wb-Widget_3mscd925 .wkit-overlay .overlay-title .tp-title-icon svg {
    width: 20px;
    height: auto;

    transition: all 0.2s linear;}.wkit-wb-Widget_3mscd925 .wkit-overlay .overlay-title .tp-title-icon svg path {
    fill: #fff;

    transition: all 0.2s linear;}/* =========================================
   LOCATION
   ========================================= */

.wkit-overlay .overlay-location {
    position: static;

    width: auto;
    max-width: 100%;

    font-size: 16px;

    color: #fff;

    text-align: right;

    margin: 0 0 20px 0;
    padding: 0;

    opacity: 0;

    transform: translateY(20px);

    transition:
        opacity 0.4s ease-out,
        transform 0.4s ease-out;}/* =========================================
   DESCRIPTION
   ========================================= */

.wkit-overlay .overlay-desc {
    position: static;

    width: auto;
    max-width: 80%;

    font-size: 16px;

    color: #fff;

    text-align: right;

    margin: 0 0 20px 0;
    padding: 0;

    opacity: 0;

    transform: translateY(20px);

    transition:
        opacity 0.4s ease-out,
        transform 0.4s ease-out;}/* =========================================
   BUTTON
   ========================================= */

.wkit-overlay .overlay-btn {
    position: relative;

    width: fit-content;

    font-size: 18px;

    display: inline-flex;

    color: #fff;

    align-items: center;

    gap: 5px;

    margin: 0;
    padding: 0;

    opacity: 0;

    transform: translateY(20px);

    transition:
        opacity 0.4s ease-out,
        transform 0.4s ease-out;}/* =========================================
   SHOW CONTENT ON HOVER
   ========================================= */

.wkit-hover-card:hover .wkit-overlay .overlay-location,
.wkit-hover-card:hover .wkit-overlay .overlay-desc,
.wkit-hover-card:hover .wkit-overlay .overlay-btn,

.wkit-hover-card.mobile-active .wkit-overlay .overlay-location,
.wkit-hover-card.mobile-active .wkit-overlay .overlay-desc,
.wkit-hover-card.mobile-active .wkit-overlay .overlay-btn {
    opacity: 1;

    transform: translateY(0);}/* =========================================
   BUTTON UNDERLINE
   ========================================= */

.wkit-overlay .overlay-btn::after {
    position: absolute;

    display: block;

    bottom: -2px;
    left: 0;

    width: 100%;

    transform: scaleX(0);

    border-top: 1px solid #fff;

    content: '';

    transform-origin: right;

    transition:
        transform 0.3s cubic-bezier(0.25,0,0.4,1),
        border-color 0.35s cubic-bezier(0.52,0.01,0.16,1);}.wkit-wb-Widget_3mscd925 .wkit-overlay .overlay-btn:hover::after {
    backface-visibility: hidden;

    transform: scaleX(1);

    transform-origin: left;}/* =========================================
   BUTTON ICON
   ========================================= */

.wkit-overlay .overlay-btn .tp-title-icon {
    font-size: 18px;

    color: #fff;}.wkit-wb-Widget_3mscd925 .wkit-overlay .overlay-btn .tp-title-icon svg {
    width: 18px;

    fill: #fff;}/* =========================================
   NAVIGATION
   ========================================= */

.wkit-hover-media-carousel-main .wkit-navigation {
    position: absolute;

    /*
     * Image height = 300px.
     * No top/bottom padding.
     * Image center = 150px.
     */
    top: 150px;

    /*
     * 10px outside the widget edges.
     */
    left: -10px;
    right: -10px;

    width: auto;

    display: flex;

    justify-content: space-between;
    align-items: center;

    padding: 0;

    transform: translateY(-50%);

    box-sizing: border-box;

    pointer-events: none;

    z-index: 10;}/* =========================================
   NAVIGATION BUTTONS
   ========================================= */

.wkit-navigation .button-prev,
.wkit-navigation .button-next {
    position: relative;

    width: 45px;
    height: 45px;

    display: flex;

    justify-content: center;
    align-items: center;

    background: #fff;
    color: #000;

    border-radius: 50%;

    cursor: pointer;

    pointer-events: auto;

    transition: transform 0.3s ease-in-out;}/* =========================================
   NAVIGATION HOVER
   ========================================= */

.wkit-navigation .button-prev:hover,
.wkit-navigation .button-next:hover {
    transform: scale(1.1);}/* =========================================
   NAVIGATION ACTIVE
   ========================================= */

.wkit-navigation .button-prev:active,
.wkit-navigation .button-next:active {
    transform: scale(0.95);}/* =========================================
   NAVIGATION ICONS
   ========================================= */

.wkit-overlay .overlay-title .tp-title-icon,
.wkit-navigation .button-prev,
.wkit-navigation .button-next,
.wkit-hover-nav .tp-title-icon {
    display: inline-flex;

    align-items: center;}.wkit-wb-Widget_3mscd925 .wkit-hover-nav .tp-title-icon {
    font-size: 20px;

    color: #000;}.wkit-wb-Widget_3mscd925 .wkit-hover-nav .tp-title-icon svg {
    width: 20px;

    fill: #000;}/* =========================================
   TABLET / MOBILE
   ========================================= */

@media (max-width: 1024px)  {  .wkit-wb-Widget_3mscd925

    .wkit-hover-card {
        height: 300px;

        width: max-content;

        max-width: none;}.wkit-wb-Widget_3mscd925 .wkit-hover-card .card-img {
        display: block;

        height: 300px;

        width: auto;

        max-width: none;

        object-fit: contain;}.wkit-wb-Widget_3mscd925 .wkit-overlay {
        height: 100%;

        padding: 20px;

        opacity: 1 !important;

        transform: none !important;}.wkit-wb-Widget_3mscd925 .wkit-hover-card .wkit-overlay .overlay-title,
    .wkit-hover-card .wkit-overlay .overlay-location,
    .wkit-hover-card .wkit-overlay .overlay-desc,
    .wkit-hover-card .wkit-overlay .overlay-btn {
        opacity: 1 !important;

        transform: none !important;}.wkit-wb-Widget_3mscd925 .wkit-hover-card .wkit-overlay .overlay-title {
        font-size: 1.25rem;

        margin-bottom: 10px;}.wkit-wb-Widget_3mscd925 .wkit-hover-card .wkit-overlay .overlay-location {
        margin-bottom: 10px;}.wkit-wb-Widget_3mscd925 .wkit-hover-card .wkit-overlay .overlay-desc {
        margin-bottom: 15px;}/* =========================================
       MOBILE / TABLET NAVIGATION
       ========================================= */

    .wkit-hover-media-carousel-main .wkit-navigation {
        top: 150px;

        left: -10px;
        right: -10px;

        width: auto;

        padding: 0;

        gap: 0;

        transform: translateY(-50%);}.wkit-wb-Widget_3mscd925 .wkit-navigation .button-prev:hover,
    .wkit-navigation .button-next:hover {
        transform: none;}.wkit-wb-Widget_3mscd925 .wkit-navigation .button-prev:active,
    .wkit-navigation .button-next:active {
        transform: none;}}