.img-w40 img{ 
width: 40%; 
}
.img-w30 img{ 
width: 30%; 
}

/* 1. Zmiana wiersza w kontener flex z zachowaniem zawijania dla RWD */
.row-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

/* 2. Zmuszenie kolumn, by ich dzieci (content-box) mogły korzystać z flexa */
.row-flex > [class*='col-'] {
    display: flex;
    flex-direction: column;
}

/* 3. Rozciągnięcie wizualnego boksa na 100% wysokości dostępnej w kolumnie */
.row-flex .content-box {
    flex: 1 1 auto; 
    width: 100%;
    /* Jeśli wewnątrz boksa masz elementy, które chcesz spychać na dół (np. przycisk), 
       odkomentuj poniższe linie: */
    /* display: flex; */
    /* flex-direction: column; */
}