﻿
.related-block {
    margin-bottom: 4em;
}

    .related-block article {
        overflow: hidden;
        position: relative;
        height: 100%;
    }

        .related-block article:hover img {
            -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
        }

        .related-block article a,
        .related-block article:hover a,
        .related-block article:focus a {
            text-decoration: none;
            height: 100%;
        }

            .related-block article a:hover .article-content,
            .related-block article a:focus .article-content {
                background-color: #eee;
            }

        .related-block article img {
            width: 100%;
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
            -webkit-transition: opacity 1s, -webkit-transform 0.35s;
            transition: opacity 1s, transform 0.35s;
            -webkit-transform: scale3d(1.05, 1.05, 1);
            transform: scale3d(1.05, 1.05, 1);
            position: relative;
            display: block;
            z-index: 0;
        }

        .related-block article .article-content {
            height: 100%;
            padding: 20px;
            transition-duration: 0.3s;
            position: relative;
            background-color: #0db2ad;
            color: #000;
            text-decoration: none;
        }

        .related-block article a .article-content h6 {
            margin-top: 0;
            margin-bottom: 12px;
        }

        .related-block article a .article-content h4 {
            margin-top: 0;
            margin-bottom: 12px;
        }

        .related-block article a .article-content p {
            font-size: 18px;
            margin-bottom: 0;
        }

    .related-block .row .col-sm-4:nth-of-type(1) article a .article-content {
        background-color: #26b3e8;
    }

    .related-block .row .col-sm-4:nth-of-type(1) article a:hover .article-content,
    .related-block .row .col-sm-4:nth-of-type(1) article a:focus .article-content {
        background-color: #2abdf4;
    }

    .related-block .row .col-sm-4:nth-of-type(2) article a .article-content {
        background-color: #ce9700;
    }

    .related-block .row .col-sm-4:nth-of-type(2) article a:hover .article-content,
    .related-block .row .col-sm-4:nth-of-type(2) article a:focus .article-content {
        background-color: #e1a501;
    }

    .related-block .row .col-sm-4:nth-of-type(3) article a .article-content {
        background-color: #0db2ad;
    }

    .related-block .row .col-sm-4:nth-of-type(3) article a:hover .article-content,
    .related-block .row .col-sm-4:nth-of-type(3) article a:focus .article-content {
        background-color: #0fc5bf;
    }

@media only screen and (max-width: 767px) {

    .related-block {
        margin-bottom: 4em;
    }

        .related-block .col-sm-4 {
            margin-bottom: 1em;
        }
}