/* ========================================
   Blog Pages - Common Styles
   ======================================== */

/* Blog Listing Page Styles */
.mar-20 {
    margin-top: 20px;
    margin-bottom: 20px;
}

/* Desktop: Image on left, text on right */
@media only screen and (min-width: 601px) {
    .img-with-article {
        width: auto;
        height: 150px !important;
        max-width: 100%;
        margin: 0;
        display: block;
    }
}

/* Mobile: Image full width on top, text below */
@media only screen and (max-width: 600px) {
    .img-with-article {
        width: 100%;
        height: auto !important;
        max-height: 200px;
        margin: 0 auto 15px auto;
        display: block;
    }

    /* Reduce spacing between header and content in mobile */
    .hide_on_phone {
        display: none !important;
    }

    #contentSection {
        margin-top: 10px !important;
    }

    #contentSection h1 {
        margin-top: 10px !important;
        margin-bottom: 10px !important;
        padding-top: 0 !important;
    }
}

.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
    display: block;
    max-width: 100%;
    max-height: 260px;
}

@media only screen and (max-width: 767px) {
    .img-responsive,
    .thumbnail > img,
    .thumbnail a > img,
    .carousel-inner > .item > img,
    .carousel-inner > .item > a > img {
        display: block;
        max-width: 100%;
        max-height: auto;
    }
}

/* Blog Article Page Styles */
.single_page_content ul,
.single_page_content ol {
    margin-left: 20px;
}

.single_page_content li {
    font-family: "Lato";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    color: #272528;
}

.featured-image {
    margin: 0 auto;
    height: auto;
    width: 80%;
}

.img-in-article {
    width: 100%;
    max-height: 175px;
}

@media only screen and (min-width: 519px) {
    .image-in-article {
        margin: 0 auto;
        max-width: 80%;
        height: auto;
        max-height: 400px;
    }
}

@media only screen and (max-width: 520px) {
    .img-in-article {
        width: 100%;
        height: auto;
    }
}

/* Common Blog Styles */
.tooltip {
    opacity: unset;
}

h5 {
    font-size: 2.64rem;
    line-height: 110%;
    margin: 1.0933333333rem 0 .656rem 0;
}