Inserire uno spazio fra le colonne dei div

[Artgallery75]

Sto creando un layout responsive ma ho un paio di problemi di visualizzazione.
Invio le immagini così capite meglio:
1.jpg
2.jpg

Praticamente vorrei che fra le varie colonne ci sia un po' di spazio e che quando si passa alla visione tablet le due colonne siano centrate e non allineate a sinistra!

Questo è il mio codice. Uso bootstrap:

<div class="container py-0">             
<center>         
<div class="container pb-2 pt-3 px-3">             
<div class="row mx-md-n2">                 
<div class="border border-secondary shadow-sm p-0 mb-2 bg-muted rounded-lg col-xs-12 col-sm-12 col-md-5 col-lg-2">                      
<div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight-bold">Titolo</div><img src="images/occhio-di-gatto.jpg" class="flex"><div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight">Riassunto</div></div>                 
<div class="border border-secondary shadow-sm p-0 mb-2 bg-muted rounded-lg col-xs-12 col-sm-12 col-md-5 col-lg-2">                     
<div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight-bold">Titolo</div><img src="images/occhio-di-gatto.jpg" class="flex"><div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight">Riassunto</div></div>                 
<div class="border border-secondary shadow-sm p-0 mb-2 bg-muted rounded-lg col-xs-12 col-sm-12 col-md-5 col-lg-2">                     
<div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight-bold">Titolo</div><img src="images/occhio-di-gatto.jpg" class="flex"><div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight">Riassunto</div></div>                 
<div class="border border-secondary shadow-sm p-0 mb-2 bg-muted rounded-lg col-xs-12 col-sm-12 col-md-5 col-lg-2">                    
<div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight-bold">Titolo</div><img src="images/occhio-di-gatto.jpg" class="flex"><div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight">Riassunto</div></div>                 
<div class="border border-secondary shadow-sm p-0 mb-2 bg-muted rounded-lg col-xs-12 col-sm-12 col-md-5 col-lg-2">                     
<div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight-bold">Titolo</div><img src="images/occhio-di-gatto.jpg" class="flex"><div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight">Riassunto</div></div>                 
<div class="border border-secondary shadow-sm p-0 mb-2 bg-muted rounded-lg col-xs-12 col-sm-12 col-md-5 col-lg-2">                     
<div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight-bold">Titolo</div><img src="images/occhio-di-gatto.jpg" class="flex"><div class="pb-0 pt-0 px-0 py-0 bg-warning font-italic text-black font-weight">Riassunto</div></div>             
</div>                
</div>         
</center>         
</div>