<div class = "col-lg-6 my-3">
    <div class="card border-primary mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-primary">
            <h5 class="card-title">Primary card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card border-secondary mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-secondary">
            <h5 class="card-title">Secondary card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card border-success mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-success">
            <h5 class="card-title">Success card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card border-danger mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-danger">
            <h5 class="card-title">Danger card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card border-warning mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-warning">
            <h5 class="card-title">Warning card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card border-info mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-info">
            <h5 class="card-title">Info card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card  border-light  mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-light">
            <h5 class="card-title">Light card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>

<div class = "col-lg-6 my-3">
    <div class="card border-dark mb-3">
        <div class="card-header">Header</div>
        <div class="card-body text-dark">
            <h5 class="card-title">Dark card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
</div>