/* https://coolors.co/cc5a71-222222-cc7828-ffffff-2c5777 */
:root {
  --red: #C5004A;
  --darkred: #7F0036;
  --lightgray: #efefef;
  --gray: #696969;
  --darkgray: #222;
  --navy: #2D5676;
  --blue: #376C95;
  --white: #fff;
  --orange: #cc7728;
  --orangebg: #DF9C5D;
  --orangedark: #B56B26;
  --pink: #CC5A71;
  --pinkbg: #D06C80;
  --pinkdark: #C74861;
  --newblue: #376C95;
  --darkblue: #2D5676;
}
* {
  box-sizing: border-box;
}
html,
body {
  padding: 0;
  margin: 0;
  font-family: 'Raleway', system-ui, sans-serif;
  color: var(--darkgray);
  background-color: var(--white);
}
button {
  font-family: 'Raleway', system-ui, sans-serif;
}
p:last-child {
  margin-bottom: 0;
}
p,
.tmpl-post li,
img {
  max-width: 50.625em; /* 600px /16 */
}
p,
.tmpl-post li {
  line-height: 1.5;
}
img {
  display: inline-block;
  width: 100%;
  height: auto;
}
a {
  color: var(--newblue);
}
a:visited {
  color: var(--darkblue);
}
table {
  margin: 1em 0;
}
table td,
table th {
  padding-right: 1em;
}

pre,
code {
  font-family: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier, monospace;
  line-height: 1.5;
}
pre {
  font-size: 14px;
  line-height: 1.375;
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  -moz-tab-size: 2;
  -o-tab-size: 2;
  tab-size: 2;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  padding: 1em;
  margin: .5em 0;
  background-color: #f6f6f6;
}
.highlight-line {
  display: block;
  padding: 0.125em 1em;
  text-decoration: none; /* override del, ins, mark defaults */
  color: inherit; /* override del, ins, mark defaults */
}

/* allow highlighting empty lines */
.highlight-line:empty:before {
  content: " ";
}
/* avoid double line breaks when using display: block; */
.highlight-line + br {
  display: none;
}

.highlight-line-isdir {
  color: #b0b0b0;
  background-color: #222;
}
.highlight-line-active {
  background-color: #444;
  background-color: hsla(0, 0%, 27%, .8);
}
.highlight-line-add {
  background-color: #45844b;
}
.highlight-line-remove {
  background-color: #902f2f;
}

/*------------------------------------------------
  LAYOUT
 ------------------------------------------------*/

/* position the footer at the bottom
 even if the content is short */
body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100vh;
}
main {
  flex: 100%;
}

/*------------------------------------------------
  HEADER
 ------------------------------------------------*/
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 10;
}
.tmpl-home header {
  justify-content: flex-end;
  border-bottom: none;
}
header:after {
  content: "";
  position: absolute;
  width: 100%;
  border-bottom: 1px solid var(--gray);
  bottom: 0;
}
.tmpl-home header:after {
  display: none;
}
.home {
  padding: 0 1rem;
  margin: 1rem 0; /* 16px /16 */
  font-size: 1.25em; /* 16px /16 */
}
.home a,
.home a:visited {
  color: var(--orange);
}
.home :link:not(:hover) {
  text-decoration: none;
}
.home .full {
  display: none;
}
@media screen and (min-width: 460px) {
  .home .full {
    display: inline;
  }
  .home .initials {
    display: none;
  }
}

/*------------------------------------------------
  NAVIGATION
 ------------------------------------------------*/
.nav {
  padding: 0;
  margin: 1rem 0;
  list-style: none;
  float: right;
  position: relative;
}
.nav-item {
  display: inline-block;
  margin-right: 1em;
}
.nav-item a,
.nav-item a:visited {
  color: var(--darkgray);
  text-decoration: none;
}
.nav-item a:hover {
  text-decoration: underline;
  color: var(--darkgray);
}
.nav-item-active {
  font-weight: 700;
  text-decoration: underline;
}

.nav:after {
  content: "";
  position: absolute;
  height: 18px;
  background-color: var(--orangebg);
  width: 105%;
  right: 0;
  bottom: -1.6rem;
  z-index: 0;
}
.tmpl-home .nav:after {
  display: none;
}

/*------------------------------------------------
  FOOTER
 ------------------------------------------------*/
footer {
  margin-top: 2em;
  background: var(--darkgray);
  color: white;
  padding: 2em;
  display: flex;
  flex-direction: column;
  align-items: center;
}
footer a,
footer a:visited {
  color: white;
}
.footer-links {
  margin-bottom: 0.5em;
  display: flex;
}
.footer-links a {
  margin-left: 0.5em;
}
footer small {
  text-align: center;
}
@media screen and (min-width: 540px) {
  footer {
    flex-direction: row-reverse;
    justify-content: space-between;
  }
  .footer-links {
    margin: 0;
  }
  footer small {
    text-align: left;
  }
}

/*------------------------------------------------
  POSTS LIST
 ------------------------------------------------*/
.postlist {
  list-style: none;
  padding: 0;
}
.postlist-item {
  padding: 1em 0;
}
.postlist-date {
  display: block;
}
.postlist-date,
.postlist-item:before {
  font-size: 0.8125em; /* 13px /16 */
  color: var(--darkgray);
}
.postlist-date {
  word-spacing: -0.5px;
}
.postlist-link {
  display: inline-block;
  padding: 0.25em 0.1875em; /* 4px 3px /16 */
}
.postlist-item-active .postlist-link {
  font-weight: bold;
}

/*------------------------------------------------
  TAGS
 ------------------------------------------------*/
.post-tag {
  display: inline-block;
  vertical-align: text-top;
  text-transform: uppercase;
  font-size: 0.625em; /* 10px /16 */
  padding: 2px 4px;
  margin-left: 0.8em; /* 8px /10 */
  background-color: var(--red);
  color: var(--white);
  border-radius: 0.25em; /* 3px /12 */
  text-decoration: none;
}
a[href].post-tag,
a[href].post-tag:visited {
  color: #fff;
}

/*------------------------------------------------
  WARNING
 ------------------------------------------------*/
.warning {
  background-color: #ffc;
  padding: 1em 0.625em; /* 16px 10px /16 */
}
.warning ol:only-child {
  margin: 0;
}

/*------------------------------------------------
  DIRECT LINK TO BLOG POST HEADERS
 ------------------------------------------------*/
.direct-link {
  font-family: sans-serif;
  text-decoration: none;
  font-style: normal;
  margin-left: .1em;
}
a[href].direct-link,
a[href].direct-link:visited {
  color: transparent;
}
a[href].direct-link:focus,
a[href].direct-link:focus:visited,
:hover > a[href].direct-link,
:hover > a[href].direct-link:visited {
  color: var(--orange);
}

/*------------------------------------------------
  LAYOUT
 ------------------------------------------------*/
h1 {
  color: var(--orange);
}
section h2 {
  margin-top: 0;
  margin-bottom: 0.5em;
  color: var(--orange);
  font-size: 1.5em;
}

@media screen and (min-width: 580px) {
  section h2 {
    font-size: 1.75em;
  }
}

@media screen and (min-width: 800px) {
  section h2 {
    font-size: 2em;
  }
}

.max-width {
  max-width: 50.625rem;
  margin: 0 auto;
}
.mb-1 {
  margin-bottom: 1rem;
}
.mb-1point5{
  margin-bottom: 1.5rem;
}
.mb-2 {
  margin-bottom: 2rem;
}
.mt-1 {
  margin-top: 1rem;
}
.mt-1point5 {
  margin-top: 1.5rem;
}
.mt-2 {
  margin-top: 2rem;
}
.centered {
  text-align: center;
}
.border {
  border-left: 18px solid var(--orangebg);
  outline: 1px solid var(--gray);
  outline-offset: -9px;
  padding: 1.5em 1.5em 1.5em 1em;
}

.border h2 {
  color: var(--darkgray);
}

.padded {
  padding: 1.5rem 1rem;
}

.padded-sides {
  padding: 0 1rem;
}

@media screen and (min-width: 640px) {
  .padded {
    padding: 2rem;
  }
  .padded-sides {
    padding: 0 2rem;
  }
}

.right {
  text-align: right;
}

.asterix {
  font-family:Georgia,serif;
  font-weight:400;
}

.book-cover {
  border: 1px solid var(--darkgray);
  box-shadow: 10px 10px var(--gray);
  max-width: 13.5em;
}

.separator {
  position: relative;
  overflow: visible;
  width: 90%;
  border: none;
}
.separator::before {
  display: block;
  position: absolute;
  content: "";
  height: 18px;
  width: 30%;
  background-color: var(--orangebg);
  right: -9px;
  top: -9px;
}
.separator::after {
  display: block;
  content: "";
  border-bottom: 1px solid var(--gray);
  position: relative;
}
.separator.full {
  width: 100%;
}
.separator.left::before {
  left: -9px;
  right: auto;
}
.separator.embedded {
  display: inline-block;
  vertical-align: middle;
}

.youtube-embed {
  width: 100%;
  padding-bottom: 56.25%;
  position: relative;
}
.youtube-embed iframe {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

blockquote {
  position: relative;
}

blockquote:before {
    content: "\201C";
    font-size: 70px;
    font-family: Georgia, serif;
    display: block;
    position: absolute;
    left: -40px;
    line-height: 1;
    color: orange;
}

/*------------------------------------------------
  BLOCK CTA LINK BUTTONS
 ------------------------------------------------*/
.link-button {
  font-size: 1.2em;
  display: inline-block;
  background-color: var(--orange);
  color: var(--white);
  padding: 1em;
  font-weight: bold;
  text-decoration: none;
  order: 4;
  transition: 0.2s background-color ease-in-out;
  will-change: transition;
}

.link-button:visited {
  color: var(--white);
}

.link-button:hover {
  background-color: var(--pinkdark);
}

.link-button::after {
  content: "\2192";
  margin-left: 0.375em;
  transform: translateX(0);
  transition: 0.1s transform ease-in-out;
  display: inline-block;
  will-change: transform;
}

.link-button:hover::after {
  transform: translateX(0.375em);
}

/*------------------------------------------------
  HOMEPAGE
 ------------------------------------------------*/
.tmpl-home {
  padding: 0;
}

.intro {
  background-color: var(--orangebg);
}

.intro-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.name {
  order: 1;
  font-size: 2em;
  margin: 0 0 .5em;
  font-weight: 700;
  color: var(--darkgray);
}

@media screen and (min-width: 375px) {
  .name {
    font-size: 2.25em;
  }
}

.last {
  font-weight: 300;
}

.me {
  max-width: 11em;
  border-radius: 50%;
  border: 1px solid #45260D;
  order: 2;
}

.bio {
  font-size: 1.125em; /*18/16*/
  margin-left: .5em;
  margin-right: .5em;
  text-align: center;
  font-weight: 500;
  order: 3;
}

@media screen and (min-width: 640px) {
  .intro-wrap {
    display: block;
  }
  .me {
    float: left;
  }
  .name {
    font-size: 2.5em;
    margin-bottom: 0;
  }
  .name, .bio {
    text-align: left;
    margin-left: 12.5rem;
    margin-right: 0;
  }
  .bio {
    margin-top: .5em;
  }
}

@media screen and (min-width: 700px) {
  .name {
    font-size: 3em;
    margin-bottom: 0.5em;
  }
}
/* OSG SECTION */
.osg-wrap {
  display: flex;
  flex-direction: column;
}

.osg-ambigram {
  max-width: 16em;
  align-self: center;
}

.osg-ambigram img {
  width: 100%;
  height: auto;
}

.osg-desc {
  font-size: 1.25em; /*20/16*/
}

@media screen and (min-width: 640px) {
  .osg-wrap {
    flex-direction: row-reverse;
  }

  .osg-ambigram {
    margin-left: .5em;
    flex: 1;
    align-self: flex-start;
  }

  .osg-desc {
    flex: 1;
    margin-top: 0;
    align-self: center;
  }
}

@media screen and (min-width: 740px) {
  .osg-ambigram {
    align-self: center;
  }
}

.home-list {
  list-style: none;
}
.home-list > li {
  position: relative;
}
.home-list > li::before {
  display: inline-block;
  position: absolute;
  height: 1.5em;
  width: 1.5em;
  left: -2em;
  top: -0.25em;
  content: '';
  background-size: contain;
  background-repeat: no-repeat;
}

.home-list.talks > li:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns%23' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' viewBox='0 -256 1850 1850' id='svg3025' version='1.1' inkscape:version='0.48.3.1 r9886' width='100%25' height='100%25' sodipodi:docname='calendar_font_awesome.svg'%3E%3Cmetadata id='metadata3035'%3E%3Crdf:RDF%3E%3Ccc:Work rdf:about=''%3E%3Cdc:format%3Eimage/svg+xml%3C/dc:format%3E%3Cdc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage'/%3E%3C/cc:Work%3E%3C/rdf:RDF%3E%3C/metadata%3E%3Cdefs id='defs3033'/%3E%3Csodipodi:namedview pagecolor='%23ffffff' bordercolor='%23666666' borderopacity='1' objecttolerance='10' gridtolerance='10' guidetolerance='10' inkscape:pageopacity='0' inkscape:pageshadow='2' inkscape:window-width='640' inkscape:window-height='480' id='namedview3031' showgrid='false' inkscape:zoom='0.13169643' inkscape:cx='896' inkscape:cy='896' inkscape:window-x='0' inkscape:window-y='25' inkscape:window-maximized='0' inkscape:current-layer='svg3025'/%3E%3Cg transform='matrix(1,0,0,-1,91.118644,1297.8644)' id='g3027'%3E%3Cpath d='M 128,-128 H 416 V 160 H 128 v -288 z m 352,0 H 800 V 160 H 480 V -128 z M 128,224 H 416 V 544 H 128 V 224 z m 352,0 H 800 V 544 H 480 V 224 z M 128,608 H 416 V 896 H 128 V 608 z m 736,-736 h 320 V 160 H 864 V -128 z M 480,608 H 800 V 896 H 480 V 608 z m 768,-736 h 288 V 160 H 1248 V -128 z M 864,224 h 320 V 544 H 864 V 224 z m -352,864 v 288 q 0,13 -9.5,22.5 -9.5,9.5 -22.5,9.5 h -64 q -13,0 -22.5,-9.5 Q 384,1389 384,1376 v -288 q 0,-13 9.5,-22.5 9.5,-9.5 22.5,-9.5 h 64 q 13,0 22.5,9.5 9.5,9.5 9.5,22.5 z m 736,-864 h 288 V 544 H 1248 V 224 z M 864,608 h 320 V 896 H 864 V 608 z m 384,0 h 288 V 896 H 1248 V 608 z m 32,480 v 288 q 0,13 -9.5,22.5 -9.5,9.5 -22.5,9.5 h -64 q -13,0 -22.5,-9.5 -9.5,-9.5 -9.5,-22.5 v -288 q 0,-13 9.5,-22.5 9.5,-9.5 22.5,-9.5 h 64 q 13,0 22.5,9.5 9.5,9.5 9.5,22.5 z m 384,64 V -128 q 0,-52 -38,-90 -38,-38 -90,-38 H 128 q -52,0 -90,38 -38,38 -38,90 v 1280 q 0,52 38,90 38,38 90,38 h 128 v 96 q 0,66 47,113 47,47 113,47 h 64 q 66,0 113,-47 47,-47 47,-113 v -96 h 384 v 96 q 0,66 47,113 47,47 113,47 h 64 q 66,0 113,-47 47,-47 47,-113 v -96 h 128 q 52,0 90,-38 38,-38 38,-90 z' id='path3029' inkscape:connector-curvature='0' style='fill:currentColor'/%3E%3C/g%3E%3C/svg%3E");
}

.home-list.posts > li:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns%23' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' viewBox='0 -256 1792 1792' id='svg2' version='1.1' inkscape:version='0.48.3.1 r9886' width='100%25' height='100%25' sodipodi:docname='file_alt_font_awesome.svg'%3E%3Cmetadata id='metadata12'%3E%3Crdf:RDF%3E%3Ccc:Work rdf:about=''%3E%3Cdc:format%3Eimage/svg+xml%3C/dc:format%3E%3Cdc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage'/%3E%3C/cc:Work%3E%3C/rdf:RDF%3E%3C/metadata%3E%3Cdefs id='defs10'/%3E%3Csodipodi:namedview pagecolor='%23ffffff' bordercolor='%23666666' borderopacity='1' objecttolerance='10' gridtolerance='10' guidetolerance='10' inkscape:pageopacity='0' inkscape:pageshadow='2' inkscape:window-width='640' inkscape:window-height='480' id='namedview8' showgrid='false' inkscape:zoom='0.13169643' inkscape:cx='896' inkscape:cy='896' inkscape:window-x='0' inkscape:window-y='25' inkscape:window-maximized='0' inkscape:current-layer='svg2'/%3E%3Cg transform='matrix(1,0,0,-1,242.98305,1285.4237)' id='g4'%3E%3Cpath d='m 1024,352 v -64 q 0,-14 -9,-23 -9,-9 -23,-9 H 288 q -14,0 -23,9 -9,9 -9,23 v 64 q 0,14 9,23 9,9 23,9 h 704 q 14,0 23,-9 9,-9 9,-23 z m 0,256 v -64 q 0,-14 -9,-23 -9,-9 -23,-9 H 288 q -14,0 -23,9 -9,9 -9,23 v 64 q 0,14 9,23 9,9 23,9 h 704 q 14,0 23,-9 9,-9 9,-23 z M 128,0 H 1152 V 768 H 736 q -40,0 -68,28 -28,28 -28,68 v 416 H 128 V 0 z m 640,896 h 299 L 768,1195 V 896 z M 1280,768 V -32 q 0,-40 -28,-68 -28,-28 -68,-28 H 96 q -40,0 -68,28 -28,28 -28,68 v 1344 q 0,40 28,68 28,28 68,28 h 544 q 40,0 88,-20 48,-20 76,-48 l 408,-408 q 28,-28 48,-76 20,-48 20,-88 z' id='path6' inkscape:connector-curvature='0' style='fill:currentColor'/%3E%3C/g%3E%3C/svg%3E");
}
.home-list.posts > li.offsite:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='currentColor' d='M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z' class=''%3E%3C/path%3E%3C/svg%3E");
}
.home-list.past-talks > li.podcast:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='currentColor' d='M176 352c53.02 0 96-42.98 96-96V96c0-53.02-42.98-96-96-96S80 42.98 80 96v160c0 53.02 42.98 96 96 96zm160-160h-16c-8.84 0-16 7.16-16 16v48c0 74.8-64.49 134.82-140.79 127.38C96.71 376.89 48 317.11 48 250.3V208c0-8.84-7.16-16-16-16H16c-8.84 0-16 7.16-16 16v40.16c0 89.64 63.97 169.55 152 181.69V464H96c-8.84 0-16 7.16-16 16v16c0 8.84 7.16 16 16 16h160c8.84 0 16-7.16 16-16v-16c0-8.84-7.16-16-16-16h-56v-33.77C285.71 418.47 352 344.9 352 256v-48c0-8.84-7.16-16-16-16z' class=''%3E%3C/path%3E%3C/svg%3E");
}
.home-list.past-talks > li.conf:before {
  top: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath fill='currentColor' d='M336.2 64H47.8C21.4 64 0 85.4 0 111.8v288.4C0 426.6 21.4 448 47.8 448h288.4c26.4 0 47.8-21.4 47.8-47.8V111.8c0-26.4-21.4-47.8-47.8-47.8zm189.4 37.7L416 177.3v157.4l109.6 75.5c21.2 14.6 50.4-.3 50.4-25.8V127.5c0-25.4-29.1-40.4-50.4-25.8z' class=''%3E%3C/path%3E%3C/svg%3E");
}
.home-list.posts > h3 {
  margin-top: 0;
}
.expando {
  appearance: none;
  font-size: 1em;
  background: transparent;
  border: none;
  padding: .25em 0;
  margin: 0;
}
.expando-icon {
  height: 0.75em;
  width: 0.75em;
  display: inline-block;
  vertical-align: middle;
}
.expando[aria-expanded="true"] .vert {
  display: none;
}

/*------------------------------------------------
  SHARED ZINE MODULE
 ------------------------------------------------*/
.zine.padded {
  padding: 1.5em 1em 1.5em 0.5em;
}

.zine-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.zine-h {
  order: 1;
  color: var(--darkgray) !important;
}

.zine-cover {
  order: 2;
  margin-bottom: 2em;
}

.zine-desc {
  order: 3;
}

.zine-link {
  order: 4;
  margin-bottom: 1em;
  text-align: center;
}

.zine-noswears {
  order: 5;
}

@media screen and (min-width: 420px) {
  .zine-wrap {
    display: block;
  }
  .zine-h {
    margin-bottom: 0;
    margin-left: 46%;
  }
  .zine-desc {
    margin-left: 46%;
  }
  .zine-cover {
    float: left;
    margin-right: 6%;
    width: 40%;
  }
  .zine-link {
    clear: left;
  }
  .zine-noswears {
    display: block;
    clear: left;
  }
}

@media screen and (min-width: 570px) {
  .zine.padded {
    padding: 2.5em 2em 2.5em 1.5em;
  }
  .zine-cover {
    width: 33%;
  }
  .zine-h {
    margin-left: 39%;
  }
  .zine-desc {
    margin-left: 39%;
  }
  .zine-link {
    text-align: left;
    clear: initial;
  }
}

@media screen and (min-width: 680px) {
  .zine.padded {
    padding: 2.5em 3em 2.5em 3.5em;
  }
  .zine-cover {
    margin-bottom: 0;
  }
  .zine-h {
    font-size: 1.75em;
  }
  .zine-noswears {
    clear: none;
    margin-left: 39%;
  }
}

@media screen and (min-width: 780px) {
  .zine-h {
    font-size: 2em;
  }
  .zine-desc {
    margin-bottom: 2em;
  }
}

/*------------------------------------------------
  ALL PAGES
 ------------------------------------------------*/
.page-title {
  text-align: center;
}

.page-title h1 {
  text-align: center;
  font-size: 2.5em;
  font-weight: 300;
  margin: 0;
  color: var(--darkgray);
}

/*------------------------------------------------
  WRITING PAGE
 ------------------------------------------------*/
.dsh {
  display:flex;
  flex-direction: column;
  align-items: center;
}

.dsh-cover {
  margin-bottom: 1.5em;
  max-width: 13.5em;
}

.dsh-desc {
  text-align: center;
}

@media screen and (min-width: 540px){
  .dsh {
    flex-direction: row;
    align-items: start;
  }
  .dsh-cover {
    margin-right: 2em;
    margin-bottom: 0;
    flex: 1;
  }
  .dsh-desc {
    flex: 2;
    text-align: initial;
  }
}

@media screen and (min-width: 828px){
  .dsh-cover {
    flex: 3;
  }
  .dsh-desc {
    flex: 5;
  }
}

/*------------------------------------------------
  BLOG POSTS
 ------------------------------------------------*/
.post-header {
  text-align: center;
  position: relative;
}

.post-title {
  font-size: 2em;
  line-height: 1.3;
  padding: 0 .5em;
}
.post-title span {
  display: inline-block;
  font-size: .6em;
  margin-top: .5em;
}
.post-image-wrapper {
  position: relative;
}
.post-image {
  width: 100%;
  max-width: 100%;
  display: block;
  max-height: 80vh;
}
.post-image-credit {
  background-color: rgba(255, 255, 255, 0.95);
  padding: 0.25em;
  position: absolute;
  bottom: .5em;
  right: 0;
}

@media screen and (min-width: 600px) {
  .post-title {
    font-size: 2.5em;
  }
}

@media screen and (min-width: 800px) {
  .has-image .post-title {
    position: absolute;
    top: 25%;
    background-color: white;
    opacity: 0.9;
    width: 100%;
    padding: 1em;
    font-size: 2em;
  }
  .has-image .separator {
    margin-top: 0;
  }
}

@media screen and (min-width: 900px) {
  .has-image .post-title {
    font-size: 2.5em;
  }
}

@media screen and (min-width: 1000px) {
  .has-image .post-title {
    font-size: 3em;
  }
}

.post-date {
  display: block;
  text-align: left;
  font-weight: bold;
  margin-top: 2em;
}

.post-content p {
  line-height: 1.5;
}

@media screen and (min-width: 768px) {
  .post-content,
  .post-content p {
    font-size: 1.125em;
    line-height: 1.6;
  }
}

.post-navigation {
  list-style-type: none;
}

.post-offsite {
  font-weight: bold;
}

/*------------------------------------------------
  SPEAKING PAGE
 ------------------------------------------------*/
.talks-year {
  font-weight: 300;
}

/*------------------------------------------------
  ABOUT PAGE
 ------------------------------------------------*/
.hi {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (min-width: 600px) {
  .hi {
    flex-direction: row;
  }
  .hi .me {
    margin-right: 1em;
  }
}

.hi .me {
  order: initial;
}

/*------------------------------------------------
  UTILITIES
 ------------------------------------------------*/
.sr-only {
  position:absolute;
  left:-10000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}

.clear:after {
  content: "";
  display: table;
  clear: both;
}