.highlight-badges
{
    background-color: #f6f6f6;
    margin-bottom: 0px;
}
.highlight-badges .full-width-child.wrap
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    align-content: stretch;
}

    
.highlight-badge-item
{
    display: grid;
    grid-template-columns: 5fr 9fr;
    grid-template-rows: auto auto;
    grid-template-areas:
        "icon title"
        "icon description";
    column-gap: 20px;
    width: 100%;
}

.highlight-badge-item.hide-on-mobile
{
    display: none;
}
.highlight-badge-icon
{
    grid-area: icon;
    display: block;
    width: 100%;
    max-width: 105px;
     justify-self: center;
}
.highlight-badge-title
{
    grid-area: title;
    text-align: left;
}
.highlight-badge-description
{
    grid-area: description;
    text-align: left;
}
.highlight-badge-link
{
    white-space: nowrap;
    float: right;
}
@media only screen and (min-width: 768px) 
{

    .highlight-badge-item.hide-on-mobile
    {
        display: block;
    }
    .highlight-badges 
    {
        padding: unset;
        background-color: #fff;
    }
    .highlight-badges .wrap
    {

    }
    .highlight-badge-item
    {
        max-width: 240px;
        padding: 10px;
        display: block;
    }
    .highlight-badge-icon
    {
        height: 90px;
        display: block;
        margin: 0px auto 30px;
    }
    .highlight-badge-description
    {
        max-width: 230px;
        text-align: center;
    }
    .highlight-badge-link
    {
        white-space: nowrap;
        float: right;
    }
}

