<div class="card" id="card-title-1">
    <div class="card-header border-0 pb-0 ">
        <h5 class="card-title">Card title</h5>
    </div>
    <div class="card-body">
        <p class="card-text">He lay on his armour-like back, and if he lifted his head a little he could see his brown belly, slightly domed and divided by arches into stiff <br> sections. The bedding was hardly able to cover it and seemed ready to
            slide off any moment.
        </p>
    </div>
</div>
												

														<div class="card" id="card-title-2">
    <div class="card-header ">
        <h5 class="card-title">Card title</h5>
    </div>
    <div class="card-body">
        <p class="card-text">This is a wider card with supporting text and below as a natural lead-in to the additional content. This content is a little <br> bit longer. Some quick example text to build the bulk</p>
    </div>
    <div class="card-footer d-sm-flex justify-content-between align-items-center">
        <div class="card-footer-link mb-4 mb-sm-0">
            <p class="card-text d-inline">Last updated 3 mins ago</p>
        </div>

        <a href="javascript:void(0);" class="btn btn-outline-primary text-white">Go somewhere</a>
    </div>
</div>    

													

																	<div class="card">
		<div class="card-header">
			<h5 class="card-title">Card title</h5>
		</div>
		<div class="card-body">
			<p class="card-text">This is a wider card with supporting text and below as a natural lead-in to the additional content. This content is a little</p>
		</div>
		<img class="card-img-bottom img-fluid" src="./images/card/3.png" alt="Card image cap">
		<div class="card-footer">
			<p class="card-text d-inline">Card footer</p>
			<a href="javascript:void(0);" class="card-link float-end">Card link</a>
		</div>
	</div>