iframe { max-width: 100%; height: auto; }
.blogheader { width: 100%; background-image: url('/i/atlasimages/blog/Blog-Header.jpg'); background-size: contain; height: 20.833vw; max-height: 400px; padding: 3% 15%; color: #fff; }
.blog-header { background-image: url('/i/atlasimages/blog/BlogHeaderBackground.jpg'); background-size: contain; background-repeat-x: repeat; background-repeat-y: no-repeat; }
.blogheader h1 { font-size: 4em; color: #fff; }
.blogheader h2 { font-size: 3em; color: #368fce; }
.blogheader h3 { font-size: 2em; color: #fff; font-weight: 300; }
.side-2 { margin: 30px 0; border-right: solid 2px #ccc; }
.block .tags li { display: block; }
    .block .tags li a { float: none; font-size: 1em !important; }
.block-popular-blogtags { padding: 15px 0 0 0; text-align: right; }
    .block-popular-blogtags .title { border-bottom: none; color: #000; }
    .block-popular-blogtags .listbox { max-width: 100%; padding: 10px 30px 0 0; text-align: right; }


.blog-page .post { margin: 10px 0; border: 1px solid #ccc; padding: 10px; }
.blog-page .post-body-wrapper { display: flex; flex-flow: row nowrap; width: 100%; }
.blog-page .post-title { display: block; text-align: left; font-size: 20px; padding: 0 0 10px; }
.blog-page .blog-posts { text-align: left; max-width: 1000px; margin: 30px 20px; }
    .blog-page .blog-posts .tags { float: none; width: 100%; text-align: left; }
    .blog-page .blog-posts .buttons .read-more { float: none; background-color: #006cb7; white-space: nowrap; }
    .blog-page .blog-posts .post-image { display: flex; align-items: center; }
        .blog-page .blog-posts .post-image img { max-width: 100%; }
    .blog-page .blog-posts .post-body { margin: 0; padding: 0 10px; max-height: initial; max-width: 1000px; }
.blog-page .post-date { margin: 0; background-color: initial; }
.blog-page .post-body h3 { margin: 0 0 10px; }

.blog-ulStyle li { margin: 5px 0; padding: 5px 10px; }
.blog-overview { max-height: 300px; overflow: auto; margin-bottom: 10px; }
    .blog-overview * { max-width: 460px; }
.blogpost-page .post-body { max-height: initial; width: 100%; max-width: 1000px; margin: 30px 10px; }
    .blogpost-page .post-body > div { }
    .blogpost-page .post-body p { float: none; /*margin: 0 auto;*/ color: #000; }
    .blogpost-page .post-body ul { float: none; margin: 0 20px; color: #000; }
    .blogpost-page .post-body h2 { text-align: left; }
.blog-header { height: 100%; }
.blog-header { color: #fff; padding: 0 0 0 20px; display: flex; flex-direction: column; justify-content: space-between; }
    .blog-header > * { padding: 6px 0; }
    .blog-header .tags { color: #fff; }
        .blog-header .tags ul { display: flex; flex-flow: row nowrap; }
        .blog-header .tags li { padding: 0 5px 0 0; }
    .blog-header .blog-header-text { max-width: 500px; display: flex; flex-flow: column nowrap; }
        .blog-header .blog-header-text > * { margin: 20px 0; }
    .blog-header h1 { color: #fff; }
    .blog-header h3 { color: #fff; }
    .blog-header .post-date { background-color: initial; color: #fff; }
.blog-background { height: 300px; background-repeat: no-repeat; background-size: cover; background-position: center; }
.blog-HomeTitle { display: flex; margin: 0 0 0 20px; border-left: 1px solid #636363; padding: 0 0 0 20px; height: 60px; flex-direction: column-reverse; }
.blog-reset { text-align: right; font-size: 12px; font-weight: 300; }

@media all and (max-width: 1250px) {
    .blogpost-page .post-body p { max-width: calc(100% - 30px); }
    .blogpost-page .post-body > div { max-width: calc(100% - 30px); }
    .blog-HomeTitle { border-left: none; }
}

@media all and (max-width: 640px) {
    .blog-HomeTitle { margin: 0 auto; padding: 0; }
    .blogheader h1 { font-size: 2em; }
    .blogheader h2 { font-size: 1.5em; font-weight: 300; }
    .blogheader h3 { font-size: 1em; }
    .blog-header { background-size: cover; }
    .blog-page .post-body-wrapper { flex-flow: row wrap; }
    .blogpost-page .post-body { margin: 0 !important; }
        .blogpost-page .post-body > div { max-width: 95%; margin-left: 2%; }
        .blogpost-page .post-body p { max-width: 95%; margin: 0 auto; }
        .blogpost-page .post-body h2 { }
    .blog-wrapper { margin: 0; }
    .videoContainer { max-width: 100% !important; }
}