/*
body {
    
    display: flex;
    background-color: #fff;

    width: 100%;
}
*/



/*############################################################   MAPPE   ############################################################*/


#map_base {
    padding: 2px;
    border-width: 1px;
    border-style: solid;
    border-right-color: #000;
    height: 400px;
    width: 100%;
}

/*############################################################   PANNELLI  ############################################################*/
.subsection_ON {
    display: flex;
    justify-content: space-around;
}

.subsection_OFF {
    display: none;
}

.subsection_one_ON { /* Occhio, questo evita che si comprimano gli oggetti! */
    display: flex;
    justify-content: space-between;
}


.button_on {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



.subsection_ON_1 {
    /*  VA SU TRIB_MOSTRA GEN E ALTRO

    /*display:inline-flex; --> assolutamente no */
    display: flex;
    justify-content: space-around;
    height: fit-content;
}

@media all and (max-width:1000px) { /* occhio a seconda del dispositivo */

    .subsection_ON_1 {
        display: inline;
    }
}



.subsection_park_ON {
    display: flex;
    justify-content: space-between;
}


.subsection_gdp_ON {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.subsection_sub_gdp_ON {
    display: inline-table;
}








/* ############################################################  TASTI  ############################################################*/

/*          G E N E R A L E         */

#buttons_general {
    display: flex;
    flex-direction: column;
}

#trib, #unep, #gdp {
    margin-top: 5px;
    margin-bottom: 10px;
    height: 2em;
    font-size: 25px;
    color: #FFF;
    background-color: #003366;
    border-radius: 10px;
    border-style: solid;
    border-color: #000;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

    #trib:hover, #unep:hover, #gdp:hover {
        box-shadow: inset 10em 10em #FFF;
        color: #003366;
        cursor: pointer;
    }

#display_gdp {
    display: inline;
}

/* \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ TRIBUNALE 
/* ############################################################ SEZIONE AUTO ########################################################### */
/* ############################################################ SEZIONE AUTO ########################################################### */
/* ############################################################ SEZIONE AUTO ########################################################### */
/* ############################################################ SEZIONE AUTO ########################################################### */
/* ############################################################ SEZIONE AUTO ########################################################### */


#trib_auto {
    background-image: url("auto(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;

}

    #trib_auto:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        font-weight: 600;
        cursor: pointer;
    }




/* SOTTO SEZIONI    TRIB    */



#trib_aurelia_nord, #trib_aurelia_sud, #trib_parcheggio {
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#trib_aurelia_nord, #trib_aurelia_sud {
    background-color: #fff;
    color: #000;
}


    #trib_aurelia_nord:hover,
    #trib_aurelia_sud:hover,
    #trib_parcheggio:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }

/* PARCHEGGIO */

#trib_parcheggio {
    background-image: url("park.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1.5em;
    padding-right: 0.1em;
    padding-left: 0.1em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#trib_parcheggio_gratuito, #trib_parcheggio_pagamento {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#trib_parcheggio_gratuito, #trib_parcheggi_disabili {
    color: #000;
    background-color: #fff;
}

#trib_parcheggi_disabili {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
}


#trib_parcheggio_pagamento {
    color: #fff;
    background-color: blue;
}

#trib_parcheggi_disabili input {
    list-style: none;
    color: #000;
    text-decoration: none;
}

#trib_parcheggi_disabili:hover,
#trib_parcheggio_gratuito:hover,
#trib_parcheggio_pagamento:hover {
    cursor: pointer
}




/* ############################################################ SEZIONE BUS ########################################################### */
/* ############################################################ SEZIONE BUS ########################################################### */
/* ############################################################ SEZIONE BUS ########################################################### */
/* ############################################################ SEZIONE BUS ########################################################### */
/* ############################################################ SEZIONE BUS ########################################################### */


#trib_bus {
    background-image: url("bus(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#trib_fermate,
#trib_bus_disabili,
#trib_linee {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    /*margin-bottom: 10px; */
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#sbibbiana, #sighieri, #mediceo, #garibaldi {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#trib_bus_disabili a, #trib_linee a {
    list-style: none;
    text-decoration: none;
}

    #trib_bus_disabili a:hover, #trib_linee a:hover {
        color: #6f6f6f;
    }

#trib_bus:hover,
#trib_fermate:hover,
#trib_linee:hover,
#sbibbiana:hover,
#sighieri:hover,
#mediceo:hover,
#garibaldi:hover,
#trib_bus_disabili:hover {
    box-shadow: inset 8em 8em #f29200;
    color: #6f6f6f;
    /*
    font-size: 1.25em;
    */
    font-weight: 800;
    cursor: pointer;
}



/* ############################################################ SEZIONE TRENO ########################################################### */
/* ############################################################ SEZIONE TRENO ########################################################### */
/* ############################################################ SEZIONE TRENO ########################################################### */
/* ############################################################ SEZIONE TRENO ########################################################### */
/* ############################################################ SEZIONE TRENO ########################################################### */

#trib_treno {
    background-image: url("treno(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#trib_fermata_stazione,
#trib_a_piedi_stazione,
#trib_chiamata_taxi_staz {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}
    /*
#trib_superiore_treno {
    display: flex;
    
    justify-content: space-between;
    
}
*/

    #trib_treno:hover, #trib_fermata_stazione:hover, #trib_a_piedi_stazione:hover, #trib_chiamata_taxi_staz:hover {
        box-shadow: inset 8em 8em #ff0000;
        color: #e0e0eb;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }




/* ############################################################ SEZIONE AEREO ########################################################### */
/* ############################################################ SEZIONE AEREO ########################################################### */
/* ############################################################ SEZIONE AEREO ########################################################### */
/* ############################################################ SEZIONE AEREO ########################################################### */
/* ############################################################ SEZIONE AEREO ########################################################### */



#trib_aereo {
    background-image: url("aereo(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

    #trib_aereo:hover {
        box-shadow: inset 8em 8em #63d5f7;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }






#trib_fermata_aeroporto, #trib_chiamata_taxi_aerop {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #trib_fermata_aeroporto:hover, #trib_chiamata_taxi_aerop:hover {
        box-shadow: inset 8em 8em #63d5f7;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
    }

























/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%               U   N   E   P       %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/



/*  UNEP --> AUTO ]]]]]]]]]]] */

#unep_auto {
    background-image: url("auto(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #unep_auto:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        font-size: 1.25em;
        font-weight: 600;
        cursor: pointer;
    }




#unep_aurelia_nord, #unep_aurelia_sud, #unep_parcheggio {
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#unep_aurelia_nord, #unep_aurelia_sud {
    background-color: #fff;
}

#unep_parcheggio {
    background-image: url("park.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1.5em;
    padding-right: 0.1em;
    padding-left: 0.1em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #unep_aurelia_nord:hover,
    #unep_aurelia_sud:hover,
    #unep_parcheggio:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


#unep_parcheggio_gratuito,
#unep_parcheggio_gratuito_1 {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#unep_parcheggio_gratuito,
#unep_parcheggio_gratuito_1,
#unep_parcheggi_disabili {
    color: #000;
    background-color: #fff;
}

#unep_parcheggi_disabili {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
}



    #unep_parcheggi_disabili input {
        list-style: none;
        color: #000;
        text-decoration: none;
    }

    #unep_parcheggi_disabili:hover,
    #unep_parcheggio_gratuito:hover,
    #unep_parcheggio_gratuito_1:hover {
        cursor: pointer
    }



/* ############################################################ SEZIONE BUS UNEP########################################################### */
/* ############################################################ SEZIONE BUS UNEP########################################################### */
/* ############################################################ SEZIONE BUS UNEP########################################################### */



#unep_bus {
    background-image: url("bus(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#unep_fermate {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#unep_coop,
#unep_valgimigli,
#unep_luzzatto,
#unep_de_ruggiero {
    background-color: #fff;
    color: #000;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#unep_bus_disabili, #unep_linee {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    background-color: #fff;
}

    #unep_bus_disabili a, #unep_linee a {
        list-style: none;
        color: #000;
        text-decoration: none;
    }

        #unep_bus_disabili a:hover, #unep_linee a:hover {
            color: #6f6f6f;
        }

    #unep_bus:hover,
    #unep_fermate:hover,
    #unep_linee:hover,
    #unep_coop:hover,
    #unep_valgimigli:hover,
    #unep_luzzatto:hover,
    #unep_de_ruggiero:hover,
    #unep_bus_disabili:hover {
        box-shadow: inset 8em 8em #f29200;
        color: #6f6f6f;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }



/* ############################################################ SEZIONE TRENO UNEP ########################################################### */
/* ############################################################ SEZIONE TRENO UNEP ########################################################### */
/* ############################################################ SEZIONE TRENO UNEP ########################################################### */

#unep_treno {
    background-image: url("treno(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#unep_fermata_stazione,
#unep_a_piedi_stazione,
#unep_chiamata_taxi_staz {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #unep_treno:hover,
    #unep_fermata_stazione:hover,
    #unep_a_piedi_stazione:hover,
    #unep_chiamata_taxi_staz:hover {
        box-shadow: inset 8em 8em #ff0000;
        color: #e0e0eb;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


























/*£££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££
£££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££
£££££££££££££££££££££££££££     G I U D I C I   D I    P A C E          ££££££££££££££££££££££££££££££££££££££££££££££££££££££
££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££££ */


/* TASTI DELLE SEZIONI */



#gdp_PI,
#gdp_PO,
#gdp_SM,
#gdp_V {
    margin-top: 10px;
    margin-bottom: 5px;
    min-height: 100px;
    font-size: 20px;
    font-weight: 600;
    background-color: #fff;
    border-radius: 5px;
    border-style: solid;
    border-color: #000;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

    #gdp_PI:hover, #gdp_PO:hover, #gdp_SM:hover, #gdp_V:hover {
        box-shadow: inset 10em 10em #00fd22;
        color: #fff;
        /*
    font-size: 1.6em;
    */
        font-weight: 600;
        cursor: pointer;
    }







/*  G I U D I C E   D I     P A C E  -->   P I S A */

/* --< AUTOOOOOOO */


#gdp_pi_auto {
    background-image: url("auto(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_pi_auto:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        font-size: 1.25em;
        font-weight: 600;
        cursor: pointer;
    }



#gdp_pi_aurelia_nord,
#gdp_pi_aurelia_sud,
#gdp_pi_parcheggio {
    margin-top: 1em;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_pi_aurelia_nord, #gdp_pi_aurelia_sud {
    background-color: #fff;
}

#gdp_pi_parcheggio {
    background-image: url("park.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1.5em;
    padding-right: 0.1em;
    padding-left: 0.1em;
    font-size: 20px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_pi_aurelia_nord:hover,
    #gdp_pi_aurelia_sud:hover,
    #gdp_pi_parcheggio:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


#gdp_pi_parcheggio_gratuito,
#gdp_pi_parcheggio_pagamento,
#gdp_pi_parcheggi_disabili {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_pi_parcheggio_gratuito, #gdp_pi_parcheggi_disabili {
    color: #000;
    background-color: #fff;
}




#gdp_pi_parcheggio_pagamento {
    color: #fff;
    background-color: blue;
}

#gdp_pi_parcheggi_disabili input {
    list-style: none;
    color: #000;
    text-decoration: none;
}

#gdp_pi_parcheggi_disabili:hover, #gdp_pi_parcheggio_gratuito:hover, #gdp_pi_parcheggio_pagamento:hover {
    cursor: pointer
}


/* ############################################################ SEZIONE BUS GDP PI ########################################################### */
/* ############################################################ SEZIONE BUS GDP PI ########################################################### */
/* ############################################################ SEZIONE BUS GDP PI ########################################################### */


#gdp_pi_bus {
    background-image: url("bus(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#gdp_pi_fermate {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_pi_mediceo_1,
#gdp_pi_pacinotti_3,
#gdp_pi_sbibbiana {
    background-color: #fff;
    color: #000;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#gdp_pi_bus_disabili, #gdp_pi_linee {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    background-color: #fff;
}

    #gdp_pi_bus_disabili a, #gdp_pi_linee a {
        list-style: none;
        color: #000;
        text-decoration: none;
    }

        #gdp_pi_bus_disabili a:hover, #gdp_pi_linee a:hover {
            color: #6f6f6f;
        }

    #gdp_pi_bus:hover,
    #gdp_pi_fermate:hover,
    #gdp_pi_linee:hover,
    #gdp_pi_mediceo_1:hover,
    #gdp_pi_pacinotti_3:hover,
    #gdp_pi_sbibbiana:hover,
    #gdp_pi_bus_disabili:hover {
        box-shadow: inset 8em 8em #f29200;
        color: #6f6f6f;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


/* ############################################################ SEZIONE TRENO GDP PI ########################################################### */
/* ############################################################ SEZIONE TRENO GDP PI ########################################################### */
/* ############################################################ SEZIONE TRENO GDP PI ########################################################### */

#gdp_pi_treno {
    background-image: url("treno(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_pi_fermata_stazione,
#gdp_pi_a_piedi_stazione,
#gdp_pi_chiamata_taxi_staz {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_pi_treno:hover,
    #gdp_pi_fermata_stazione:hover,
    #gdp_pi_a_piedi_stazione:hover,
    #gdp_pi_chiamata_taxi_staz:hover {
        box-shadow: inset 8em 8em #ff0000;
        color: #e0e0eb;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }















/*  G I U D I C E   D I     P A C E  -->   P O N T E D E R A */

/* --< AUTOOOOOOO */


#gdp_po_auto {
    background-image: url("auto(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_po_auto:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        font-size: 1.25em;
        font-weight: 600;
        cursor: pointer;
    }





#gdp_po_fi_pi_li,
#gdp_po_tosco_romagnola,
#gdp_po_parcheggio {
    margin-top: 1em;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_po_fi_pi_li,
#gdp_po_tosco_romagnola {
    background-color: #fff;
}

#gdp_po_parcheggio {
    background-image: url("park.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1.5em;
    padding-right: 0.1em;
    padding-left: 0.1em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_po_fi_pi_li:hover,
    #gdp_po_tosco_romagnola:hover,
    #gdp_po_parcheggio:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


#gdp_po_parcheggio_gratuito,
#gdp_po_parcheggio_pagamento,
#gdp_po_parcheggi_disabili {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_po_parcheggio_gratuito, #gdp_po_parcheggi_disabili {
    color: #000;
    background-color: #fff;
}


#gdp_po_parcheggio_pagamento {
    color: #fff;
    background-color: blue;
}

#gdp_po_parcheggi_disabili input {
    list-style: none;
    color: #000;
    text-decoration: none;
}

#gdp_po_parcheggi_disabili:hover, #gdp_po_parcheggio_gratuito:hover, #gdp_po_parcheggio_pagamento:hover {
    cursor: pointer
}


/* ############################################################ SEZIONE BUS GDP Po ########################################################### */
/* ############################################################ SEZIONE BUS GDP Po ########################################################### */
/* ############################################################ SEZIONE BUS GDP Po ########################################################### */


#gdp_po_bus {
    background-image: url("bus(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#gdp_po_fermate, #gdp_po_bus_disabili, #gdp_po_linee {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_po_piazza_gronchi,
#gdp_po_duomo,
#gdp_po_viale_risorgimento {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_po_bus_disabili a, #gdp_po_linee a {
    list-style: none;
    color: #000;
    text-decoration: none;
}

    #gdp_po_bus_disabili a:hover, #gdp_po_linee a:hover {
        color: #6f6f6f;
    }

#gdp_po_bus:hover,
#gdp_po_fermate:hover,
#gdp_po_linee:hover,
#gdp_po_piazza_gronchi:hover,
#gdp_po_duomo:hover,
#gdp_po_viale_risorgimento:hover,
#gdp_po_bus_disabili:hover {
    box-shadow: inset 8em 8em #f29200;
    color: #6f6f6f;
    /*
    font-size: 1.25em;
    */
    font-weight: 800;
    cursor: pointer;
}


/* ############################################################ SEZIONE TRENO GDP Po ########################################################### */
/* ############################################################ SEZIONE TRENO GDP Po ########################################################### */
/* ############################################################ SEZIONE TRENO GDP Po ########################################################### */

#gdp_po_treno {
    background-image: url("treno(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_po_fermata_stazione,
#gdp_po_a_piedi_stazione,
#gdp_po_chiamata_taxi_staz {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_po_treno:hover,
    #gdp_po_fermata_stazione:hover,
    #gdp_po_a_piedi_stazione:hover,
    #gdp_po_chiamata_taxi_staz:hover {
        box-shadow: inset 8em 8em #ff0000;
        color: #e0e0eb;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }








/*  G I U D I C E   D I     P A C E  -->   S A N   M I N I A T O */

/* --< AUTOOOOOOO */


#gdp_sm_auto {
    background-image: url("auto(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_sm_auto:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        /*
    font-size: 1.25em;
    */
        font-weight: 600;
        cursor: pointer;
    }






#gdp_sm_fi_pi_li_pisa,
#gdp_sm_fi_pi_li_firenze,
#gdp_sm_parcheggio {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_sm_fi_pi_li_pisa, #gdp_sm_fi_pi_li_firenze {
    background-color: #fff;
}

#gdp_sm_parcheggio {
    background-image: url("park.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1.5em;
    padding-right: 0.1em;
    padding-left: 0.1em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_sm_fi_pi_li_pisa:hover,
    #gdp_sm_fi_pi_li_firenze:hover,
    #gdp_sm_parcheggio:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


#gdp_sm_parcheggio_gratuito,
#gdp_sm_parcheggio_pagamento,
#gdp_sm_parcheggi_disabili {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_sm_parcheggio_gratuito, #gdp_sm_parcheggi_disabili {
    color: #000;
    background-color: #fff;
}


#gdp_sm_parcheggio_pagamento {
    color: #fff;
    background-color: blue;
}

#gdp_sm_parcheggi_disabili input {
    list-style: none;
    color: #000;
    text-decoration: none;
}

#gdp_sm_parcheggi_disabili:hover,
#gdp_sm_parcheggio_gratuito:hover,
#gdp_sm_parcheggio_pagamento:hover {
    cursor: pointer
}


/* ############################################################ SEZIONE BUS GDP SM########################################################### */
/* ############################################################ SEZIONE BUS GDP SM ########################################################### */
/* ############################################################ SEZIONE BUS GDP SM ########################################################### */


#gdp_sm_bus {
    background-image: url("bus(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_sm_fermate {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_sm_piazza_buonaparte,
#gdp_sm_municipio,
#gdp_sm_piazza_repubblica {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#gdp_sm_bus_disabili, #gdp_sm_linee {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    background-color: #fff;
}

    #gdp_sm_bus_disabili a, #gdp_sm_linee a {
        list-style: none;
        color: #000;
        text-decoration: none;
    }

        #gdp_sm_bus_disabili a:hover, #gdp_sm_linee a:hover {
            color: #6f6f6f;
        }

    #gdp_sm_bus:hover,
    #gdp_sm_fermate:hover,
    #gdp_sm_linee:hover,
    #gdp_sm_piazza_buonaparte:hover,
    #gdp_sm_municipio:hover,
    #gdp_sm_piazza_repubblica:hover,
    #gdp_sm_bus_disabili:hover {
        box-shadow: inset 8em 8em #f29200;
        color: #6f6f6f;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


/* ############################################################ SEZIONE TRENO GDP SM ########################################################### */
/* ############################################################ SEZIONE TRENO GDP SM ########################################################### */
/* ############################################################ SEZIONE TRENO GDP SM ########################################################### */

#gdp_sm_treno {
    background-image: url("treno(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_sm_fermata_stazione, #gdp_sm_a_piedi_stazione, #gdp_sm_chiamata_taxi_staz {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



    #gdp_sm_treno:hover, #gdp_sm_fermata_stazione:hover, #gdp_sm_a_piedi_stazione:hover, #gdp_sm_chiamata_taxi_staz:hover {
        box-shadow: inset 8em 8em #ff0000;
        color: #e0e0eb;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }













/*  G I U D I C E   D I     P A C E  -->   V O L T E R R A */



/* --< AUTOOOOOOO */


#gdp_v_auto {
    background-image: url("auto(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_v_auto:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        font-size: 1.25em;
        font-weight: 600;
        cursor: pointer;
    }



#gdp_v_aurelia,
#gdp_v_fi_pi_li,
#gdp_v_parcheggio {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_v_aurelia, #gdp_v_fi_pi_li {
    background-color: #fff;
}

#gdp_v_parcheggio {
    background-image: url("park.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 1.5em;
    padding-right: 0.1em;
    padding-left: 0.1em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #gdp_v_aurelia:hover,
    #gdp_v_fi_pi_li:hover,
    #gdp_v_parcheggio:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


#gdp_v_parcheggio_gratuito,
#gdp_v_parcheggio_pagamento,
#gdp_v_parcheggi_disabili {
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_v_parcheggio_gratuito, #gdp_v_parcheggi_disabili {
    color: #000;
    background-color: #fff;
}


#gdp_v_parcheggio_pagamento {
    color: #fff;
    background-color: blue;
}

#gdp_v_parcheggi_disabili input {
    list-style: none;
    color: #000;
    text-decoration: none;
}

#gdp_v_parcheggi_disabili:hover,
#gdp_v_parcheggio_gratuito:hover,
#gdp_v_parcheggio_pagamento:hover {
    cursor: pointer
}


/* ############################################################ SEZIONE BUS GDP V  ########################################################### */
/* ############################################################ SEZIONE BUS GDP V  ########################################################### */
/* ############################################################ SEZIONE BUS GDP V  ########################################################### */


#gdp_v_bus {
    background-image: url("bus(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_v_fermate {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    ;
}



#gdp_v_piazza_martiri,
#gdp_v_san_michele,
#gdp_v_viale_lorenzini {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


#gdp_v_bus_disabili, #gdp_v_linee {
    margin-top: 10px;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
    background-color: #fff;
}

    #gdp_v_bus_disabili a, #gdp_v_linee a {
        list-style: none;
        color: #000;
        text-decoration: none;
    }

        #gdp_v_bus_disabili a:hover, #gdp_v_linee a:hover {
            color: #6f6f6f;
        }

    #gdp_v_bus:hover,
    #gdp_v_fermate:hover,
    #gdp_v_linee:hover,
    #gdp_v_piazza_martiri:hover,
    #gdp_v_san_michele:hover,
    #gdp_v_viale_lorenzini:hover,
    #gdp_v_bus_disabili:hover {
        box-shadow: inset 8em 8em #f29200;
        color: #6f6f6f;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


/* ############################################################ SEZIONE TRENO GDP Po ########################################################### */
/* ############################################################ SEZIONE TRENO GDP Po ########################################################### */
/* ############################################################ SEZIONE TRENO GDP Po ########################################################### */

#gdp_v_treno {
    background-image: url("treno(PIXABAY).png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 10em;
    margin-top: 10px;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



#gdp_v_fermata_stazione,
#gdp_v_a_piedi_stazione,
#gdp_v_chiamata_taxi_staz {
    background-color: #fff;
    color: #000;
    margin-top: 10px;
    margin-bottom: 1.3em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}



    #gdp_v_treno:hover,
    #gdp_v_fermata_stazione:hover,
    #gdp_v_a_piedi_stazione:hover,
    #gdp_v_chiamata_taxi_staz:hover {
        box-shadow: inset 8em 8em #ff0000;
        color: #e0e0eb;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }





























/* ############################################################ POSIZIONE GENERALE ########################################################### */



/* QUELLI PICCOLI */


#trib_pos,
#unep_pos,
#gdp_pi_pos,
#gdp_po_pos,
#gdp_sm_pos,
#gdp_v_pos {
    background-color: #fff;
    color: #000;
    margin-top: 1em;
    padding: 2.5em;
    padding-right: 1em;
    padding-left: 1em;
    border-radius: 10px;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}

#gdp_pi_pos,
#gdp_po_pos,
#gdp_sm_pos,
#gdp_v_pos {
    margin-bottom: 1.3em;
}

    #trib_pos:hover,
    #unep_pos:hover,
    #gdp_pi_pos:hover,
    #gdp_po_pos:hover,
    #gdp_sm_pos:hover,
    #gdp_v_pos:hover {
        box-shadow: inset 8em 8em #1504f8;
        color: #fff;
        /*
    font-size: 1.25em;
    */
        font-weight: 800;
        cursor: pointer;
    }


/*  QUELLI GRANDI   */


#trib_pos_BIG,
#unep_pos_BIG,
#gdp_pi_pos_BIG,
#gdp_po_pos_BIG,
#gdp_sm_pos_BIG,
#gdp_v_pos_BIG {
    background-image: url("puntatore.png");
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: 10px;
    width: 10em;
    padding: 3em;
    padding-right: 2em;
    padding-left: 2em;
    font-size: 20px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: transparent;
    transition-duration: 0.4s;
    transition-delay: 0.1s;
}


    #trib_pos_BIG:hover,
    #unep_pos_BIG:hover,
    #gdp_pi_pos_BIG:hover,
    #gdp_po_pos_BIG:hover,
    #gdp_sm_pos_BIG:hover,
    #gdp_v_pos_BIG:hover {
        box-shadow: inset 10em 10em #0ffc03;
        color: #000;
        font-size: 1.25em;
        font-weight: 600;
        cursor: pointer;
    }