h1,
h2,
h3,
h4,
h5,
h6,
nav {}

body {
    font-family: 'Source Sans Pro', sans-serif;
}

.bg-gradient {
    background: linear-gradient(45deg, var(--bs-primary), var(--bs-secondary)) !important;
}

/* DATATABLES */
.dataTables_filter,
.dataTables_length {
    display: none;
}

.dataTables_info {
    padding: 10px;
}

/* DATATABLES */

.dataTable .sorting[aria-sort='descending'] i:before {
    content: "\f235";
}

.dataTable .sorting[aria-sort='ascending'] i:before {
    content: "\f229";
}

.modal {
    /*z-index: 9999999999!important;*/
}

.offcanvas {
    max-width: 80% !important;
}

.owl-carousel .owl-stage {
    display: block !important;
}

a,
button {
    outline: 0;
}

.filter-primary {
    filter: invert(74%) sepia(15%) saturate(1188%) hue-rotate(105deg) brightness(86%) contrast(84%);
}

.btn-close:focus {
    box-shadow: none !important;
}

.img {
    background-image: url('../img/default.png');
    background-size: cover !important;
    background-position: center !important;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-repeat: no-repeat;
}

hr {
    opacity: .1;
}

.wow {
    visibility: hidden;
}

.grecaptcha-badge,
#CookiebotWidget {
    visibility: hidden;
}

/* hscroll */
.hscroll>*::-webkit-scrollbar-thumb,
.hscroll>*::-webkit-scrollbar,
.hscroll>*::-webkit-scrollbar-track {
    height: 0 !important;
    width: 0 !important;
    display: none !important;
}

.hscroll {
    overflow-y: hidden;
    position: relative;
}

.hscroll>* {
    -webkit-user-select: none;
    display: block;
    overflow-y: hidden;
    padding: 0;
    position: relative;
    -webkit-overflow-scrolling: touch;
    overflow-x: scroll;
}

.hscroll>*>* {
    width: min-content;
    min-width: 100%;

    position: relative;
    white-space: nowrap;
    overflow: hidden;
}

@media (max-width: 768px) {
    .hscroll:after {
        content: "";
        background: -webkit-linear-gradient(0deg, rgba(48, 49, 52, 0), #fffff6);
        height: 100%;
        position: absolute;
        pointer-events: none;
        right: 0;
        top: 0;
        width: 24px;
        z-index: 2;
    }

    .hscroll.dark:after {
        background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.5))) !important;
    }
}

/* hscroll */

.row .full-bg {
    /*
    <div class="position-relative">
        <div class="container">
            <div class="row">
                <div class="col-12 col-md-6">Colonna boxata</div>
                <div class="col-12 col-md-6">
                    <div class="full-bg text-end d-md-block"><!--sfondo--></div>
                    <h1>Contenuto boxato</h1>
                </div>
            </div>
        </div>
    </div>

    /* settare le variabili --bs-container (Xpx) e --bs-colperc (Y) su boostrap.css in base ai breakpoint utilizzati.
    --bs-container è la max-width in px (px da specificare) del container.
    --bs-colperc è la width in percentuale (% da non specificare) della colonna.
    */
    width: calc((((var(--bs-container) + var(--bs-gutter-x)) / 100 * var(--bs-colperc)) - (var(--bs-gutter-x) / 2)) + (100% - var(--bs-container))/2);
    position: absolute;
    height: 100%;
    z-index: -1;
    top: 0;
    display: none;
}

.row>*:last-of-type .full-bg {
    margin-left: calc(-1 * var(--bs-gutter-x)/2);
}

.row>*:first-of-type .full-bg {
    margin-right: calc(-1 * var(--bs-gutter-x)/2);
    left: 0;
}

/*SM*/
@media (min-width: 576px) {}

/* hscroll */

.whatsapp-float {
    position: fixed;
    right: 24px;
    bottom: 88px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: #25d366;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
    z-index: 1050;
    transition: transform .2s ease, box-shadow .2s ease;
}

.whatsapp-float:hover,
.whatsapp-float:focus-visible {
    color: #fff;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.35);
}

.whatsapp-float .bi {
    line-height: 1;
}

@media (max-width: 768px) {
    .border-md-end {
        border-right: 1px solid #dee2e6;
    }
}

/*MD*/
@media (min-width: 768px) {
    .border-md-end {
        border-right: 1px solid #dee2e6;
    }
}

/*LG*/
@media (min-width: 992px) {
    .border-lg-end {
        border-right: 1px solid #dee2e6;
    }

    .min-vh-lg-100 {
        min-height: 100vh !important;
    }
}

/*XL*/
@media (min-width: 1200px) {
    .ratio-xl-21x9 {
        --bs-aspect-ratio: 42.8571428571% !important;
    }
}

/*XXL*/
@media (min-width: 1400px) {}