.elencoProdttiList{
    width: 100%;
}

.elencoProdttiList .containerProdotto{

    box-sizing: border-box;

    display: grid;
    grid-template-areas: "dati dati scheda";
    width: 100%;

    background-color: #FFF;
    gap: 0.5rem;
    margin-bottom: 1rem;

    border-top-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}


.elencoProdttiList .dati{

    width: 100%;

    box-sizing: border-box;
    padding: 0.5rem;

    grid-area: dati;
    
    display: grid;
    grid-template-rows: auto auto;
    gap: 0.5rem;

    /*background-color:#Cf5;*/
}




.elencoProdttiList .dati .info{
    display:grid;
    grid-template-columns: 1fr 1fr;
    

    height: 50px;
}


.elencoProdttiList .dati .info .nome{
    font-size : 2rem;
}

.elencoProdttiList .dati .info .allegati{
    place-self: center right;
}



.elencoProdttiList .dati .immagini{
    box-sizing: border-box;
    display: grid;

    gap: 1rem;
    grid-template-columns:  1fr 1fr;

}

.elencoProdttiList .dati .immagini img{
    width: clamp( 100px, 30wv, 200px );
}


.elencoProdttiList .scheda{

    box-sizing: border-box;
    grid-area: scheda;
    display: grid;
    width: 350px;
    grid-template-columns: 1fr 2fr;
    place-self: right center;
    background-color:#F4F4F4;
    box-sizing: border-box;
    padding: 1rem;
    display: grid;
    line-height: 1.5rem;
}

.elencoProdttiList .scheda .titolo{

    font-weight: bold;
    
}


.img_descrizione_ricerca{

    max-width: 1fr;
    height: auto;

}


#riassunto, #riassunto_mobile{
    margin-top:1rem;
    box-sizing: border-box;
    display:grid;
    grid-template-columns: repeat( 7,1fr );
    
    font-size: 0.8rem;
    gap:2px;
    
    place-items:left start;
    
}

#riassunto .head, #riassunto_mobile .head{
    font-size:0.9rem;
    color:#FFF;
    background-color:#444;
    font-weight:700;
    
    position:sticky;
    top:60px;
}

#riassunto div, #riassunto_mobile div{
    background-color:#EEE;
    width:100%;
    padding:0.1rem;
}


#riassunto_mobile{
    display:none;
}


@media(max-width: 500px){
    .elencoProdttiList .scheda{ font-size: 0.8rem; gap: 0.2rem; line-height: 0.8rem; }
}

@media( max-width: 900px){

    
    .elencoProdttiList .containerProdotto{

        grid-template-areas: "dati dati"
                            "scheda scheda";
    
    }


        
    .elencoProdttiList .scheda{

        width: 100%;
        grid-template-columns: 1fr 2fr 1fr 2fr ;
        
    }

    .elencoProdttiList .scheda .titolo{

        font-weight: bold;
        
    }


    

    #parte-ricerca{
        display:none;
    }

    .parte-titolo{ display:none;}

    #riassunto{
        display:none;
    }
 
    #riassunto_mobile{
        display:grid;
        padding-bottom: 2rem;
    }

    #riassunto_mobile > .image{
        grid-column: 1 / span 7;
    }

    
    
}