Make image in card smaller (Bootstrap 4)

Question

I have a card and I want to insert a picture there. But the picture size is too big. I want to make it smaller. But I can't change it. It goes like this :

Here's the code:

    .media .img {
        height: 50px;
        width: 50px;
    }

<div class="row">
                            <div class="col-md-9 col-lg-8 mx-auto">
                                <div class="card">
                                    <div class="card-content">
                                        <div class="card-body">
                                            <div class="media ">
                                                <div class="align-self-center patient">
                                                    <img src="{{ asset('images/patient.png') }}">
                                                </div>
                                                <div class="media-body text-right">
                                                    <h3>Patient</h3>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

Answer 1

you won't need .media .img , just type .media img because img isn't a class