@charset "UTF-8";
*, :after, :before { -ms-box-sizing: border-box; box-sizing: border-box; }

button, html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { font-size: 100%; }

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, input, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { margin: 0; padding: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

table { border-collapse: collapse; border-spacing: 0; }

caption, td, th { text-align: left; font-weight: 400; vertical-align: middle; }

b, mark, strong { font-weight: 700; font-style: inherit; }

address, dfn, em, i, q, var { font-style: italic; font-weight: inherit; }

a, ins, u { text-decoration: none; }

code, kbd, pre, samp { font-family: monospace; }

iframe { width: 100%; }

a { outline: 0; }

img { max-width: 100%; height: auto; border: none; }

input, select, textarea { font: inherit; }

button { cursor: pointer; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary, video { display: block; }

audio, canvas { display: inline-block; }

audio:not([controls]) { display: none; height: 0; }

[hidden] { display: none; }

html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; }

a:focus { outline: thin dotted; }

a:active, a:hover { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }

dfn { font-style: italic; }

hr { box-sizing: content-box; height: 0; }

mark { background: #ff0; color: #000; }

code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; }

pre { white-space: pre-wrap; }

q { quotes: "“" "”" "‘" "’"; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

img { border: 0; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

fieldset { border: 1px solid silver; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; padding: 0; }

button, input, select, textarea { font-family: inherit; font-size: 100%; margin: 0; }

button, input { line-height: normal; }

button, select { text-transform: none; }

button, html input[type=button], input[type=reset], input[type=submit] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; }

input[type=search] { -webkit-appearance: textfield; box-sizing: content-box; }

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea { overflow: auto; vertical-align: top; }

table { border-collapse: collapse; border-spacing: 0; }

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

.u-text--bold { font-weight: 700; }

.u-text--italic { font-style: italic; font-weight: 400; font-family: Georgia, serif; }

.u-text--small-caps { font-weight: 400; font-variant: small-caps; text-transform: lowercase; font-family: Georgia, serif; }

.u-text--regular { font-weight: 400; font-family: Georgia, serif; }

.island, .islet, .media, address, blockquote, dl, fieldset, figure, h1, h2, h3, h4, h5, h6, hgroup, hr, ol, p, pre, table, ul, video { margin-bottom: 25.2px; margin-bottom: 1.575rem; }

@media (min-width: 621px) { .island, .islet, .media, address, blockquote, dl, fieldset, figure, h1, h2, h3, h4, h5, h6, hgroup, hr, ol, p, pre, table, ul, video { margin-bottom: 28.8px; margin-bottom: 1.8rem; } }
dd { margin-bottom: 9px; margin-bottom: 0.5625rem; }

.widescreen, iframe { margin: 18px 0 36px 0; margin: 1.125rem 0 2.25rem 0; }

* { box-sizing: border-box; }

html { overflow-y: scroll; height: 100%; -webkit-text-size-adjust: 100%; background-color: var(--main-theme-color); }

body { font: 400 110%; font-weight: 400; font-family: Georgia, serif; line-height: 1.4; background-color: var(--background-color); color: var(--main-text-color); -moz-font-feature-settings: "liga" 1 !important; font-feature-settings: "liga" 1 !important; min-height: 100%; }

@media (min-width: 921px) { body { border-top: none; } }
.main { min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; }

cite { font-style: italic; font-weight: 400; font-family: Georgia, serif; font-style: normal; }

.italic, dfn, em, i, q, small { font-style: italic; font-weight: 400; font-family: Georgia, serif; }

mark { background-color: #ffdc00; background-color: rgba(255, 220, 0, 0.3); font-weight: 400; color: #444; }

.caps, abbr { font-weight: 400; font-variant: small-caps; text-transform: lowercase; font-family: Georgia, serif; }

abbr, abbr[title] { border: none; text-decoration: none; }

acronym { text-transform: normal; }

iframe { margin: 0 auto !important; }

img, video { max-width: 100%; }

pre code { display: block; padding: 15px; }

a { border: none; }

.links, .links a { color: var(--main-theme-color); overflow: hidden; position: relative; z-index: 1; transition: color .3s ease; text-decoration-skip: ink; }

.links a:focus, .links a:hover, .links:focus, .links:hover { text-decoration: none; color: var(--main-theme-color); border: none; }

.links--underline, .links--underline a { color: var(--main-theme-color); overflow: hidden; position: relative; z-index: 1; transition: color .3s ease; text-decoration-skip: ink; }

.links--underline a:focus, .links--underline a:hover, .links--underline:focus, .links--underline:hover { text-decoration: none; color: var(--main-theme-color); border: none; }

.links--dark a a, .links--dark a:link, .links--dark:link a, .links--dark:link:link { color: #777; }

h1, h2, h3, h4, h5, h6 { color: var(--heading-text-color); }

.is-darkMode h1, .is-darkMode h2, .is-darkMode h3, .is-darkMode h4, .is-darkMode h5, .is-darkMode h6 { color: #ddd; }

.h1, .m-longform .h1, .m-longform h1, h1 { font-weight: 600; font-family: Georgia, serif; font-size: 28px; font-size: 1.75rem; line-height: 1.15; margin-bottom: 20px; }

@media (min-width: 621px) { .h1, .m-longform .h1, .m-longform h1, h1 { font-size: 33px; font-size: 2.0625rem; line-height: 1.2; } }
@media (min-width: 921px) { .h1, .m-longform .h1, .m-longform h1, h1 { line-height: 1.2; font-size: 36px; font-size: 2.25rem; } }
.h2, .h3, .h4, .h5, h2, h3, h4, h5 { font-weight: 600; font-family: Georgia, serif; }

h2 { margin-bottom: .1em; }

.fonts-loaded .h2, .fonts-loaded h2 { font-size: 20px; font-size: 1.25rem; }

@media (min-width: 621px) { .fonts-loaded .h2, .fonts-loaded h2 { font-size: 25px; font-size: 1.5625rem; line-height: 1.3; } }
.m-longform .h2, .m-longform h2 { font-size: 22px; font-size: 1.375rem; line-height: 1.3; }

@media (min-width: 621px) { .m-longform .h2, .m-longform h2 { font-size: 24px; font-size: 1.5rem; line-height: 1.2; } }
@media (min-width: 921px) { .m-longform .h2, .m-longform h2 { font-size: 30px; font-size: 1.875rem; } }
.h3, .m-longform .h3, .m-longform h3, h3 { font-size: 22px; font-size: 1.375rem; line-height: 1.45; }

@media (min-width: 621px) { .h3, .m-longform .h3, .m-longform h3, h3 { font-size: 22px; font-size: 1.375rem; line-height: 1.55; } }
@media (min-width: 921px) { .h3, .m-longform .h3, .m-longform h3, h3 { font-size: 24px; font-size: 1.5rem; line-height: 1.2; } }
.h4, h4 { margin-bottom: 20px; }

.h4, .m-longform .h4, .m-longform h4, h4 { font-size: 17px; font-size: 1.0625rem; line-height: 1.3; }

@media (min-width: 621px) { .h4, .m-longform .h4, .m-longform h4, h4 { font-size: 17px; font-size: 1.0625rem; } }
.h5, .m-longform .h5, .m-longform h5, h5 { font-size: 16px; font-size: 1rem; line-height: 1.3; }

@media (min-width: 621px) { .h5, .m-longform .h5, .m-longform h5, h5 { font-size: 17px; font-size: 1.0625rem; } }
.h6, .m-longform .h6, .m-longform h6, h6 { font-size: 15px; font-size: .9375rem; line-height: 1.3; }

.fonts-loaded .m-heading__text, .m-heading__text { font-weight: 400; color: #333; max-width: 800px; font-weight: 600; font-family: Georgia, serif; }

@media (min-width: 921px) { .fonts-loaded .m-heading__text, .m-heading__text { font-size: 46px; font-size: 2.875rem; } }
body { color: #111; }

@media (min-width: 921px) { .layout-wrapper { display: grid; grid-template-columns: repeat(12, 1fr); grid-gap: 40px; } }
@media (min-width: 1101px) { .layout-wrapper { grid-gap: 50px; } }
.wrapper { margin: 0 auto; padding: 0 0px; }

@media (min-width: 621px) { .wrapper { max-width: 43em; } }
@media (min-width: 921px) { .wrapper { grid-column: 6/13; padding-right: 40px; padding-top: 30px; margin: 0; } }
.intro-img { margin-bottom: 40px; overflow: hidden; display: block; -o-object-fit: contain; object-fit: contain; background-color: #eee; }

@media (min-width: 621px) { .intro-img { margin-bottom: 60px; } }
@media (min-width: 921px) { .intro-img { margin-bottom: 0; grid-column: 1/6; position: -webkit-sticky; position: sticky; top: 0; height: 100vh; } }
.intro-img img { height: 30vh; display: block; -o-object-fit: cover; object-fit: cover; width: 100%; }

@media (min-width: 621px) { .intro-img img { height: 50vh; } }
@media (min-width: 921px) { .intro-img img { height: 100vh; } }
h1 { color: #000; font-family: Georgia, serif; font-size: 30px; margin-bottom: 20px; }

@media (min-width: 921px) { h1 { font-size: 35px; } }
.longform { padding-bottom: 100px; }

.longform p { font-size: 20px; line-height: 1.3; -webkit-hyphens: auto; -webkit-hyphenate-limit-after: 2; -webkit-hyphenate-limit-before: 3; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }

@media (min-width: 621px) { .longform p { font-size: 22px; } }
@media (min-width: 921px) { .longform p { font-size: 20px; } }
@media (min-width: 1101px) { .longform p { font-size: 22px; } }
code { font-size: 0.8em; }

em { font-style: normal !important; background-color: #fff2cc; }

.longform blockquote { border-left: 2px solid #ddd; padding-left: 15px; font-size: 1em; }

hr { opacity: 1; height: 1px; }

img { margin: 0; display: block; }

.last-img { margin-top: 100px; }

.meta, .post-meta { color: #777; }

::-moz-selection { background-color: #fff2cc; }

::selection { background-color: #fff2cc; }