#single {
    ul.gallery{
        margin: -#{$gutter-width};
    }

    .single-footer {
        p {
            margin: 0;
            font-size: 0.8rem;
        }
    }

    .featured {
        max-width: $min-column-width;
        height: auto;
        float: none;
        margin-bottom: 1rem;

        img {
            width: 100%;
        }

        & + p {
            margin-top: 0;
        }
    }
}

@media screen and (min-width: 500px) {
    #single {
        .featured {
            max-width: $min-column-width-desktop;
            float: left;
        }
    }
}

figure.left {
    float: left;
    margin-right: $gutter-width;
    max-width: $min-column-width;
    padding: 0.5rem 0;
}

figure.right {
    float: right;
    margin-left: $gutter-width;
    max-width: $min-column-width;
    padding: 0.5rem 0;
}

@media screen and (min-width: $media-query) {
    figure.left {
        max-width: $min-column-width-desktop;
    }

    figure.right {
        max-width: $min-column-width-desktop;
    }
}