Bootstrap card border thickness

Question

I am trying to add a thicker border around the whole card in my bootstrap 4 card. It was supposed to be thicker, but nothing happened. I will give a snippet of my code here:

<div class="container">
    <div class="row">
        <div class="col-md-6 col-lg-3">
            <div class="card h-100">
                <img src="img/html.jpg" alt="HTML" class="card-img-top " style="display: block">
                <div class="card-block">
                    <h3 class="card-title"> Projects </h3>

                    <p class="font-weight-light"> hello world hello worldhello worldhello worldhello worldhello world</p>
                    <form action="https://www.w3schools.com/html/">
                        <button type="submit" class="btn btn-danger btn-lg btn-block">Learn More</button>
                    </form>
                </div>
            </div>
        </div>

And my css:

 .card {
     border-style: 5px solid black;
     padding-bottom: 3%;
 }

 .row {
     padding-bottom: 15%;
 }

Is there anything I could do to get to the end result?

Thanks.

Answer 1

border-style isn't valid when combining properties. Change it to border and it works.

 .card {
     border: 5px solid black;
 }

Demo

Answer 2

<div class="card" style="border: 2px solid #07bc4c"></div>

worked for me...