Bootstrap: Additional Styles in the Jumbotron

This morning I working on a site that uses the Bootstrap jumbotron and I decided that I wanted a smaller version of it that was more compact with smaller Typography (but still larger than other elements I could use otherwise).

In version 4 of Bootstrap the display elements used in the standard jumbotron range from display-1 to display-4 (1 being the largest and 4 being the smallest). Below I'm sharing three CSS classes. The first is a jumbotron-mini that is a more compact version of the jumbotron (still large, just smaller than the standard). Also included are "display-5" and "display-6" which cna be used for smaller caption sizes if those are needed or desired.

    .jumbotron-mini {    
        padding: 1rem .5rem;
        margin-bottom: 1rem;
        background-color: #e9ecef;
    }
    
    .display-5 {
        font-size: 2.5rem;
        font-weight: 300;
        line-height: 1.2;
    }
    
    .display-6 {
        font-size: 1.5rem;
        font-weight: 300;
        line-height: 1.2;
    }