CSS Bootstrap - How to make image rows same sizes while maintaing fluidity?

I have one row of 5 images and two rows of 4 images as shown below:

The problem is when I use col-md in layouting, the pictures in the first row becomes smaller compared to the last two rows since that's how bootstrap was made. Is there a way wherein I can make all the images the same size while maintaining the fluid behavior of bootstrap, that is, when I shrink the view size to the smallest size, it will still become one column of images.

Here is my current code:

<div class="row">
    <div class="col-md-2">
        <img src="https://drive.google.com/uc?export=download&id=1nTQDh-F35LayxXtm6WMZK6U6eYmwdrzj" class="img-fluid"">
    </div>
    <div class="col-md-2 col-half-offset">
        <img src="https://drive.google.com/uc?export=download&id=1YNxNg4k2RdZ1zmm-VjiljEU6JpKc1s5q" class="img-fluid"">
    </div>
    <div class="col-md-2 col-half-offset">
        <img src="https://drive.google.com/uc?export=download&id=1RnX-U-YyU5kP2xbe7zWE9oJcU78PgMCW" class="img-fluid"">
    </div>
    <div class="col-md-2 col-half-offset">
        <img src="https://drive.google.com/uc?export=download&id=1GMKk5IW_iI55gqE6ye0Ul4nmssrIfX19" class="img-fluid"">
    </div>
    <div class="col-md-2 col-half-offset">
        <img src="https://drive.google.com/uc?export=download&id=144ezEQEDozijf8Vk3dB8QYgoqtCfEWuG" class="img-fluid"">
    </div>
</div>

<div class="row">
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1F0XPaqsKV3G6JzI4SNaH5tlPSJXxkPXr" class="img-fluid"">
    </div>
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1MNQ7qgEjAxxKuif5pJqiB2b8zRirTs3H" class="img-fluid"">
    </div>
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1IN6UTqnfhX3vI1_AAIKafDEW7i_66EWg" class="img-fluid"">
    </div>
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1x91NNnHlE0PpZoAWh0ueMIkkgC-dSUMn" class="img-fluid"">
    </div>
</div>

<div class="row">
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=106oTjYXJQBg-cPTL_FXW-HQwDk21gzkd" class="img-fluid"">
    </div>
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1FuqE9s-_nXO3Jw-RCJKnzPlBOujV_m5_" class="img-fluid"">
    </div>
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1mLywhfH8KMlEViBTQ-GjJrjC3dqWxvDc" class="img-fluid"">
    </div>
    <div class="col-md-3">
        <img src="https://drive.google.com/uc?export=download&id=1WO8eYFq8QlTfIxmfuWqFZNR8heDJE93I" class="img-fluid"">
    </div>
</div>

For the col-half offset:

.col-half-offset{
    margin-left:4.166666667%
}