// ARTICLE STYLES
// --------------------------------------------------------------------
.post {
    @extend %container;

    margin-bottom: 2 * $type-rhythm;
    padding: 0 1rem;

    @media screen and (min-width: $sm) {
        padding: 0;
    }

    h2 {
        margin-bottom: 0;

        a {
            text-decoration: none;

            &,
            &:visited {
                color: $off-black;
                transition: color .25s linear;
            }

            &:hover,
            &:focus {
                color: $ci-greyed-out;
                transition: color .25s linear;
            }
        }
    }
}

.post_meta {
    ul {
        list-style: none;
        padding: 0;
        text-align: center;
    }

    @media screen and (min-width: $md) {
        ul {
            display: flex;
            text-align: left;
        }

        li {
            flex: 0 1 auto;
            margin-right: 1rem;

            &:last-child {
                margin-right: 0;
            }
        }
    }
}

.post-list {
    li {
        flex-wrap: wrap;
        margin-bottom: 1.5rem;
    }

    time {
        color: $greyed-out;
    }
}

.post-teaser {
    flex: 0 1 100%;

    p {
        margin: .5rem 0 0;
    }
}

// ARTICLE STYLES
// --------------------------------------------------------------------
.post {
    @extend %container;

    margin-bottom: 2 * $type-rhythm;
    padding: 0 1rem;

    @media screen and (min-width: $sm) {
        padding: 0;
    }

    h2 {
        margin-bottom: 0;

        a {
            text-decoration: none;

            &,
            &:visited {
                color: $off-black;
                transition: color .25s linear;
            }

            &:hover,
            &:focus {
                color: $ci-greyed-out;
                transition: color .25s linear;
            }
        }
    }
}

.post_meta {
    ul {
        list-style: none;
        padding: 0;
        text-align: center;
    }

    time {
        color: $greyed-out;
    }

    @media screen and (min-width: $md) {
        ul {
            display: flex;
            text-align: left;
        }

        li {
            flex: 0 1 auto;
            margin-right: 1rem;

            &:last-child {
                margin-right: 0;
            }
        }
    }
}

.post-list {
    li {
        flex-wrap: wrap;
        margin-bottom: 1.5rem;
    }

    time {
        color: $greyed-out;
    }
}

.post-teaser {
    flex: 0 1 100%;

    p {
        margin: .5rem 0 0;
    }
}

Change color for time in entry meta
Change color for time in entry meta
