/* Public blog base styles — colours, fonts and widths come from the inline theme <style>. */
* { box-sizing: border-box; }
img { max-width: 100%; height: auto; }
.wrap { padding: 0 1em; }
.site-header { padding: 0; }
.header-image img { display: block; width: 100%; max-height: 320px; object-fit: cover; }
.header-text { padding: 1.4em 1em; }
.site-title { margin: 0; font-size: 2em; line-height: 1.2; }
.site-title a { text-decoration: none; }
.tagline { margin: 0.3em 0 0; opacity: 0.85; }
.site-nav { border-bottom: 1px solid rgba(0,0,0,0.1); }
.nav-inner { padding: 0.3em 1em; }
.site-nav a { display: inline-block; padding: 0.5em 0.8em; text-decoration: none; font-weight: bold; }
.site-nav a.active, .site-nav a:hover { text-decoration: underline; }
.body-wrap { padding: 1.5em 1em; overflow: hidden; }
.content { padding: 1.5em 2em; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.15); }
.page-title { margin-top: 0; }
.intro { padding-bottom: 1em; margin-bottom: 1.5em; border-bottom: 1px solid rgba(0,0,0,0.1); }
.post { margin-bottom: 2.5em; }
.post-title { margin: 0 0 0.1em; font-size: 1.5em; line-height: 1.25; }
.post-title a { text-decoration: none; }
.post-title a:hover { text-decoration: underline; }
.post-date { margin: 0 0 0.8em; font-size: 0.85em; opacity: 0.7; }
.post.single .post-title { font-size: 2em; }
.post-body blockquote { margin: 1em 0; padding: 0.2em 1em; border-left: 4px solid rgba(0,0,0,0.15); opacity: 0.9; }
.post-body pre { overflow-x: auto; padding: 0.8em 1em; background: rgba(0,0,0,0.06); border-radius: 4px; }
.post-body code { background: rgba(0,0,0,0.06); padding: 0 0.25em; border-radius: 3px; font-size: 0.92em; }
.post-body pre code { background: none; padding: 0; }
.post-body table { border-collapse: collapse; }
.post-body th, .post-body td { border: 1px solid rgba(0,0,0,0.15); padding: 0.3em 0.6em; }
.post-body hr { border: 0; border-top: 1px solid rgba(0,0,0,0.15); }
/* announcements: translucent tints so they sit on any theme colour */
.notice { margin: 0 0 1.5em; padding: 0.8em 1em; border: 1px solid rgba(0,0,0,0.15); }
.notice-note { background: rgba(255, 200, 60, 0.18); border-left: 5px solid rgba(210, 150, 0, 0.85); }
.notice-warning { background: rgba(220, 60, 40, 0.10); border-left: 5px solid rgba(190, 40, 30, 0.85); }
.notice-title { margin: 0 0 0.3em; font-size: 1em; text-transform: uppercase; letter-spacing: 0.05em; }
.notice-body > :first-child { margin-top: 0; }
.notice-body > :last-child { margin-bottom: 0; }
.content > .notice:last-child { margin: 1.5em 0 0; }
.pager { margin-top: 2em; padding-top: 1em; border-top: 1px solid rgba(0,0,0,0.1); text-align: center; }
.pager a, .pager span { margin: 0 0.8em; }
.muted { opacity: 0.7; }
.site-footer { margin-top: 1em; padding: 1.5em 0; text-align: center; }
.site-footer p { margin: 0.3em 0; }
.site-footer .small { font-size: 0.85em; opacity: 0.8; }

/* left sidebar layout: float the menu beside the content */
.nav-left-sidebar .body-wrap .site-nav { float: left; width: 180px; border: 0; border-radius: 6px; padding: 0.5em 0; }
.nav-left-sidebar .body-wrap .site-nav a { display: block; padding: 0.4em 1em; }
.nav-left-sidebar .body-wrap .site-nav .nav-inner { padding: 0; text-align: left; } /* alignment is a horizontal-menu option */
.nav-left-sidebar .body-wrap .content { margin-left: 200px; }
.nav-left-sidebar .body-wrap .sidebar-notices { float: left; clear: left; width: 180px; margin-top: 1em; }
.nav-left-sidebar .body-wrap .sidebar-notices .notice { font-size: 0.9em; padding: 0.6em 0.8em; }
@media (max-width: 700px) {
  .content { padding: 1em; }
  .site-title { font-size: 1.5em; }
  .nav-left-sidebar .body-wrap .site-nav { float: none; width: auto; margin-bottom: 1em; }
  .nav-left-sidebar .body-wrap .site-nav a { display: inline-block; }
  .nav-left-sidebar .body-wrap .content { margin-left: 0; }
  .nav-left-sidebar .body-wrap .sidebar-notices { float: none; width: auto; margin: 0 0 1em; }
}
