/*SEARCH FORM*/
#search_form{display: flex; justify-content: space-between}
#search_form select, #search_form input, #search_form button, .search-btn-m{border: none;border-radius:0;border: 2px solid var( --e-global-color-primary ); font-weight: 600; text-align:center }
#search_form select:hover{background:var( --e-global-color-primary ); color: #fff}
#search_form select, #search_form input {background: #fff;}
#search_form #localita, #search_form #prezzo{max-width: 200px;}
#search_form #bagni, #search_form #camere{max-width: 100px;}
#search_form button, .search-btn-m{padding: 20px 30px; background:var( --e-global-color-primary ); line-height: 0;}
#search_form button:hover, .search-btn-m:hover, .search-btn-m:focus {background: var( --e-global-color-accent ); color:var( --e-global-color-primary )}
#search_form button:hover svg, .search-btn-m:hover svg, #search_form h3{color:#fff; fill:#fff;}
.search-btn-m, #search_form h3{width:95%;display:none; margin:0 auto}

/*GALLERY STYLE*/
.gallery-immobile {max-width:100%;height:256px; overflow-y:hidden;position: relative; opacity: 0; visibility: hidden;  transition: opacity 500ms ease; -webkit-transition: opacity 1s ease;}
.gallery-immobile.slick-initialized{visibility: visible; opacity: 1;}
.freccia, .c_ico{padding: 10px; border: 3px solid var( --e-global-color-primary ); text-align: center; margin: 5px 10px; /*border-radius:50px;*/ cursor:pointer; display: inline-flex;}
.freccia svg, .c_ico svg{height: 24px; width:24px; fill: var( --e-global-color-primary );}
.struttura.griglia .freccia{position: absolute; top: 50%; transform: translateY(-25px); z-index:2; /*border-color:#fff;*/ opacity:0; transition:opacity 400ms ease-in}
.struttura.griglia:hover .freccia{opacity:1} 
/*.struttura.griglia .freccia svg{fill:#fff}*/
.struttura.griglia .freccia{background: #fff}
.struttura.griglia .freccia.sx{left: 0px;}
.struttura.griglia .freccia.dx{right:0px;}
.gallery-carosello .struttura.slick-slide { margin: 0px 20px;}
.slider .slick-dots{display:none!important}
.slick-list{padding-bottom:10px}
.gallery-immobile .draggable{padding-bottom: 0px }
.progressBar{border:1px solid}
.progressBar__bar {position: relative; display: block; width: 100%; height: 5px; overflow: hidden; background-image: linear-gradient(to right, var( --e-global-color-primary ), var( --e-global-color-primary )); background-repeat: no-repeat; background-size: 0% 100%; transition: background-size 0.5s ease-in-out;}
.progressBar__bar[aria-valuenow="0"] {background-size: 5% 100% !important;}
.progressBar__bar[aria-valuenow] {height: 5px;}
.navigazione{margin-top:20px; text-align:center;}
.slick-dotted.slick-slider { margin-bottom: 0px;}

/*SEARCH RESULT AND CATEGORY*/
h2.result_title{color: var( --e-global-color-primary );font-family: var( --e-global-typography-primary-font-family ), Sans-serif;}
.risultati{display: flex; flex-wrap: wrap; justify-content: space-between;}
.struttura{position:relative;display: flex; flex-wrap: wrap; margin-bottom:35px; font-family: var( --e-global-typography-primary-font-family ), Sans-serif; width:32%; background:#fff; box-shadow: 0px 1px 5px #00000079;}
.struttura .venduto_img{position: absolute; top: 0px; left: 0px; width: 100%;z-index:1}
.struttura .sommario {display: flex; width: 100%; justify-content: space-between; align-items:top; padding: 15px 10px 8px 10px;border-bottom: 1px solid}
.struttura .sommario .info{text-align: center}
.struttura .sommario .info .icona{display: block}
.struttura .indirizzo, .struttura .codice, .struttura .titolo {padding:0px 10px}
.struttura .sommario .info svg{height: 36px; width:36px/*fill: var( --e-global-color-primary );*/}
.struttura .titolo{color: var( --e-global-color-primary ); font-weight: var( --e-global-typography-primary-font-weight ); font-size:20px; flex-basis: 100%; margin-top: 10px; min-height:60px}
.struttura .indirizzo,.struttura .codice{color: var( --e-global-color-text ); font-family: var( --e-global-typography-text-font-family ), Sans-serif; font-size: 16px; font-weight: 500;flex-basis: 100%}
.struttura .codice {font-size: 14px; font-weight:700}
.struttura .panel{flex-basis: 100%; display:flex; padding:10px; align-items:center;min-height: 53px;}
.struttura .panel .prezzo{flex-basis: 65%; color: var( --e-global-color-primary ); font-size: 20px }
.struttura .panel span.prezzo{font-size: 22px }
.struttura .panel .pulsante{flex-basis:35%;text-align: right;}
.struttura .panel .pulsante a, .visualizza{background: var( --e-global-color-primary ); color:#fff!important; text-decoration:none; padding: 7px 15px; border: 2px solid var( --e-global-color-primary ); transition: all 500ms }
.struttura .panel .pulsante a:hover, .visualizza:hover{background: var( --e-global-color-accent ); color: var( --e-global-color-primary )!important;  }
.struttura{align-items: start;}
.pagination {justify-content: space-evenly!important; align-items: center;text-align: center}
.pagination .page-numbers{color: var( --e-global-color-primary ); font-family: var( --e-global-typography-text-font-family ); vertical-align: middle; margin: 0px 1vw;}
.pagination .page-numbers.current {border: 2px solid; width: 25px; display: inline-block;  height: 25px; line-height: 23px;}
.pagination .next, .pagination .prev{display: inline-block;}

/*SINGLE IMMOBILE*/
#header_video{height:100vh}
.post_content a{font-style:italic; color:var( --e-global-color-primary );}
.post_content h1{display:none;}
.caratteristiche {display: flex;flex-wrap: wrap; align-items:center; padding-left:15px}
.caratteristiche .caratteristica {flex-basis: 25%; display:flex; align-items: center; margin-bottom:10px}
.caratteristiche .caratteristica img {width: 40px; margin-right:10px}
.immobile .prezzo{color: var( --e-global-color-primary ); font-weight: var( --e-global-typography-primary-font-weight ); font-size:32px; font-weight:600; line-height:1}
.immobile .panel .prezzo{font-weight:normal}
.myFancyBox .fancybox-thumbs {top: auto; width: auto; bottom: 0; left: 0; right: 0; height: 95px; padding: 10px 10px 5px 10px; box-sizing: border-box; background: rgba(0, 0, 0, 0.3);}
.myFancyBox .fancybox-show-thumbs .fancybox-inner { right: 0; bottom: 95px;}
.fancybox-bg, .fancybox-inner, .fancybox-outer, .fancybox-stage{width:100%}

.salentoagency-map {width: 100%;}
.salentoagency-map-frame {position: relative; width: 100%; overflow: hidden;border-radius: 12px;}
.salentoagency-map-frame iframe {display: block; width: 100%;}
.salentoagency-map-address {margin-bottom: 12px;font-size: 16px; font-weight: 600;line-height: 1.4;}
.salentoagency-map-link {display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 500;text-decoration: none;}

#slider-filter {position:absolute; right:30px; top:150px; z-index:9}
#slider-filter button{padding: 5px 10px 5px 10px; border:2px solid var( --e-global-color-primary ); background: rgba(255,255,255,0.7); color: var( --e-global-color-primary ); font-family: var( --e-global-typography-primary-font-family ), Sans-serif; border-radius: 0 }
#slider-filter button:hover{background: #fff}


/*MORTAGE CALCULATOR STYLE*/
.loan-calculator {color: var( --e-global-color-primary ); overflow: hidden; border: 2px solid var( --e-global-color-primary )}
.loan-calculator .top {padding: 32px;}
.loan-calculator .top h3 { margin-top: 0; text-align:center}
.loan-calculator form { display: flex; gap: 8px; justify-content: space-between;}
.loan-calculator .title { margin-bottom: 16px;}
.loan-calculator form input { font-size: 20px; padding: 8px 24px; width: 100%;}
.loan-calculator .result { display: flex; justify-content: space-between; align-items: center;}
.loan-calculator .result .left { width: 100%; padding: 8px 32px;}
.loan-calculator .left h3 { font-size: 16px; font-weight: 400; margin-bottom: 8px;}
.loan-calculator .result .value { font-size: 30px; font-weight: 900; padding-bottom: 10px; border-bottom: 1px solid rgba(20, 33, 61, 0.2);}
.loan-calculator .result .value::before { content: "€"; font-size: 24px; font-weight: 400; margin-right: 6px; opacity: 0.4;}
.loan-calculator .calculate-btn { background: var( --e-global-color-primary );; color: #fff; border: none; padding: 8px 32px; border-radius: 8px; font-size: 18px; font-weight: 900; cursor: pointer; margin: 24px 0;}
.loan-calculator .right { width: 50%;}

/*CLASSE ENERGETICA*/
.grafico_energia{text-align: center; display: flex; justify-content: space-around; max-width:900px; margin:0 auto; margin-top: 50px; color:#fff; height: 35px; line-height:35px}
.grafico_energia div{flex-basis:12.5%}
.grafico_energia .a_plus{background-color: #6d9e00}
.grafico_energia .aa{background-color: #7fb800}
.grafico_energia .bi{background-color: #91d100}
.grafico_energia .ci{background-color: #ebc400}
.grafico_energia .di{background-color: #eb9d00}
.grafico_energia .ee{background-color: #e67300}
.grafico_energia .effe{background-color: #d22300}
.grafico_energia .gi{background-color: #b80000}
.selected_a_plus:before {content: " "; position: absolute; border-top: 15px solid #6d9e00; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_aa:before {content: " "; position: absolute; border-top: 15px solid #7fb800; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_bi:before {content: " "; position: absolute; border-top: 15px solid #91d100; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_ci:before {content: " "; position: absolute; border-top: 15px solid #ebc400; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_di:before {content: " "; position: absolute; border-top: 15px solid #eb9d00; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_ee:before {content: " "; position: absolute; border-top: 15px solid #e67300; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_effe:before {content: " "; position: absolute; border-top: 15px solid #d22300; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}
.selected_gi:before {content: " "; position: absolute; border-top: 15px solid #b80000; border-right: 15px solid transparent; border-left: 15px solid transparent;
	border-bottom: none; margin-top: -15px;}

/*CATEGORY CAROUSEL*/
.category-immobile{margin: 0px 15px}
.category-immobile-content{position:relative; padding: 20px;min-height: 300px;background:#0005}
.category-immobile-content .azioni {position:absolute; top:50%; left:0px; transform:translatey(-50%); width:100%; text-align:center}
.category-immobile-content .azioni .c_ico{border-color: #fff}
.category-immobile-content .azioni .c_ico svg{fill:#fff}
.category-immobile-content .azioni .cname {display:block;font-family: var( --e-global-typography-primary-font-family ), Sans-serif; text-transform:uppercase; color:#fff; font-size: 30px; text-wrap: balance;}

/*MAP & MAP POPUP*/
.ol-unselectable button{display:none;}
.ol-popup { position: absolute; text-align:center;background-color: white; box-shadow: 0 1px 4px rgba(0,0,0,0.2); padding: 15px; border-radius: 10px; border: 1px solid #cccccc; bottom: 12px; left: -50px; min-width: 280px;}
.ol-popup .prezzo{font-size:28px; display:block; margin-bottom:30px}
.ol-popup h3{font-size:21px}
.ol-popup:after, .ol-popup:before {top: 100%;border: solid transparent;content: " "; height: 0; width: 0; position: absolute;pointer-events: none;}
.ol-popup:after {border-top-color: white;border-width: 10px;left: 48px;margin-left: -10px;}
.ol-popup:before {border-top-color: #cccccc;border-width: 11px;left: 48px;margin-left: -11px;}
.ol-popup-closer {text-decoration: none;position: absolute;top: 2px;right: 8px;}.ol-popup-closer:after {content: "✖";}


/*NEWS CAROUSEL*/
.ig-news .news{ margin: 0px 5px;}
.ig-news .news .titolo {color:var( --e-global-color-primary ); font-family: var( --e-global-typography-primary-font-family ), Sans-serif; margin-top:10px; font-size: 20px }

@media screen and (max-width:1210px){
	.gallery-immobile{height:auto;}
	.struttura{width: 48%}
	.struttura .panel .prezzo, .immobile .panel .prezzo{font-size: 18px;}
}

@media screen and (max-width:767px){
	.struttura.griglia .freccia{opacity:1}
	#search_form{flex-wrap:wrap; text-align:center;position: fixed; height:100vh; top:0px; left:0px; transform: translateX(calc(-100% - 15px)); transition: all 600ms ease-in; z-index: 9999; padding: 30px 15px;
    background: var(--e-global-color-accent);}
	#search_form.ricerca-open{transform: translateX(0)}
	#search_form select, #search_form input, #search_form button{max-width:100%!important; width:100%; margin-bottom:10px}
	#search_form h3{display:block; font-family:var( --e-global-typography-primary-font-family ), Sans-serif;}
	.search-btn-m{display:flex; align-items:center; color:#fff; justify-content:center; font-size:24px;}
	.search-btn-m svg{margin-left:15px}
	.search-btn-m.close {margin-top:30px; font-size:16px; width:100%}
	.struttura{width: 100%}
	
	.immobile .hero{background-position: top center!important;margin-top:85px}
	.caratteristiche .caratteristica {flex-basis: 33%; flex-wrap:wrap}
}
@media screen and (max-width: 650px) { 
  	.loan-calculator form { flex-direction: column; gap: 20px; }
  	.loan-calculator .result { flex-direction: column; text-align: center;padding-bottom: 20px;}
	.caratteristiche .caratteristica {flex-basis: 50%; margin-bottom:15px}
}

@media screen and (min-width:768px){
	#search_form select:nth-child(odd){border-width: 2px 0px 2px 0px!important}
}

/* =========================================================
   SALENTOAGENCY - IMMOBILE GALLERY
========================================================= */

.immobile-gallery {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        258px;

    gap: 40px;

    width: 100%;
    max-width: 100%;

    padding: 20px;

    box-sizing: border-box;

    align-items: stretch;
}


/* =========================================================
   AREA PRINCIPALE
========================================================= */

.immobile-gallery__main {
    position: relative;

    width: 100%;
    min-width: 0;

    aspect-ratio: 3 / 2;

    overflow: hidden;

    background: #eeeeee;
}


/* =========================================================
   IMMAGINE IN EVIDENZA
========================================================= */

.immobile-gallery__featured {
    display: none;

    width: 100%;
    height: 100%;

    padding: 0;
    margin: 0;

    border: 0;

    appearance: none;

    background: transparent;

    cursor: zoom-in;
}


.immobile-gallery__featured.is-active {
    display: block;
}


.immobile-gallery__featured img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;
}


/* =========================================================
   VIEWER GALLERY
========================================================= */

.immobile-gallery__viewer {
    position: relative;

    display: none;

    width: 100%;
    height: 100%;

    overflow: hidden;

    background: #eeeeee;
}


.immobile-gallery__viewer.is-active {
    display: block;
}


/* =========================================================
   IMMAGINE CORRENTE
========================================================= */

.immobile-gallery__current {
    display: block;

    width: 100%;
    height: 100%;

    padding: 0;
    margin: 0;

    border: 0;

    appearance: none;

    background: transparent;

    cursor: zoom-in;

    overflow: hidden;
}


.immobile-gallery__current img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    opacity: 1;

    transition:
        opacity 0.2s ease,
        transform 0.35s ease;
}


@media (hover: hover) {

    .immobile-gallery__current:hover img {
        transform: scale(1.01);
    }

}


/* =========================================================
   FRECCE
========================================================= */

.immobile-gallery__arrow {
    position: absolute;

    z-index: 10;

    top: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    padding: 0;
    margin: 0;

    border: 0;
    border-radius: 50%;

    background: rgba(255, 255, 255, 0.92);

    color: #111111;

    font-size: 20px;
    line-height: 1;

    cursor: pointer;

    transform: translateY(-50%);

    box-shadow:
        0 3px 15px
        rgba(0, 0, 0, 0.18);

    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}


.immobile-gallery__arrow:hover {
    background: #ffffff;

    transform:
        translateY(-50%)
        scale(1.05);
}


.immobile-gallery__arrow--prev {
    left: 20px;
}


.immobile-gallery__arrow--next {
    right: 20px;
}


/* =========================================================
   CONTATORE IMMAGINE PRINCIPALE
========================================================= */

.immobile-gallery__counter {
    position: absolute;

    z-index: 10;

    left: 50%;
    bottom: 18px;

    transform: translateX(-50%);

    padding: 7px 12px;

    border-radius: 30px;

    background: rgba(0, 0, 0, 0.65);

    color: #ffffff;

    font-size: 13px;
    font-weight: 500;
    line-height: 1;

    white-space: nowrap;

    pointer-events: none;
}


/* =========================================================
   COLONNA MINIATURE
========================================================= */

/*
 * Le 3 miniature occupano esattamente
 * la stessa altezza complessiva dell'immagine grande.
 *
 * Ogni riga è IDENTICA alle altre.
 */

.immobile-gallery__thumbs {
    display: grid;

    grid-template-rows:
        repeat(3, minmax(0, 1fr));

    gap: 27px;

    width: 100%;
    height: 100%;

    min-width: 0;
    min-height: 0;

    align-self: stretch;
}


/* =========================================================
   SINGOLA MINIATURA
========================================================= */

/*
 * QUESTO contenitore determina la dimensione.
 *
 * L'immagine interna NON può modificarne
 * larghezza, altezza o proporzioni.
 */

.immobile-gallery__thumb {
    position: relative;

    display: block;

    width: 100%;
    height: 100%;

    min-width: 0;
    min-height: 0;

    padding: 0;
    margin: 0;

    border: 0;

    appearance: none;

    overflow: hidden;

    background: #eeeeee;

    cursor: pointer;
}


/* =========================================================
   IMMAGINE DELLA MINIATURA
========================================================= */

/*
 * IMPORTANTE:
 *
 * position:absolute impedisce alla dimensione
 * originale della foto di influenzare il layout.
 *
 * Quindi:
 *
 * foto verticale   -> rettangolo
 * foto quadrata    -> rettangolo
 * foto orizzontale -> rettangolo
 *
 * SEMPRE della stessa dimensione.
 */

.immobile-gallery__thumb img {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    max-width: none;
    max-height: none;

    margin: 0;
    padding: 0;

    object-fit: cover;
    object-position: center;

    transition:
        transform 0.35s ease;
}


@media (hover: hover) {

    .immobile-gallery__thumb:hover img {
        transform: scale(1.035);
    }

}


/* =========================================================
   OVERLAY MINIATURE
========================================================= */

.immobile-gallery__thumb-overlay {
    position: absolute;

    z-index: 1;

    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(0, 0, 0, 0.48) 0%,
            rgba(0, 0, 0, 0.10) 45%,
            rgba(0, 0, 0, 0) 100%
        );

    pointer-events: none;

    transition:
        background 0.25s ease;
}


/* Hover */

@media (hover: hover) {

    .immobile-gallery__thumb:hover
    .immobile-gallery__thumb-overlay {

        background:
            linear-gradient(
                to top,
                rgba(0, 0, 0, 0.55) 0%,
                rgba(0, 0, 0, 0.15) 50%,
                rgba(0, 0, 0, 0.03) 100%
            );
    }

}


/* Gallery selezionata */

.immobile-gallery__thumb.is-active
.immobile-gallery__thumb-overlay {

    background:
        linear-gradient(
            to top,
            rgba(0, 0, 0, 0.55) 0%,
            rgba(0, 0, 0, 0.20) 55%,
            rgba(0, 0, 0, 0.05) 100%
        );
}


/* =========================================================
   BORDO GALLERY ATTIVA
========================================================= */

/*
 * Il bordo viene disegnato internamente,
 * quindi NON modifica mai le dimensioni
 * della miniatura.
 */

.immobile-gallery__thumb.is-active::after {
    content: "";

    position: absolute;

    z-index: 5;

    inset: 0;

    border: 3px solid rgba(255, 255, 255, 0.95);

    box-sizing: border-box;

    pointer-events: none;
}


/* =========================================================
   LABEL MINIATURA
========================================================= */

.immobile-gallery__thumb-label {
    position: absolute;

    z-index: 3;

    left: 14px;
    bottom: 13px;

    color: #ffffff;

    font-size: 12px;
    font-weight: 600;
    line-height: 1;

    text-transform: uppercase;

    letter-spacing: 0.7px;

    pointer-events: none;
}


/* =========================================================
   NUMERO IMMAGINI MINIATURA
========================================================= */

.immobile-gallery__thumb-count {
    position: absolute;

    z-index: 3;

    right: 10px;
    bottom: 10px;

    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 26px;
    height: 26px;

    padding: 0 7px;

    box-sizing: border-box;

    border-radius: 30px;

    background: rgba(0, 0, 0, 0.65);

    color: #ffffff;

    font-size: 11px;
    font-weight: 600;
    line-height: 1;

    pointer-events: none;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px) {

    .immobile-gallery {
        grid-template-columns:
            minmax(0, 1fr)
            200px;

        gap: 20px;

        padding: 15px;
    }


    .immobile-gallery__thumbs {
        gap: 15px;
    }


    .immobile-gallery__thumb-label {
        left: 10px;
        bottom: 10px;

        font-size: 10px;
    }


    .immobile-gallery__thumb-count {
        right: 8px;
        bottom: 8px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .immobile-gallery {
        display: flex;

        flex-direction: column;

        width: 100%;

        gap: 10px;

        padding: 0;
    }


    /* =====================================================
       FOTO GRANDE
    ===================================================== */

    .immobile-gallery__main {
        width: 100%;

        aspect-ratio: 4 / 3;
    }


    /* =====================================================
       MINIATURE MOBILE
    ===================================================== */

    .immobile-gallery__thumbs {
        display: grid;

        grid-template-columns:
            repeat(3, minmax(0, 1fr));

        grid-template-rows: none;

        gap: 7px;

        width: 100%;
        height: auto;

        min-height: 0;

        align-self: auto;
    }


    /*
     * Anche su mobile manteniamo
     * tutte le thumbnail RETTANGOLARI.
     */

    .immobile-gallery__thumb {
        width: 100%;
        height: auto;

        aspect-ratio: 3 / 2;
    }


    /*
     * L'immagine resta assoluta e viene
     * ritagliata dentro il rettangolo.
     */

    .immobile-gallery__thumb img {
        position: absolute;

        inset: 0;

        width: 100%;
        height: 100%;

        object-fit: cover;
        object-position: center;
    }


    /* =====================================================
       FRECCE
    ===================================================== */

    .immobile-gallery__arrow {
        width: 40px;
        height: 40px;

        font-size: 17px;
    }


    .immobile-gallery__arrow--prev {
        left: 10px;
    }


    .immobile-gallery__arrow--next {
        right: 10px;
    }


    /* =====================================================
       CONTATORE PRINCIPALE
    ===================================================== */

    .immobile-gallery__counter {
        bottom: 10px;

        padding: 6px 9px;

        font-size: 11px;
    }


    /* =====================================================
       LABEL MINIATURE
    ===================================================== */

    .immobile-gallery__thumb-label {
        left: 7px;
        bottom: 7px;

        max-width: calc(100% - 14px);

        overflow: hidden;

        font-size: 9px;

        line-height: 1.1;

        letter-spacing: 0.2px;

        white-space: nowrap;

        text-overflow: ellipsis;
    }


    /* =====================================================
       CONTATORE MINIATURE
    ===================================================== */

    .immobile-gallery__thumb-count {
        top: 6px;
        right: 6px;
        bottom: auto;

        min-width: 22px;
        height: 22px;

        padding: 0 5px;

        font-size: 9px;
    }

}


/* =========================================================
   MOBILE PICCOLO
========================================================= */

@media (max-width: 480px) {

    .immobile-gallery {
        gap: 6px;
    }


    .immobile-gallery__thumbs {
        gap: 5px;
    }


    .immobile-gallery__arrow {
        width: 36px;
        height: 36px;

        font-size: 15px;
    }


    .immobile-gallery__thumb-label {
        font-size: 8px;
    }

}