/* ///////////////////
    TABLET 
/////////////////// */
@media only screen and (max-width: 1250px) {
    .lavori__legenda-progetto, .lavori__lavoro-progetto{
        width: 85%;
        margin-top: 0px;
    }

    .lavori__legenda-servizi, .lavori__lavoro-servizi{
        display: none;
    }

    .project-hover {
        color: rgb(0, 0, 0);
    }

    .lavori__legenda-settore, .lavori__lavoro-settore{
        display: none;
    }

    .lavori__legenda-stato, .lavori__lavoro-stato{
        display: none;
    }

    .lavori__legenda-anno, .lavori__lavoro-anno{
        text-align: right;
        width: 15%;
    }

    .lavori__lavoro-testo{
        width: 100%;
    }
}

/* ///////////////////
    MOBILE 
/////////////////// */

@media only screen and (max-width: 768px) {
    .desktop{
        display: none;
    }
    .mobile{
        display: block;
    }
    .logo{
        margin-right: 20px;
    }
    .menu{
        line-height: 19px;
        align-items: center;
        z-index: 9999999;
        
    }

    .menu__caricamento{
        width: calc(50% - 10px);
        font-weight: 500;
        position: fixed;
        left:10px;
        top: 10px;
        color: rgb(146, 146, 146);
        display: flex;
        flex-direction: row;
        z-index: 9999999;
        line-height: 19px;
        align-items: center;
        font-size: 12px;
    }
    .menu__caricamento a{
        text-decoration: none;
        color: rgb(146, 146, 146);
    }
    
    html{
        background-color: #fefcec;
    }

    main{
        width: 100vw;
        height: auto;
        box-sizing: border-box;
        position: relative;
        font-family: "DM Sans", Helvetica, sans-serif;
        font-size: 12px;
        line-height: 14px;
        display: block;
        background-color: #fefcec;

    }
    .main__left{
        display: none;
    }
    
    .main__center{
        width: 100%;
        height: auto;
        position: relative;
        box-sizing: border-box;
        padding: 80px 20px 0 0;
        overflow-y: scroll;
    }

    .main__center-index{
        width: 100%;
        padding-right: 0px;
    }
    
    .main__center__width{
        max-width: 900px;
    }
    
    .main__right{
        width: 100%;
        height: auto;
    }

    a:hover {
        font-style: italic; /* cambia in italic */
        color: black;
    }
    
    .wiggle:hover {
        font-style: italic; /* cambia in italic */
        color: black;
    }


/*-----------------------------------
    MENU
-----------------------------------*/
    .menu a:hover{
        font-style: italic; /* cambia in italic */
        color: #27ae60; /* verde smeraldo */
    }
    
    .menu a:hover{
        font-style:normal;
        color: black;
    }
    
    .menu a.active:hover{
        color: black;
    }
/*-----------------------------------
    CONTATTTI
-----------------------------------*/
.contatti{
    margin-top: 40px;
}


/*-----------------------------------
    SERVIZI
-----------------------------------*/

    .servizi__tags{
        grid-template-columns: repeat(2,1fr);
    
    }


/*-----------------------------------
    PICTUREMOBILE
-----------------------------------*/
    .picture__mobile{
        width: 100vw;
        height: 100vh;
        position: fixed;
        background-color: rgba(254, 252, 236, 0.8); /* 50% di opacità */
        top: 0;
        left: 0;
        display: none;
        justify-content: center;
        align-items: center;
        z-index: 999999;
    }
    .picture__mobile img{
        width: 80%;
    }

/*-----------------------------------
    COLLABORAZIONI
-----------------------------------*/

    .collab-images{
        width: 100vw;
        height: 100vh;
        position: fixed;
        background-color: rgba(254, 252, 236, 0.8); /* 50% di opacità */
        top: 0;
        left: 0;
        display: none;
        justify-content: center;
        align-items: center;
        z-index: 9999999;
    }

    .collab-img{
        display: none;
        transition: opacity 0.3s ease;
    }

    .collab-images img{
        width: 80%;
    }

/*-----------------------------------
    INDEX
-----------------------------------*/
    .lavori{
        padding-bottom: 40px;
    }
    .lavori__legenda-progetto, .lavori__lavoro-progetto{
        width: 85%;
        margin-top: 0px;
    }

    .lavori__legenda-servizi, .lavori__lavoro-servizi{
        display: none;
    }

    .project-hover {
        color: rgb(0, 0, 0);
    }

    .lavori__legenda-settore, .lavori__lavoro-settore{
        display: none;
    }

    .lavori__legenda-stato, .lavori__lavoro-stato{
        display: none;
    }

    .lavori__legenda-anno, .lavori__lavoro-anno{
        text-align: right;
        width: 15%;
    }

    .lavori__lavoro-testo{
        width: 100%;
    }

    .project-hover {
        color: black;
    }
    
    .service-hover {
        color: black;
    }
    .sector-hover {
        color: black;
    }
    
    .status-hover {
        color: black;
    }
    
    .year-hover {
        color: black;
    }


/*-----------------------------------
    IN THE END
-----------------------------------*/
    .intheend{
        position: relative;
        padding-bottom: 50px;
    }

/*-----------------------------------
    FOOTER
-----------------------------------*/
    .footer{
        height: 60px;
        align-items:flex-end;
    }
    .footer p{
        margin-bottom: 0px;
    }

    .footer__frasi{
        position: absolute;
        right: 0;
        bottom: 30px;
    }

    .footer__contenuo{
        position: absolute;
        right: 0;
        bottom: 10px;
    }

    .footer__contenuto__icona{
        position: absolute;
        left: 10PX;
    }

}