.baseProdotti{
    display: grid;
    grid-template-columns: repeat( auto-fit , minmax(200px, 1fr) /*minmax( 1fr, 300px ) */ );

    place-items:start center;
    text-align: center;    
}


.rigaProdotto{

    box-sizing: border-box;
    width: 100%;
    display: grid;

    place-items: center center;

    grid-template-rows: 1fr 110px auto;

    gap: 0.3rem;
    
    padding: 1rem;

    transition: background-color 0.5s, box-shadow 0.5s;


}

.rigaProdotto:hover{

    /*
    box-shadow: 1px 2px 4px #c62026;
    background-color:#c62026;
    */
    
    box-shadow: 3px 3px 6px #AAA;
    background-color:#DDD;
    
    color: #000;
}



.rigaProdotto .nome{
   
    box-sizing: content-box;
    
    display: flex;
    
    flex-direction: column;
    flex-wrap: wrap;

    flex-flow: column;


    gap: 0.5rem;
    

    padding: 1rem;
    text-transform: capitalize;

    font-size: clamp(1rem, 10vw, 1.6rem);

    font-weight: bold;
}


.rigaProdotto .immagine{

    box-sizing: border-box;

    max-width:  clamp( 100px, 100% , 150px);
    max-height: 100px;

    margin: 1rem;
    padding: 1rem;
    background-color:#FFF;
    border-radius:1rem;
}


.rigaProdotto .contenuto .nome {
    font-size: 2rem;
    font-weight: bold;;
    text-transform: capitalize;
}

.rigaProdotto .contenuto .descrizione {
    font-size: 0.8rem;
}



.rigaProdotto .azione{

    background-color: #444;
    color: #FFF;
    padding: 1rem;
    border-radius: 0.3rem;

    place-self: center center;
    cursor: pointer;

    transition: all 0.5s;

    text-decoration: none;
}

.rigaProdotto .azione:hover{

    background-color: #800;
    text-decoration: none;
    
}





@media(max-width:450px){
    
    .rigaProdotto .contenuto .descrizione {
        display:none;
    }


    .rigaProdotto .titolo{
   
        display: grid;
        grid-template-columns: 1fr;
        
        place-items: center center;
    }


    .rigaProdotto .titolo .nome {
        font-size: 1.5rem;
        font-weight: bold;;
        text-transform: capitalize;
    }
}