.mod-offer-panel .offer-panel {
    background-attachment: fixed;
    background-size: cover;
    height: 500px;
    width: 100vw;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    padding: 50px 0 15px 0;
    position: relative;
}
.mod-offer-panel .offer-panel h2 {
    position: absolute;
    width: inherit;
    color: #000000;
    top: -5px;
    text-align: center;
    z-index: 10;
}
.mod-offer-panel .offer-panel-item {
    position: relative;
    height: 400px;
    aspect-ratio: 3 / 4;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 4px;
    overflow: hidden;
    box-shadow: 3px 3px 10px 1px rgb(100 100 100);
    margin: 5px;
    border-radius: 25%;
}
.mod-offer-panel .offer-panel-item-child {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0 !important;
    left: 0 !important;
}
.mod-offer-panel .offer-panel-item-child:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0 !important;
    left: 0 !important;
    background-size: cover;
    transition: filter 0.3s ease;
}
.mod-offer-panel .offer-panel-item:hover .offer-panel-item-child:before {
    filter: grayscale(1);
    transition: filter 0.3s ease;
}

.mod-offer-panel .offer-panel-item-child h3 {
    position: relative;
    text-shadow: 0 5px 5px rgb(0 0 0 / 35%);
    padding: 5px 10px;
    border-radius: 10px;
    width: fit-content;
    transform: rotate(-11deg);
    left: 25px !important;
    top: -4px !important;
    font-size: 24px;
    line-height: 1.1;
}

.mod-offer-panel .offer-panel-content {
    position: absolute;
    width: 100%;
    height: 75%;
    bottom: 0 !important;
    left: 0 !important;
    opacity: 0 !important;
    visibility: hidden;
    transition: all 0.5s ease;
}
.mod-offer-panel .offer-panel-item:hover .offer-panel-content {
    opacity: 1 !important;
    visibility: visible;
}

/* Zoznam a texty */
.mod-offer-panel .offer-panel-content ul {
    list-style: none;
    padding: 80px 0 15px 0;
    font-size: large;
    font-weight: 400;
    cursor: auto;
    margin: 0;
}
.mod-offer-panel .offer-panel-content ul span,
.mod-offer-panel .offer-panel-link-content span {
    font-weight: 300;
    position: absolute;
    top: 60% !important;
    left: 0 !important;
    padding: 0 15px;
    line-height: 1.3;
}

/* Animácia podčiarknutia (.decoration) */
.mod-offer-panel .decoration {
    position: relative;
    padding: 0 10px;
    cursor: pointer;
    width: fit-content;
    margin: 0 auto;
}
.mod-offer-panel .decoration:before {
    content: "";
    position: absolute !important;
    width: 100% !important;
    height: 1px !important;
    bottom: 0 !important;
    left: 0 !important;
    visibility: hidden;
    border-radius: 5px !important;
    transform: scaleX(0) !important;
    transition: .25s linear !important;
}
.mod-offer-panel .decoration:hover:before,
.mod-offer-panel .decoration:focus:before {
    visibility: visible !important;
    background-color: white !important;
    transform: scaleX(1) !important;
}

/* Slide panely (odkazy po kliknutí) */
.mod-offer-panel .offer-panel-link-content {
    position: absolute;
    width: 100%;
    height: 75%;
    bottom: 0 !important;
    right: -100% !important;
    padding: 90px 15px 30px 15px;
    transition: all 0.5s ease;
}
.mod-offer-panel .offer-panel-link-content.content-open {
    right: 0 !important;
}
.mod-offer-panel .offer-panel-content.content-left {
    left: -100% !important;
}

/* Pozície vnútorných elementov */
.mod-offer-panel .content-title {
    position: absolute;
    top: 62px !important;
    left: 0 !important;
    width: 100%;
}
.mod-offer-panel .backLink {
    position: absolute;
    bottom: 3px !important;
    left: 60px !important;
}
.mod-offer-panel .moreLink {
    position: absolute;
    bottom: 3px !important;
    right: 60px !important;
}
.mod-offer-panel .offer-panel-content .moreLink {
    right: 50% !important;
    margin-right: -38px;
}