.course-card { margin-bottom: 20px; }
.course-header { height: 200px; background: #eee;background-size: cover;}
.courses .course-item { width:100%; }
.price.free {background: #5fcf80;color: #fff!important;display:inline-block;padding: 7px 14px;}
.price {color: red!important;}
.course-header {position: relative;}
.course-header span.category {
    position: absolute;
    top: .5rem;
    left: .5rem;
    font-size: 14px!important;
    display: inline-block;
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    padding: 0 .25rem;
    font-size: .6875rem;
    text-transform: uppercase;
    border-radius: 2px;
    font-weight: 300;
    line-height: 1.125rem;
    vertical-align: middle;
    color: #fff;
    background-color: rgba(22,22,22,.7);
}
.m-b-0 {
    margin-bottom: 0!important;
}
.m-b-5 {
    margin-bottom: 5px!important;
}
span.start {font-size: 14px;color: #333;display: block;margin-bottom: 10px;}
h4.free {
    background: #2260f8;
    background: -moz-linear-gradient(-45deg, #2260f8 0%, #9053fe 100%);
    background: -webkit-linear-gradient(
            -45deg
            , #2260f8 0%, #9053fe 100%);
    background: linear-gradient(
            135deg
            , #2260f8 0%, #9053fe 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#2260f8', endColorstr='#9053fe', GradientType=1);
    border-radius: 50%;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    border: 3px solid #fff;
    padding: 2px;
    position: absolute;
    bottom: 0;
    left: 10px;
}
.card-footer {
    padding: .75rem 1.25rem;
    background-color: rgba(0,0,0,0);
    border-top: 0px solid rgba(0,0,0,.125);
}
.courses .trainer .trainer-rank {
    font-size: 16px;
}