.main-template {
    padding: 3rem 1.5rem;
    text-align: center;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
    background-color: #0d6efd!important;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm:focus {
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125) !important;
}

.card-offer .offer-link {
    background-color: #f8f9fa;
    position: absolute;
    right: 0px;
    top: 0;
    bottom: 0;
    padding-left: 10px;
    text-align: right;
    padding-right: 12px;
    min-width: 120px;
    border-left: 1px solid #e3e3e3;
}

html.dark .card-offer .offer-link {
    background-color: #444444;
    border-left: 1px solid #424242;
}

.card-offer .offer-link a {
    display: block;
    z-index: 100
}

.card-offer .offer-link a.panel {
    margin-top: 8px
}

.card-offer .offer-link a.direct {
    text-align: right;
    color: #313539;
    margin-top: 4px;
    font-size: 10px
}

html.dark .card-offer .offer-link a.direct {
    color: #e1e1e1;
}

.card-offer .offer-link small.direct {
    text-align: right;
    color: #313539;
    margin-top: 4px;
    font-size: 10px
}

html.dark .card-offer .offer-link small.direct {
    color: #e1e1e1;
}

.card-offer.promoted {
    background-color: #dffad2;
    font-weight: bold;
    border: 1px solid #c0f5a6;
    padding-bottom: 4px
}

.card-offer.promoted:after {
    position: absolute;
    left: 0;
    bottom: -1px;
    display: block;
    content: "PROMOTED";
    padding: 1px;
    padding-left: 3px;
    padding-right: 3px;
    background-color: #c0f5a6;
    font-size: 7px;
    color: #333
}

.card-offer.promoted .offer-link {
    background-color: #c0f5a6
}

.card-offer.promoted .offer-link::before {
    padding-top: 12px;
    background-color: #c0f5a6;
    border-left: 5px solid #9ab58d
}

@media screen and (max-width: 980px) {
    .card-offer {
        padding-bottom:30px !important
    }

    .card-offer:after {
        left: 50% !important;
        transform: translateX(-50%);
        bottom: 3px !important
    }

    .card-offer .offer-link {
        position: absolute;
        left: 0px;
        bottom: 0px;
        right: 0px;
        top: auto;
        height: 30px;
        padding: 0;
        text-align: left;
        padding-left: 12px;
        border-left: none!important;
    }

    .card-offer .offer-link a {
        display: inline-block;
        margin-top: 2px !important
    }

    .card-offer .offer-link a.direct {
        float: right;
        margin-right: 12px;
        margin-top: 4px !important
    }

    .card-offer .offer-link small.direct {
        float: right;
        margin-right: 12px;
        margin-top: 4px !important
    }

    .card-offer .offer-link::before {
        display: none
    }
}

.ads-banner{
    width: 100%;
}
.ads-banner img{
    width: 100%;
}
.ads-title{
    display: flex;
    justify-content: space-between;
}