/* === BLOG OVERVIEW TEMPLATE CSS === */

.blog { background-color:#FFF;-webkit-box-shadow:inset 0 0 30px 0 rgba(0,0,0,0.075);-moz-box-shadow:inset 0 0 30px 0 rgba(0,0,0,0.075);box-shadow:inset 0 0 30px 0 rgba(0,0,0,0.075); }
.blog > .content__wrapper { padding:10px 20px 60px; background: none; }
.blog > .content__wrapper > .grid {
    -ms-grid-template-columns:minmax(auto, 1fr) minmax(300px, 30%);grid-template-columns:minmax(auto, 1fr) minmax(300px, 30%);
    -ms-grid-auto-rows:minmax(20px, min-content);grid-auto-rows:minmax(20px, min-content);
}
.blog img { margin:0;line-height:1; }

.blog header h1 { margin:0 0 40px;padding-bottom:20px;border-bottom:2px solid rgba(0,0,0,0.05);line-height:1.2;font-size:2.5em; }

.blog aside h3 { font-size:1.4em; }
.blog aside input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=image]),
.blog aside select,
.blog aside textarea { font-size:1em;min-height:30px; }

.blog aside form { position:relative;margin-bottom:30px; }
.blog aside form > figure { position:absolute;top:-15px;right:-25px;width:50%;max-width:180px;-webkit-transform:rotate(12deg);-ms-transform:rotate(12deg);transform:rotate(12deg); }

.blog .content-divide { margin-bottom:20px; }
.blog .share-bar { margin-top:40px; }

.link-listing {
     padding:5px 10px 5px 5px;border-bottom:1px solid #ccc;margin-bottom:5px;
     -webkit-box-shadow:inset 0 0 15px 0 rgba(0,0,0,0.075);-moz-box-shadow:inset 0 0 15px 0 rgba(0,0,0,0.075);box-shadow:inset 0 0 15px 0 rgba(0,0,0,0.075);
}
.link-listing > figure { margin:0;-webkit-flex:0 0 50px;-ms-flex:0 0 50px;flex:0 0 50px;height:60px; }
.link-listing > figure > img { object-fit:cover;width:100%;height:100%; }
.link-listing p { font-size:0.9em;line-height:1.2; }
.link-listing p > span { font-weight:400;color:#00aeef;-ms-transition:color .3s;-moz-transition:color .3s;-webkit-transition: color .3s;transition: color .3s; }
.link-listing:hover p > span { color:#782b91; }

#articles .link-listing { padding:10px;margin:0;align-items:center; }
#articles .link-listing p { font-size:1em; }
#articles .link-listing > figure { -webkit-flex:0 0 280px;-ms-flex:0 0 280px;flex:0 0 280px;height:100%; }
#articles .link-listing .link-listing__blurb { padding:20px; }

a.pages,
div.current-page { background-color:#f3f3f3;padding:7px 0;height:30px;width:30px;text-align:center;border-radius:5px;margin:0 0 0 5px;font-weight:bold;line-height:1; }
div.current-page { background-color:#FFF;color:#252525;border-bottom:1px solid #252525;border-radius:0; }

b { font-weight:bold; }

@media screen and (max-width:1100px) {
    .blog > .content__wrapper > .grid { -ms-grid-template-columns:minmax(auto, 1fr) minmax(250px, 25%);grid-template-columns:minmax(auto, 1fr) minmax(250px, 25%);-ms-gap:20px;gap:20px; }
    .blog > .content__wrapper > .grid > .padding30,
    .blog > .content__wrapper > .grid > aside .padding30 { padding:20px; }
    .blog aside form { margin-bottom:20px; }
    .link-listing p { font-size:0.85em; }
    #articles.grid { -ms-grid-auto-rows:minmax(20px, min-content);grid-auto-rows:minmax(20px, min-content); }
    #articles .link-listing p { font-size:1em; }
    #articles .link-listing > figure { -webkit-flex:0 0 250px;-ms-flex:0 0 250px;flex:0 0 250px; }
}
@media screen and (max-width:1000px) {
    #articles .link-listing > figure { -webkit-flex:0 0 220px;-ms-flex:0 0 220px;flex:0 0 220px; }
}
@media screen and (max-width:900px) {
    .blog > .content__wrapper > .grid { margin-top:10px !important;-ms-grid-template-columns:repeat(1, 1fr);grid-template-columns:repeat(1, 1fr);-ms-gap:30px;gap:30px; }
    .blog > .content__wrapper > .grid > .padding30,
    .blog > .content__wrapper > .grid > aside .padding30 { padding:30px; }
    .blog aside form { margin-bottom:30px; }
    .link-listing p { font-size:1em; }
}
@media screen and (max-width:800px) {
    #articles.grid { -ms-grid-auto-rows:minmax(20px, min-content);grid-auto-rows:minmax(20px, min-content);-ms-gap:30px;gap:30px; }
    #articles .link-listing > figure { -webkit-flex:auto;-ms-flex:auto;flex:auto;width:100%;height:300px; }
}
@media screen and (max-width:600px) {
    .blog > .content__wrapper > .grid > .padding30,
    .blog > .content__wrapper > .grid > aside .padding30 { padding:20px; }
    .blog aside #news { padding-top:50px !important; }
    .blog aside #news > figure { top:-20px;right:calc(50% - 90px);width:180px;-webkit-transform:rotate(5deg);-ms-transform:rotate(5deg);transform:rotate(5deg); }
    #articles .link-listing { padding:0;align-items:flex-start; }
    #articles .link-listing > figure { height:275px; }
}
@media screen and (max-width:475px) {
    #articles .link-listing > figure { height:200px; }
}