﻿
.blog-story {
    min-height: 240px;
    background-size: cover;
    box-shadow: 0px 0px 10px 5px var(--med-blue);
}


    .blog-story article a {
        color: white;
        font-weight: 500;
        height: 100%;
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
        text-align: center;
        height: 280px;
        overflow: hidden;
        position: relative;
        padding-left: 10px;
        padding-right: 10px
    }

    .blog-story:first-child article a {
        font-size: 1.5rem
    }

    .blog-story article a span {
        position: absolute;
        top: 220px;
        left: 0;
        padding-top: 25px;
        padding-bottom: 20px;
        background-image: linear-gradient(transparent,#00274C 30px,#00274C 145px,transparent);
        transition: top 0.6s ease-in-out
    }

    .blog-story article a:hover span {
        top: 10px
    }

    .blog-story article a:hover {
        justify-content: center;
        align-items: center
    }
