Feature Boxes Rendition Issue on Smaller devices

We are using the feature box code snippet from the Canvas Template on the url :

https://biosimcovex.biosimilia.com/ (Please scroll down to see three boxes : FAQ, Buy and Research)

While they seem to appear well on larger devices, when the browser is resized to mobile width or when browsed on the phone, the images appear larger than they are whereas they should actually render smaller.

Here is the code we currently have :

                    <div class="col-sm-4 col-lg-4">
                        <div class="feature-box text-center media-box fbox-bg">
                            <div class="fbox-media">
                                <a href="~/Pages/Content/FAQ" target="_blank"><img src="~/Content/images/homeimages/IMG-20210828-WA0008.jpg" alt="Read the FAQ"></a>
                            </div>
                        </div>
                    </div>

                    <div class="col-sm-4 col-lg-4">
                        <div class="feature-box text-center media-box fbox-bg">
                            <div class="fbox-media">
                                <a href="~/Products" target="_blank"><img src="~/Content/images/homeimages/IMG-20210828-WA0009.jpg" alt="Buy BiosimCovex"></a>
                            </div>
                        </div>
                    </div>

                    <div class="col-sm-4 col-lg-4">
                        <div class="feature-box text-center media-box fbox-bg">
                            <div class="fbox-media">
                                <a href="~/Pages/Content/Research" target="_blank"><img src="~/Content/images/homeimages/IMG-20210828-WA0010.jpg" alt="Read Research"></a>
                            </div>
                        </div>
                    </div>

Could you please let us know what we might be missing?

Thanks for your prompt help.