@media (min-width: 279px) and (max-width: 823px) {
    /*elementi da nascondere*/
    .hidden-in-town-icon{
        display: none;
    }
    .inTownFilter.inTownItem.inTownDisappearAnim{  
        display: none !important;
    }
    img.icon-country{
        width: 40px;
        height: 40px;
    }
    p.in-town-text-feedback{
        background: rgb(26,192,252);
        color: rgb(255,255,255);
        width: 100vw;
        height: 3vh;
        top: 14vh;
        box-sizing: border-box;
        position: absolute;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 98;
        display: none;
    }
    #headerSideMobile{
        width: 100vw;
        height: 19vh;
        background: transparent;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999999;
    }
    .starting-header{
        width: 100vw;
        height: 7vh;
        position: fixed;
        top: 0;
        left: 0;
        background: transparent;
        z-index: 999;
    }
    img.logo{
        width: 40vw;
        left: 30vw;
        right: 30vw;
        position: absolute;
        top: 1.7vh;
        z-index: 999;
        margin: 0;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .location-title{
        width: calc(30vw - 4vw); /*4vw il margine da sx*/
        position: absolute;
        /*top: 2.5vh;*/
        top: 1.2vh;
        left: 4vw;
        font-size: 0.9em;
        font-weight: 400;
    }
    .menu-button-mobile-icon{
        font-size: 40px;
        font-weight: 100;
    }
    p.menu-button-mobile{
        width: calc(30vw - 4vw); /*4vw il margine da sx*/
        position: absolute;
        /*top: 2.5vh;*/
        top: 1.2vh;
        right: 4vw;
        font-size: 0.9em;
        font-weight: 400;
        text-align: right;
        z-index: 99999999;
    }
    /*inizio menu principale*/
    .main-menu-mobile{
        width: 100vw;
        height: 100vh;
        min-height: 100vh;
        box-sizing: border-box;
        position: fixed;
        top: 0;
        left: 0;
        background: rgb(255,255,255);
        display: none;
        z-index: 999999;
    }
    ul.listMenuTop{
        position: absolute;
        width: 100vw;
        min-width: 100vw;
        height: 30vh;
        box-sizing: border-box;
        top: 0;
        bottom: 0;
        left: 0;
        padding: 30px;
        margin-top: 35vh;
        margin-bottom: 35vh;
        list-style: none;
        display: grid;
        justify-content: right;
        align-items: center;
        min-height: unset;
        max-height: unset;
    }
    .listMenuItem{
        width: 100%;
        text-align: right;
        text-transform: capitalize;
        mix-blend-mode: normal !important;
    }

    /*fine gestione menu principale*/
    .division-container{
        width: 100vw;
        height: 5vh;
        background: rgb(255,255,255);
        border-top: 0.5px solid rgb(40,40,40);
        border-bottom: 0.5px solid rgb(40,40,40);
        box-sizing: border-box;
        position: absolute;
        top: 7vh;
        left: 0;
        z-index: 999;
        display: none !important;
    }
    .division-filter{
        width: calc((100vw / 3) - 10px);
        height: 5vh;
        margin-left: 5px;
        margin-right: 5px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.85em;
        letter-spacing: 0.5px;
        color: rgb(40,40,40);
        text-transform: uppercase;
    }
    .division-selected, .selected-division-item{
        color: rgb(26,192,252);
    }
    .icon-container{
        width: 100vw;
        height: 5vh;
        background: rgb(0,0,0);
        box-sizing: border-box;
        position: absolute;
        top: 12vh; /*somma di top dell'elemento precedente più la sua altezza*/
        left: 0;
        z-index: 999;
        display: none !important;
    }
    span.action-icon{
        float: left;
        width: calc((100vw / 4) - 10px);
        height: 5vh;
        margin-left: 5px;
        margin-right: 5px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5em;
        color: rgb(255,255,255);
    }
    .generic-gender-icon{
        padding-bottom: 10px;
    }
    /*GESTIONE DIV A SCOMPARSA*/
    .filter-container-mobile{
        position: absolute;
    }
    .division-container-mobile{
        width: 100vw;
        background: rgb(255,255,255);
        top: -50vh; /*17vh per rendere visibile sempre*/ /*-50vh per nasconderlo (somma di altezza e distanza top)*/
        height: 33vh;
        box-sizing: border-box;
        z-index: 99;
    }
    /*gestione singole voci division*/
    .division-item-container{
        width: 90vw;
        position: absolute;
        height: 17.5vh;
        top: 0;
        left: 5vw;
        z-index: 99;
        box-sizing: border-box;
    }
    .division-item{
        width: calc((90vw / 3) - 10px);
        margin-left: 5px;
        margin-right: 5px;
        height: 5.83vh;
        background: rgb(255,255,255);
        display: grid;
        justify-content: left;
        align-items: center;
        justify-items: center;
        text-transform: uppercase;
        font-size: 0.8em;
        letter-spacing: 0.5px;
    }
    /*gestione pulsante pulizia division filter*/
    .remove-division-filter{
        position: absolute;
        top: 17.5vh;
        width: calc(100vw - 10px);
        height: 7vh;
        margin-top: 0;
        background: rgb(255,255,255);
        font-size: 0.9em;
        display: flex;
        justify-content: center;
        align-items: center;
        color: rgb(220,220,220);
        letter-spacing: 1.5px;
        text-transform: uppercase;
        /*display: none;*/ /*deve comparire solo ed esclusivamente se è presente un filter attivo*/
    }
    .gender-container-mobile{
        width: 100vw;
        background: rgb(255,255,255);
        top: -50vh; /*17vh per rendere visibile sempre*/ /*-50vh per nasconderlo (somma di altezza e distanza top)*/
        height: 33vh;
        box-sizing: border-box;
        z-index: 99;
    }
    .gender-item{
        width: calc((100vw / 3) - 10px);
        margin-left: 5px;
        margin-right: 5px;
        height: 7vh;
        margin-top: calc((33vh - 14vh) / 2);
        background: rgb(255,255,255);
        display: grid;
        justify-content: center;
        align-items: center;
        justify-items: center;
    }
    /*gestione icone gender*/
    .gender-symbol-icon{
        width: 100%;
        font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 0, 'opsz' 24;
        cursor: pointer;
        transition: 0.2s;
        height: fit-content;
        margin-bottom: 0;
        border-radius: 0;
        margin-left: 0;
        font-size: 2em;
    }
    /*gestione icona selezionata*/
    .selectedGender {
        background: rgb(26,192,252);
        color: rgb(250,250,250);
        opacity: 0.8;
    }
    /*gestione eliminazione filtri*/
    .remove-gender-filter{
        width: calc(100vw - 10px);
        height: 7vh;
        margin-top: 0;
        background: rgb(255,255,255);
        font-size: 0.9em;
        display: flex;
        justify-content: center;
        align-items: center;
        color: rgb(220,220,220);
        text-transform: uppercase;
        letter-spacing: 1.5px;
        /*display: none;*/ /*deve comparire solo ed esclusivamente se è presente un filter attivo*/
        display: flex;
    }
    .closing-button-container{
        width: 100vw;
        position: absolute;
        height: 8.5vh;
        cursor: pointer;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content : center;
    }
    span.hide-filter-container-button{
        color: rgb(90,90,90);
        transform: rotate(90deg);
    }

    /*gestione search-bar*/
    input.search-bar{
        position: absolute;
        top: 0;
        height: calc(5vh - 10px);
        box-sizing: border-box;
        left: calc((100vw / 4) - 10px);
        right: 10vw;
        /*width: calc(90vw - ((100vw / 4) - 10px));*/
        width: 0;
        background: rgb(0,0,0);
        margin-top: 5px;
        margin-bottom: 5px;
        border: none;
        border-bottom: 0.5px solid rgb(255,255,255);
        color: rgb(255,255,255);
        font-size: 0.9em;
        font-weight: 300;
        font-family: 'Poppins', sans-serif;
        letter-spacing: 1px;
        /*padding: 3px;*/
        padding: 0px;
    }
}