*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    font-family:sans-serif;
   
}

div{
    
}
.row{
    display:flex;
    margin:10px;
    
    
}


.column{
    
    border:solid black 1px;
    margin:10px;
    
    
}
div:last-child{ 
    width:100%;
}
@media screen and (max-width: 768px) {
  /* styles pour les écrans de 768 pixels ou moins */
  .row{
    flex-basis: calc(100% / 1 - 20px);
    margin:10px;
    display:block;}
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  /* styles pour les écrans entre 769 et 1024 pixels */
   .row{
    flex-basis: calc(50% / 2 - 40px);
    margin:10px;
    display:flex;
    flex-wrap:wrap;
       
   }
   .column{
       display:flex;
       flex-wrap:wrap;
   }
 .article3{ 
     width:100%;
 }
  }
  
}
@media screen and (min-width: 1025px) {
  /* styles pour les écrans de 1025 pixels ou plus */
  .row{
    flex-basis: calc(33% / 3 - 20px);
    margin:10px;
    display:flex;}
}