/*
 * This file controls what is imported from /_sass
 *
 * Note that the files are processed in the order they are imported, so they are partly
   sorted by the dependencies. Also, the first two lines of the file are required by Jekyll.
 */
/* ==========================================================================
   SHARED THEME SETTINGS
   ========================================================================== */
/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */
/* Used to set the size for <em> */
/* Paragraph indention */
/* System typefaces */
/* Sans serif typefaces */
/* Serif typefaces */
/* Type scale */
/* ==========================================================================
   Breakpoints
   ========================================================================== */
/* ==========================================================================
   Grid
   ========================================================================== */
/* ==========================================================================
   BRAND COLORS
   ========================================================================== */
/* ==========================================================================
    DEFAULT THEME - LIGHT VERSION
    ========================================================================== */
/* Color codes used for the theme */
/* Color codes used for the site */
/* Other basic settings for the template */
/* Default light theme for the site */
:root {
  --global-base-color: #2f7f93;
  --global-bg-color: #fff;
  --global-footer-bg-color: #f2f3f3;
  --global-border-color: #f2f3f3;
  --global-dark-border-color: #bdc1c4;
  --global-code-background-color: #fafafa;
  --global-code-text-color: #313436;
  --global-fig-caption-color: mix(#fff, #494e52, 25%);
  --global-link-color: #52adc8;
  --global-link-color-hover: mix(#000, #2f7f93, 25%);
  --global-link-color-visited: mix(#fff, #2f7f93, 25%);
  --global-masthead-link-color: #494e52;
  --global-masthead-link-color-hover: mix(#000, #7a8288, 25%);
  --global-text-color: #494e52;
  --global-text-color-light: #bdc1c4;
  --global-thead-color: #f2f3f3; }

/* ==========================================================================
    DEFAULT THEME - DARK VERSION
    ========================================================================== */
/* Color codes used for the theme */
/* Color codes used for the site */
/* Other basic settings for the template */
/* Dark theme for the site */
html[data-theme="dark"] {
  --global-base-color: #0ea1c5;
  --global-bg-color: #474747;
  --global-footer-bg-color: #474747;
  --global-border-color: #bdc1c4;
  --global-dark-border-color: #dadada;
  --global-code-background-color: #fafafa;
  --global-code-text-color: #313436;
  --global-fig-caption-color: #bdc1c4;
  --global-link-color: #0ea1c5;
  --global-link-color-hover: #0b7994;
  --global-link-color-visited: #4ab9d4;
  --global-masthead-link-color: #ffffff;
  --global-masthead-link-color-hover: #0ea1c5;
  --global-text-color: #ffffff;
  --global-text-color-light: #f3f3f3;
  --global-thead-color: #ededed; }

/* ==========================================================================
   MIXINS
   ========================================================================== */
a:focus {
  /* Default*/
  outline: thin dotted #f89406;
  /* Webkit*/
  outline: 5px auto #f89406;
  outline-offset: -2px; }

/*
   em function
   ========================================================================== */
/*
   Bourbon clearfix
   ========================================================================== */
/*
  * Provides an easy way to include a clearfix for containing floats.
  * link http://cssmojo.com/latest_new_clearfix_so_far/
  *
  * example scss - Usage
  *
  * .element {
  *   @include clearfix;
  * }
  *
  * example css - CSS Output
  *
  * .element::after {
  *   clear: both;
  *   content: "";
  *   display: table;
  * }
*/
/* ==========================================================================
   STYLE RESETS
   ========================================================================== */
*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html {
  /* apply a natural box layout model to all elements */
  box-sizing: border-box;
  background-color: var(--global-bg-color);
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }
  @media (min-width: 48em) {
    html {
      font-size: 18px; } }

/* Remove margin */
body {
  margin: 0; }

/* Selected elements */
::-moz-selection {
  color: #fff;
  background: #000; }

::selection {
  color: #fff;
  background: #000; }

/* Display HTML5 elements in IE6-9 and FF3 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
  display: block; }

/* Display block in IE6-9 and FF3 */
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

/* Prevents modern browsers from displaying 'audio' without controls */
audio:not([controls]) {
  display: none; }

a {
  color: var(--global-link-color); }

/* Apply focus state */
/* Remove outline from links */
a:hover,
a:active {
  outline: 0; }

/* Prevent sub and sup affecting line-height in all browsers */
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* img border in anchor's and image quality */
img {
  /* Responsive images (ensure images don't scale beyond their parents) */
  max-width: 100%;
  /* part 1: Set a maximum relative to the parent*/
  width: auto\9;
  /* IE7-8 need help adjusting responsive images*/
  height: auto;
  /* part 2: Scale the height according to the width, otherwise you get stretching*/
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic; }

/* Prevent max-width from affecting Google Maps */
#map_canvas img,
.google-maps img {
  max-width: none; }

/* Consistent form font size in all browsers, margin changes, misc */
button,
input,
select,
textarea {
  margin: 0;
  font-size: 100%;
  vertical-align: middle; }

button,
input {
  *overflow: visible;
  /* inner spacing ie IE6/7*/
  line-height: normal;
  /* FF3/4 have !important on line-height in UA stylesheet*/ }

button::-moz-focus-inner,
input::-moz-focus-inner {
  /* inner padding and border oddities in FF3/4*/
  padding: 0;
  border: 0; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* corrects inability to style clickable `input` types in iOS*/
  cursor: pointer;
  /* improves usability and consistency of cursor style between image-type `input` and others*/ }

label,
select,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="radio"],
input[type="checkbox"] {
  cursor: pointer;
  /* improves usability and consistency of cursor style between image-type `input` and others*/ }

input[type="search"] {
  /* Appearance in Safari/Chrome*/
  box-sizing: content-box;
  -webkit-appearance: textfield; }

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  /* inner-padding issues in Chrome OSX, Safari 5*/ }

textarea {
  overflow: auto;
  /* remove vertical scrollbar in IE6-9*/
  vertical-align: top;
  /* readability and alignment cross-browser*/ }

/* ==========================================================================
   BASE ELEMENTS
   ========================================================================== */
html {
  /* sticky footer fix */
  position: relative;
  min-height: 100%;
  scroll-behavior: smooth; }

body {
  /* Set via _themes.scss */
  color: var(--global-text-color);
  background-color: var(--global-bg-color);
  margin: 0;
  padding: 70px 0 0;
  padding-bottom: 9em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  line-height: 1.5; }
  body.overflow--hidden {
    /* when primary navigation is visible, the content in the background won't scroll */
    overflow: hidden; }

h1, h2, h3, h4, h5, h6 {
  margin: 2em 0 0.5em;
  line-height: 1.2;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-weight: bold; }

h1 {
  margin-top: 0;
  font-size: 1.563em; }

h2 {
  font-size: 1.25em; }

h3 {
  font-size: 1em; }

h4 {
  font-size: 0.75em; }

h5 {
  font-size: 0.75em; }

h6 {
  font-size: 0.75em; }

small, .small {
  font-size: 0.75em; }

p {
  margin-bottom: 1.3em; }

u,
ins {
  text-decoration: none;
  border-bottom: 1px solid var(--global-text-color); }
  u a,
  ins a {
    color: inherit; }

del a {
  color: inherit; }

/* reduce orphans and widows when printing */
p, pre, blockquote, ul, ol, dl, figure, table, fieldset {
  orphans: 3;
  widows: 3; }

/* abbreviations */
abbr[title],
abbr[data-original-title] {
  text-decoration: none;
  cursor: help;
  border-bottom: 1px dotted var(--global-text-color); }

/* blockquotes */
blockquote {
  margin: 2em 1em 2em 0;
  padding-left: 1em;
  padding-right: 1em;
  font-style: italic;
  border-left: 0.25em solid var(--global-border-color); }
  blockquote cite {
    font-style: italic; }
    blockquote cite:before {
      content: "\2014";
      padding-right: 5px; }

/* links */
a:hover, a:active {
  outline: 0; }

/* code */
tt, code, kbd, samp, pre {
  font-family: Monaco, Consolas, "Lucida Console", monospace; }

pre {
  overflow-x: auto;
  /* add scrollbars to wide code blocks*/ }

a > code,
figcaption > code,
li > code,
p > code,
td > code {
  color: var(--global-code-text-color);
  padding-top: 0.1rem;
  padding-bottom: 0.1rem;
  font-size: 0.75em;
  background: var(--global-code-background-color);
  border: 1px solid var(--global-thead-color);
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); }
  a > code:before, a > code:after,
  figcaption > code:before,
  figcaption > code:after,
  li > code:before,
  li > code:after,
  p > code:before,
  p > code:after,
  td > code:before,
  td > code:after {
    letter-spacing: -0.2em;
    content: "\00a0";
    /* non-breaking space*/ }

a > code {
  color: inherit; }

pre > code {
  color: var(--global-code-text-color); }

/* horizontal rule */
hr {
  display: block;
  margin: 1em 0;
  border: 0;
  border-top: 1px solid var(--global-border-color); }

/* lists */
ul li,
ol li {
  margin-bottom: 0.5em; }

li ul,
li ol {
  margin-top: 0.5em; }

/*
   Media and embeds
   ========================================================================== */
/* Figures and images */
figure {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  align-items: flex-start;
  flex-wrap: wrap;
  margin: 2em 0; }
  figure img,
  figure iframe,
  figure .fluid-width-video-wrapper {
    margin-bottom: 1em; }
  figure img {
    width: 100%;
    border-radius: 4px;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }
  figure > a {
    display: block; }
  @media (min-width: 37.5em) {
    figure.half > a,
    figure.half > img {
      width: calc(50% - 0.5em); } }
  figure.half figcaption {
    width: 100%; }
  @media (min-width: 37.5em) {
    figure.third > a,
    figure.third > img {
      width: calc(33.3333% - 0.5em); } }
  figure.third figcaption {
    width: 100%; }

/* Figure captions */
figcaption {
  margin-bottom: 0.5em;
  color: var(--global-fig-caption-color);
  font-family: Georgia, Times, serif;
  font-size: 0.75em; }
  figcaption a {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid var(--global-border-color);
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }
    figcaption a:hover {
      color: #000;
      border-bottom-color: #000; }

/* Fix IE9 SVG bug */
svg:not(:root) {
  overflow: hidden; }

/*
   Navigation lists
   ========================================================================== */
/**
 * Removes margins, padding, and bullet points from navigation lists
 *
 * Example usage:
 * <nav>
 *    <ul>
 *      <li><a href="#link-1">Link 1</a></li>
 *      <li><a href="#link-2">Link 2</a></li>
 *      <li><a href="#link-3">Link 3</a></li>
 *    </ul>
 *  </nav>
 */
nav {
  /* override white-space for nested lists */ }
  nav ul {
    margin: 0;
    padding: 0; }
  nav li {
    list-style: none; }
  nav a {
    text-decoration: none; }
  nav ul li,
  nav ol li {
    margin-bottom: 0; }
  nav li ul,
  nav li ol {
    margin-top: 0; }

/* ==========================================================================
   ANIMATIONS
   ========================================================================== */
@-webkit-keyframes intro {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes intro {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/* Global animation transition */
b, i, strong, em, blockquote, p, q, span, figure, img, h1, h2, header, input, a, tr, td, form button, input[type="submit"], .btn, #goog-wm-sb, .highlight, .archive__item-teaser {
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */
/*
   Hide the following elements on print
   ========================================================================== */
@media print {
  .masthead,
  .toc,
  .page__share,
  .page__related,
  .ads,
  .page__footer {
    display: none; } }
/* ==========================================================================
   UTILITY CLASSES
   ========================================================================== */
/*
   Visibility
   ========================================================================== */
/* http://www.456bereastreet.com/archive/200711/screen_readers_sometimes_ignore_displaynone/ */
.hidden {
  display: none;
  visibility: hidden; }

/* for preloading images */
.load {
  display: none; }

.transparent {
  opacity: 0; }

/* https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html */
.visually-hidden,
.screen-reader-text,
.screen-reader-text span,
.screen-reader-shortcut {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px !important;
  width: 1px !important;
  border: 0 !important;
  overflow: hidden; }

body:hover .visually-hidden a,
body:hover .visually-hidden input,
body:hover .visually-hidden button {
  display: none !important; }

/* screen readers */
.screen-reader-text:focus,
.screen-reader-shortcut:focus {
  clip: auto !important;
  height: auto !important;
  width: auto !important;
  display: block;
  font-size: 1em;
  font-weight: bold;
  padding: 15px 23px 14px;
  background: var(--global-text-color);
  z-index: 100000;
  text-decoration: none;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); }

/*
   Skip links
   ========================================================================== */
.skip-link {
  position: fixed;
  z-index: 20;
  margin: 0;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  white-space: nowrap; }

.skip-link li {
  height: 0;
  width: 0;
  list-style: none; }

/*
   Type
   ========================================================================== */
.text-left {
  text-align: left; }

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

.text-right {
  text-align: right; }

.text-justify {
  text-align: justify; }

.text-nowrap {
  white-space: nowrap; }

/*
   Alignment
   ========================================================================== */
/* clearfix */
.cf {
  clear: both; }

.wrapper {
  max-width: 925px;
  margin-left: auto;
  margin-right: auto; }
  .wrapper:after {
    content: " ";
    display: block;
    clear: both; }

/* Source: http://snipplr.com/view/10979/css-cross-browser-word-wrap */
.wordwrap {
  white-space: pre-wrap;
  /* CSS3 */
  white-space: -moz-pre-wrap;
  /* Firefox */
  white-space: -pre-wrap;
  /* Opera <7 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  word-wrap: break-word;
  /* IE */ }

/*
   Images
   ========================================================================== */
/* image align left */
.align-left {
  display: block;
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 37.5em) {
    .align-left {
      float: left;
      margin-right: 1em; } }

/* image align right */
.align-right {
  display: block;
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 37.5em) {
    .align-right {
      float: right;
      margin-left: 1em; } }

/* image align center */
.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto; }

/* file page content container */
@media (min-width: 57.8125em) {
  .full {
    margin-right: -19.4915254237% !important; } }

/*
   Icons
   ========================================================================== */
.icon {
  display: inline-block;
  fill: currentColor;
  width: 1em;
  height: 1.1em;
  line-height: 1;
  position: relative;
  top: -0.1em;
  vertical-align: middle; }

/* Adjust this setting to control the space between an icon and text in the sidebar */
.icon-pad-right {
  padding-right: 0.5em;
  margin-right: 0.5em; }

/* social icons*/
.social-icons .fa {
  color: #000; }
.social-icons .fa-bluesky,
.social-icons .fa-bluesky-square {
  color: #1184fe; }
.social-icons .fa-behance,
.social-icons .fa-behance-square {
  color: #1769FF; }
.social-icons .fa-dribbble {
  color: #ea4c89; }
.social-icons .fa-facebook,
.social-icons .fa-facebook-square {
  color: #3b5998; }
.social-icons .fa-flickr {
  color: #ff0084; }
.social-icons .fa-foursquare {
  color: #0072b1; }
.social-icons .fa-google-plus,
.social-icons .fa-google-plus-square {
  color: #dd4b39; }
.social-icons .fa-instagram {
  color: #517fa4; }
.social-icons .fa-kaggle,
.social-icons .fa-kaggle-square {
  color: #20c0ff; }
.social-icons .fa-lastfm,
.social-icons .fa-lastfm-square {
  color: #d51007; }
.social-icons .fa-linkedin,
.social-icons .fa-linkedin-square {
  color: #007bb6; }
.social-icons .fa-mastodon,
.social-icons .fa-mastodon-square {
  color: #6364ff; }
.social-icons .ai-orcid,
.social-icons .ai-orcid-square {
  color: #a6ce39; }
.social-icons .fa-pinterest,
.social-icons .fa-pinterest-p,
.social-icons .fa-pinterest-square {
  color: #cb2027; }
.social-icons .fa-rss,
.social-icons .fa-rss-square {
  color: #fa9b39; }
.social-icons .fa-soundcloud {
  color: #ff3300; }
.social-icons .fa-stack-exchange,
.social-icons .fa-stack-overflow {
  color: #fe7a15; }
.social-icons .fa-tumblr,
.social-icons .fa-tumblr-square {
  color: #32506d; }
.social-icons .fa-twitter,
.social-icons .fa-twitter-square {
  color: #55acee; }
.social-icons .fa-vimeo,
.social-icons .fa-vimeo-square {
  color: #1ab7ea; }
.social-icons .fa-vine {
  color: #00bf8f; }
.social-icons .fa-youtube,
.social-icons .fa-youtube-square,
.social-icons .fa-youtube-play {
  color: #bb0000; }
.social-icons .fa-xing,
.social-icons .fa-xing-square {
  color: #006567; }

/*
   Navicons
   ========================================================================== */
.navicon {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 28px;
  height: 4px;
  background: var(--global-masthead-link-color);
  margin: auto;
  -webkit-transition: 0.3s;
  transition: 0.3s; }
  .navicon:before, .navicon:after {
    content: "";
    position: absolute;
    left: 0;
    width: 28px;
    height: 4px;
    background: var(--global-masthead-link-color);
    -webkit-transition: 0.3s;
    transition: 0.3s; }
  .navicon:before {
    top: -8px; }
  .navicon:after {
    bottom: -8px; }

.close .navicon {
  /* hide the middle line*/
  background: transparent;
  /* overlay the lines by setting both their top values to 0*/
  /* rotate the lines to form the x shape*/ }
  .close .navicon:before, .close .navicon:after {
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    top: 0;
    width: 28px; }
  .close .navicon:before {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg); }
  .close .navicon:after {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg); }

/*
   Sticky, fixed to top content
   ========================================================================== */
@media (min-width: 57.8125em) {
  .sticky {
    clear: both;
    position: -webkit-sticky;
    position: sticky;
    top: 2em; }
    .sticky::after {
      clear: both;
      content: "";
      display: table; }
    .sticky > * {
      display: block; } }

/*
   Wells
   ========================================================================== */
.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); }

/*
   Modals
   ========================================================================== */
.show-modal {
  overflow: hidden;
  position: relative; }
  .show-modal:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    background-color: rgba(255, 255, 255, 0.85); }
  .show-modal .modal {
    display: block; }

.modal {
  display: none;
  position: fixed;
  width: 300px;
  top: 50%;
  left: 50%;
  margin-left: -150px;
  margin-top: -150px;
  min-height: 0;
  z-index: 9999;
  background: var(--global-text-color);
  border: 1px solid var(--global-border-color);
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); }
  .modal__title {
    margin: 0;
    padding: 0.5em 1em; }
  .modal__supporting-text {
    padding: 0 1em 0.5em 1em; }
  .modal__actions {
    padding: 0.5em 1em;
    border-top: 1px solid var(--global-border-color); }

/*
   Footnotes
   ========================================================================== */
.footnote {
  color: var(--global-text-color-light);
  text-decoration: none; }

.footnotes {
  color: var(--global-text-color-light); }
  .footnotes ol, .footnotes li, .footnotes p {
    margin-bottom: 0;
    font-size: 0.75em; }

a.reversefootnote {
  color: var(--global-text-color-light);
  text-decoration: none; }
  a.reversefootnote:hover {
    text-decoration: underline; }

/*
   Required
   ========================================================================== */
.required {
  color: #ee5f5b;
  font-weight: bold; }

/* ==========================================================================
   TABLES
   ========================================================================== */
table {
  margin-bottom: 1em;
  width: 100%;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em;
  border-collapse: collapse;
  border: 1px solid var(--global-border-color); }
  table + table {
    margin-top: 1em; }

thead {
  background-color: var(--global-border-color);
  border-bottom: 1px solid var(--global-border-color); }

th {
  padding: 0.5em;
  font-weight: bold;
  text-align: left;
  border-right: 1px solid var(--global-border-color); }

td {
  padding: 0.5em;
  border-bottom: 1px solid var(--global-border-color);
  border-right: 1px solid var(--global-border-color); }

tr, td, th {
  vertical-align: middle; }

/* ==========================================================================
   BUTTONS
   ========================================================================== */
/*
   Default button
   ========================================================================== */
.btn, #goog-wm-sb {
  /* default button */
  display: inline-block;
  margin-bottom: 0.25em;
  padding: 0.5em 1em;
  color: #fff !important;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  background-color: var(--global-base-color);
  border: 0 !important;
  border-radius: 4px;
  cursor: pointer;
  /* fills width of parent container */
  /* for dark backgrounds */
  /* light outline */
  /* information */
  /* warning */
  /* success */
  /* danger */
  /* disabled */
  /* social buttons */
  /* extra large button */
  /* large button */
  /* small button */ }
  .btn:hover, #goog-wm-sb:hover {
    background-color: #333333; }
  .btn .icon, #goog-wm-sb .icon {
    margin-right: 0.5em; }
  .btn .icon + .hidden, #goog-wm-sb .icon + .hidden {
    margin-left: -0.5em;
    /* override for hidden text*/ }
  .btn--block {
    display: block;
    width: 100%; }
    .btn--block + .btn--block {
      margin-top: 0.25em; }
  .btn--inverse {
    color: var(--global-text-color-light) !important;
    border: 1px solid var(--global-border-color) !important;
    /* override*/
    background-color: var(--global-bg-color); }
    .btn--inverse:hover {
      color: #fff !important;
      border-color: var(--global-text-color-light); }
  .btn--light-outline {
    border: 1px solid #fff !important;
    /* override*/
    background-color: transparent; }
  .btn--info {
    background-color: #2f7f93; }
    .btn--info:hover {
      background-color: #266676; }
  .btn--warning {
    background-color: #f89406; }
    .btn--warning:hover {
      background-color: #c67605; }
  .btn--success {
    background-color: #62c462; }
    .btn--success:hover {
      background-color: #4e9d4e; }
  .btn--danger {
    background-color: #ee5f5b; }
    .btn--danger:hover {
      background-color: #be4c49; }
  .btn--disabled {
    pointer-events: none;
    cursor: not-allowed;
    filter: alpha(opacity=65);
    box-shadow: none;
    opacity: 0.65; }
  .btn--bluesky {
    background-color: #1184fe; }
    .btn--bluesky:hover {
      background-color: #0e6acb; }
  .btn--facebook {
    background-color: #3b5998; }
    .btn--facebook:hover {
      background-color: #2f477a; }
  .btn--google-plus {
    background-color: #dd4b39; }
    .btn--google-plus:hover {
      background-color: #b13c2e; }
  .btn--linkedin {
    background-color: #007bb6; }
    .btn--linkedin:hover {
      background-color: #006292; }
  .btn--mastodon {
    background-color: #6364ff; }
    .btn--mastodon:hover {
      background-color: #4f50cc; }
  .btn--twitter {
    background-color: #55acee; }
    .btn--twitter:hover {
      background-color: #448abe; }
  .btn--x-large {
    font-size: 1.25em; }
  .btn--large {
    font-size: 1em; }
  .btn--small {
    font-size: 0.6875em; }

/* ==========================================================================
   NOTICE TEXT BLOCKS
   ========================================================================== */
/**
 *  Default Kramdown usage (no indents!):
 *  <div class="notice" markdown="1">
 *  #### Headline for the Notice
 *  Text for the notice
 *  </div>
 */
/* Default notice */
.notice {
  margin: 2em 0 !important;
  /* override*/
  padding: 1em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em !important;
  text-indent: initial;
  /* override*/
  background-color: #f2f3f3;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(122, 130, 136, 0.25);
  color: var(--global-code-text-color); }
  .notice h4 {
    margin-top: 0 !important;
    /* override*/
    margin-bottom: 0.75em; }
  .page__content .notice h4 {
    /* using at-root to override .page-content h4 font size*/
    margin-bottom: 0;
    font-size: 1em; }
  .notice p:last-child {
    margin-bottom: 0 !important;
    /* override*/ }
  .notice h4 + p {
    /* remove space above paragraphs that appear directly after notice headline*/
    margin-top: 0;
    padding-top: 0; }
  .notice a {
    color: #7a8288; }
    .notice a:hover {
      color: #494e52; }
  .notice code {
    background-color: #f8f9f9; }
  .notice ul:last-child {
    margin-bottom: 0;
    /* override*/ }

/* Primary notice */
.notice--primary {
  margin: 2em 0 !important;
  /* override*/
  padding: 1em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em !important;
  text-indent: initial;
  /* override*/
  background-color: #f2f3f3;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(122, 130, 136, 0.25);
  color: var(--global-code-text-color); }
  .notice--primary h4 {
    margin-top: 0 !important;
    /* override*/
    margin-bottom: 0.75em; }
  .page__content .notice--primary h4 {
    /* using at-root to override .page-content h4 font size*/
    margin-bottom: 0;
    font-size: 1em; }
  .notice--primary p:last-child {
    margin-bottom: 0 !important;
    /* override*/ }
  .notice--primary h4 + p {
    /* remove space above paragraphs that appear directly after notice headline*/
    margin-top: 0;
    padding-top: 0; }
  .notice--primary a {
    color: #7a8288; }
    .notice--primary a:hover {
      color: #494e52; }
  .notice--primary code {
    background-color: #f8f9f9; }
  .notice--primary ul:last-child {
    margin-bottom: 0;
    /* override*/ }

/* Info notice */
.notice--info {
  margin: 2em 0 !important;
  /* override*/
  padding: 1em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em !important;
  text-indent: initial;
  /* override*/
  background-color: #eaf2f4;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(47, 127, 147, 0.25);
  color: var(--global-code-text-color); }
  .notice--info h4 {
    margin-top: 0 !important;
    /* override*/
    margin-bottom: 0.75em; }
  .page__content .notice--info h4 {
    /* using at-root to override .page-content h4 font size*/
    margin-bottom: 0;
    font-size: 1em; }
  .notice--info p:last-child {
    margin-bottom: 0 !important;
    /* override*/ }
  .notice--info h4 + p {
    /* remove space above paragraphs that appear directly after notice headline*/
    margin-top: 0;
    padding-top: 0; }
  .notice--info a {
    color: #2f7f93; }
    .notice--info a:hover {
      color: #1c4c58; }
  .notice--info code {
    background-color: #f5f9fa; }
  .notice--info ul:last-child {
    margin-bottom: 0;
    /* override*/ }

/* Warning notice */
.notice--warning {
  margin: 2em 0 !important;
  /* override*/
  padding: 1em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em !important;
  text-indent: initial;
  /* override*/
  background-color: #fef4e6;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(248, 148, 6, 0.25);
  color: var(--global-code-text-color); }
  .notice--warning h4 {
    margin-top: 0 !important;
    /* override*/
    margin-bottom: 0.75em; }
  .page__content .notice--warning h4 {
    /* using at-root to override .page-content h4 font size*/
    margin-bottom: 0;
    font-size: 1em; }
  .notice--warning p:last-child {
    margin-bottom: 0 !important;
    /* override*/ }
  .notice--warning h4 + p {
    /* remove space above paragraphs that appear directly after notice headline*/
    margin-top: 0;
    padding-top: 0; }
  .notice--warning a {
    color: #f89406; }
    .notice--warning a:hover {
      color: #955904; }
  .notice--warning code {
    background-color: #fffaf3; }
  .notice--warning ul:last-child {
    margin-bottom: 0;
    /* override*/ }

/* Success notice */
.notice--success {
  margin: 2em 0 !important;
  /* override*/
  padding: 1em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em !important;
  text-indent: initial;
  /* override*/
  background-color: #eff9ef;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(98, 196, 98, 0.25);
  color: var(--global-code-text-color); }
  .notice--success h4 {
    margin-top: 0 !important;
    /* override*/
    margin-bottom: 0.75em; }
  .page__content .notice--success h4 {
    /* using at-root to override .page-content h4 font size*/
    margin-bottom: 0;
    font-size: 1em; }
  .notice--success p:last-child {
    margin-bottom: 0 !important;
    /* override*/ }
  .notice--success h4 + p {
    /* remove space above paragraphs that appear directly after notice headline*/
    margin-top: 0;
    padding-top: 0; }
  .notice--success a {
    color: #62c462; }
    .notice--success a:hover {
      color: #3b763b; }
  .notice--success code {
    background-color: #f7fcf7; }
  .notice--success ul:last-child {
    margin-bottom: 0;
    /* override*/ }

/* Danger notice */
.notice--danger {
  margin: 2em 0 !important;
  /* override*/
  padding: 1em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em !important;
  text-indent: initial;
  /* override*/
  background-color: #fdefef;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(238, 95, 91, 0.25);
  color: var(--global-code-text-color); }
  .notice--danger h4 {
    margin-top: 0 !important;
    /* override*/
    margin-bottom: 0.75em; }
  .page__content .notice--danger h4 {
    /* using at-root to override .page-content h4 font size*/
    margin-bottom: 0;
    font-size: 1em; }
  .notice--danger p:last-child {
    margin-bottom: 0 !important;
    /* override*/ }
  .notice--danger h4 + p {
    /* remove space above paragraphs that appear directly after notice headline*/
    margin-top: 0;
    padding-top: 0; }
  .notice--danger a {
    color: #ee5f5b; }
    .notice--danger a:hover {
      color: #8f3937; }
  .notice--danger code {
    background-color: #fef7f7; }
  .notice--danger ul:last-child {
    margin-bottom: 0;
    /* override*/ }

/* ==========================================================================
   MASTHEAD
   ========================================================================== */
.masthead {
  position: fixed;
  background: var(--global-bg-color);
  height: fit-content;
  top: 0;
  width: 100%;
  -webkit-animation: intro 0.3s both;
  animation: intro 0.3s both;
  -webkit-animation-delay: 0.15s;
  animation-delay: 0.15s;
  z-index: 20; }
  .masthead::after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 1px;
    background: var(--global-border-color);
    width: 100%; }
  .masthead__inner-wrap {
    max-width: 925px;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    padding: 0.5em 1em;
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif; }
    .masthead__inner-wrap:after {
      content: " ";
      display: block;
      clear: both; }
    .masthead__inner-wrap::after {
      clear: both;
      content: "";
      display: table; }
    @media (min-width: 80em) {
      .masthead__inner-wrap {
        max-width: 1280px; } }
    .masthead__inner-wrap nav {
      z-index: 10; }
    .masthead__inner-wrap a {
      text-decoration: none; }

.masthead__menu ul {
  margin: 0;
  padding: 0;
  clear: both;
  list-style-type: none; }

.masthead__menu-item {
  background-color: var(--global-bg-color);
  display: block;
  list-style-type: none;
  white-space: nowrap; }
  .masthead__menu-item--lg {
    padding-right: 2em;
    font-weight: 700; }

.masthead__menu-item.selected a {
  color: var(--global-text-color);
  font-weight: 700;
  border-bottom: 2px solid var(--global-text-color);
  pointer-events: none;
  /* Move this here */
  cursor: default;
  /* Move this here too */ }

.masthead__menu-item.selected a:hover {
  color: var(--global-text-color);
  border-bottom: 2px solid var(--global-text-color);
  /* No need to repeat pointer-events and cursor here */ }

/* ==========================================================================
   NAVIGATION
   ========================================================================== */
/*
   Breadcrumb navigation links
   ========================================================================== */
.breadcrumbs {
  max-width: 925px;
  margin-left: auto;
  margin-right: auto;
  clear: both;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 2em;
  padding-right: 2em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  -webkit-animation: intro 0.3s both;
  animation: intro 0.3s both;
  -webkit-animation-delay: 0.30s;
  animation-delay: 0.30s; }
  .breadcrumbs:after {
    content: " ";
    display: block;
    clear: both; }
  .breadcrumbs::after {
    clear: both;
    content: "";
    display: table; }
  @media (min-width: 57.8125em) {
    .breadcrumbs {
      padding-left: 1em;
      padding-right: 1em; } }
  @media (min-width: 80em) {
    .breadcrumbs {
      max-width: 1280px; } }
  .breadcrumbs ol {
    padding: 0;
    list-style: none;
    font-size: 0.75em; }
    @media (min-width: 57.8125em) {
      .breadcrumbs ol {
        width: 83.0508474576%;
        float: right;
        margin-right: 0; } }
    @media (min-width: 80em) {
      .breadcrumbs ol {
        padding-left: 4.2372881356%; } }
  .breadcrumbs li {
    display: inline; }
  .breadcrumbs .current {
    font-weight: bold; }

/*
   Post pagination navigation links
   ========================================================================== */
.pagination {
  clear: both;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  clear: both;
  margin-top: 1em;
  padding-top: 1em;
  /* next/previous buttons */ }
  .pagination::after {
    clear: both;
    content: "";
    display: table; }
  .pagination ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif; }
  .pagination li {
    display: block;
    float: left;
    margin-left: -1px; }
    .pagination li a {
      margin-bottom: 0.25em;
      padding: 0.5em 1em;
      font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
      font-size: 14px;
      font-weight: bold;
      line-height: 1.5;
      text-align: center;
      text-decoration: none;
      color: var(--global-text-color-light);
      border: 1px solid var(--global-border-color);
      border-radius: 0; }
      .pagination li a:hover {
        color: var(--global-link-color-hover); }
      .pagination li a.current {
        color: #fff;
        background: var(--global-base-color); }
      .pagination li a.disabled {
        color: var(--global-text-color-light);
        pointer-events: none;
        cursor: not-allowed; }
    .pagination li:first-child {
      margin-left: 0; }
      .pagination li:first-child a {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px; }
    .pagination li:last-child a {
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px; }
  .pagination--pager {
    display: block;
    padding: 1em 2em;
    float: left;
    width: 50%;
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
    font-size: 1em;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    color: var(--global-text-color-light);
    border: 1px solid var(--global-border-color);
    border-radius: 4px; }
    .pagination--pager:hover {
      color: var(--global-link-color-hover); }
    .pagination--pager:first-child {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    .pagination--pager:last-child {
      margin-left: -1px;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0; }
    .pagination--pager.disabled {
      color: var(--global-text-color-light);
      pointer-events: none;
      cursor: not-allowed; }

.page__content + .pagination,
.page__meta + .pagination,
.comment__date + .pagination,
.page__share + .pagination,
.page__comments + .pagination {
  margin-top: 2em;
  padding-top: 2em;
  border-top: 1px solid var(--global-border-color); }

/*
   Priority plus navigation
   ========================================================================== */
.greedy-nav {
  position: relative;
  min-width: 250px;
  background: var(--global-bg-color); }
  .greedy-nav a {
    display: block;
    margin: 0 1rem;
    padding: 0.5rem 0;
    color: var(--global-masthead-link-color);
    text-decoration: none; }
    .greedy-nav a:hover {
      color: var(--global-masthead-link-color-hover); }
  .greedy-nav button {
    position: absolute;
    height: 2.5rem;
    right: 0;
    padding: 0 0.5rem;
    border: 0;
    outline: none;
    background-color: var(--global-bg-color);
    color: var(--global-text-color);
    cursor: pointer;
    z-index: 100; }
  .greedy-nav .visible-links {
    display: table; }
    .greedy-nav .visible-links li {
      display: table-cell;
      vertical-align: middle; }
      .greedy-nav .visible-links li:first-child {
        font-weight: bold;
        text-wrap: wrap; }
        .greedy-nav .visible-links li:first-child a {
          margin-left: 0; }
      .greedy-nav .visible-links li:last-child a {
        margin-right: 0; }
    .greedy-nav .visible-links #theme-toggle a {
      width: 25px;
      display: flex;
      justify-content: center;
      cursor: pointer; }
    .greedy-nav .visible-links a {
      position: relative; }
      .greedy-nav .visible-links a:before {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        height: 4px;
        background: var(--global-border-color);
        width: 100%;
        -webkit-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
        transform: scaleX(0);
        /* hide*/ }
      .greedy-nav .visible-links a:hover:before {
        -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
        /* reveal*/ }
  .greedy-nav .hidden-links {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 15px;
    padding: 5px;
    border: 1px solid var(--global-border-color);
    border-radius: 4px;
    background: var(--global-bg-color);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); }
    .greedy-nav .hidden-links a {
      margin: 0;
      padding: 10px 20px;
      font-size: 1em; }
      .greedy-nav .hidden-links a:hover {
        color: var(--global-masthead-link-color-hover);
        background: var(--global-border-color); }
    .greedy-nav .hidden-links:before {
      content: "";
      position: absolute;
      top: -11px;
      right: 10px;
      width: 0;
      border-style: solid;
      border-width: 0 10px 10px;
      border-color: var(--global-border-color) transparent;
      display: block;
      z-index: 0; }
    .greedy-nav .hidden-links:after {
      content: "";
      position: absolute;
      top: -10px;
      right: 10px;
      width: 0;
      border-style: solid;
      border-width: 0 10px 10px;
      border-color: var(--global-bg-color) transparent;
      display: block;
      z-index: 1; }
    .greedy-nav .hidden-links li {
      display: block;
      border-bottom: 1px solid var(--global-border-color); }
      .greedy-nav .hidden-links li:last-child {
        border-bottom: none; }

/*
   Navigation list
   ========================================================================== */
.nav__list {
  font-size: 1.25rem; }
  .nav__list ul {
    margin-bottom: 1em; }
  .nav__list a {
    display: block;
    padding: 0.125em 0;
    color: inherit; }
    .nav__list a:hover {
      text-decoration: underline; }
  .nav__list .active {
    margin-left: -0.5em;
    padding-left: 0.5em;
    padding-right: 0.5em;
    color: #fff;
    font-weight: bold;
    background: var(--global-base-color);
    border-radius: 4px; }
    .nav__list .active:hover {
      color: #fff; }

.nav__title {
  margin: 0;
  padding: 0.5rem 1rem;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 1em;
  font-weight: bold; }

.nav__sub-title {
  display: block;
  margin: 0.5rem 0;
  padding: 0.5rem 0;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em;
  font-weight: bold;
  text-transform: uppercase;
  border-bottom: 1px solid var(--global-border-color); }

/*
   Table of contents navigation
   ========================================================================== */
.toc {
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  color: var(--global-text-color-light);
  text-transform: uppercase;
  letter-spacing: 1px;
  background-color: #fff;
  border: 1px solid var(--global-border-color);
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); }
  .toc .nav__title {
    color: #fff;
    font-size: 0.75em;
    background: var(--global-base-color);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px; }

.toc__menu {
  margin: 0;
  padding: 0;
  width: 100%;
  list-style: none;
  font-size: 0.8rem;
  /* hide sub sub links on small screens*/ }
  .toc__menu a {
    display: block;
    padding: 0.5rem 1rem;
    color: var(--global-code-text-color);
    font-size: 0.6875em;
    font-weight: bold;
    line-height: 1.5;
    border-bottom: 1px solid var(--global-border-color);
    text-decoration-line: none !important; }
    .toc__menu a:hover {
      color: #000;
      background: var(--global-link-color-hover); }
  .toc__menu > li:last-child a {
    border-bottom: none; }
  .toc__menu li ul > li a {
    padding-left: 2rem;
    font-weight: normal; }
  .toc__menu li > ul li {
    display: none; }
    @media (min-width: 48em) {
      .toc__menu li > ul li {
        display: block; } }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.page__footer {
  clear: both;
  background-color: var(--global-footer-bg-color);
  color: var(--global-text-color-light);
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 3em;
  width: 100%;
  clear: both;
  /* keep footer in normal document flow so custom widgets do not overlap content */
  height: auto;
  /* keep the footer on the bottom of the page */
  position: fixed;
  bottom: 0;
  -webkit-animation: intro 0.3s both;
  animation: intro 0.3s both;
  -webkit-animation-delay: 0.45s;
  animation-delay: 0.45s;
  border-top: 1px solid var(--global-dark-border-color); }
  .page__footer::after {
    clear: both;
    content: "";
    display: table; }
  .page__footer footer {
    clear: both;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1em;
    max-width: 100%;
    padding: 0 1em 1em; }
    .page__footer footer::after {
      clear: both;
      content: "";
      display: table; }
    @media (min-width: 80em) {
      .page__footer footer {
        max-width: 1280px; } }
  .page__footer a {
    color: inherit;
    text-decoration: none; }
    .page__footer a:hover {
      text-decoration: underline; }
  .page__footer .fas,
  .page__footer .fab,
  .page__footer .far,
  .page__footer .fal {
    color: var(--global-text-color-light); }

@media screen and (max-width: 768px) {
  /* don't pin the footer on mobile devices */
  .page__footer {
    position: relative;
    bottom: auto; } }
.page__footer-copyright {
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.6875em; }

.page__footer-follow ul {
  margin: 0;
  padding: 0;
  list-style-type: none; }
.page__footer-follow li {
  display: inline-block;
  padding-top: 5px;
  padding-bottom: 5px;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em;
  text-transform: uppercase; }
.page__footer-follow li + li:before {
  content: "";
  padding-right: 5px; }
.page__footer-follow a {
  padding-right: 10px;
  font-weight: bold; }
.page__footer-follow .social-icons a {
  white-space: nowrap; }

/* ==========================================================================
   Syntax highlighting
   ========================================================================== */
div.highlighter-rouge, figure.highlight {
  position: relative;
  margin-bottom: 1em;
  padding: 1em;
  border: 1px solid var(--global-border-color);
  border-radius: 4px;
  background-color: var(--global-code-background-color);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125);
  font-size: 1.25em; }
  div.highlighter-rouge:before, figure.highlight:before {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.5em;
    background-color: #f2f3f3;
    content: "\f121";
    font-family: "Font Awesome 6 Free" !important;
    font-size: 0.75em;
    line-height: 1;
    text-transform: none;
    speak: none; }
  div.highlighter-rouge .highlight, figure.highlight .highlight {
    margin: 0;
    font-family: Monaco, Consolas, "Lucida Console", monospace;
    font-size: 0.75em;
    line-height: 1.8; }

.highlight table td {
  padding: 5px; }

.highlight table pre {
  margin: 0; }

/*
   Solarized Light
   http://ethanschoonover.com/solarized

   SOLARIZED HEX      ROLE
   --------- -------- ------------------------------------------
   base01    #586e75  body text / default code / primary content
   base1     #93a1a1  comments / secondary content
   base3     #fdf6e3  background
   orange    #cb4b16  constants
   red       #dc322f  regex, special keywords
   blue      #22b3eb  reserved keywords
   cyan      #2aa198  strings, numbers
   green     #859900  operators, other keywords
   ========================================================================== */
.highlight .c {
  color: #93a1a1; }

/* Comment */
.highlight .err {
  color: #586e75; }

/* Error */
.highlight .g {
  color: #586e75; }

/* Generic */
.highlight .k {
  color: #859900; }

/* Keyword */
.highlight .l {
  color: #586e75; }

/* Literal */
.highlight .n {
  color: #586e75; }

/* Name */
.highlight .o {
  color: #859900; }

/* Operator */
.highlight .x {
  color: #cb4b16; }

/* Other */
.highlight .p {
  color: #586e75; }

/* Punctuation */
.highlight .cm {
  color: #93a1a1; }

/* Comment.Multiline */
.highlight .cp {
  color: #859900; }

/* Comment.Preproc */
.highlight .c1 {
  color: #93a1a1; }

/* Comment.Single */
.highlight .cs {
  color: #859900; }

/* Comment.Special */
.highlight .gd {
  color: #2aa198; }

/* Generic.Deleted */
.highlight .ge {
  color: #586e75;
  font-style: italic; }

/* Generic.Emph */
.highlight .gr {
  color: #dc322f; }

/* Generic.Error */
.highlight .gh {
  color: #cb4b16; }

/* Generic.Heading */
.highlight .gi {
  color: #859900; }

/* Generic.Inserted */
.highlight .go {
  color: #586e75; }

/* Generic.Output */
.highlight .gp {
  color: #586e75; }

/* Generic.Prompt */
.highlight .gs {
  color: #586e75;
  font-weight: bold; }

/* Generic.Strong */
.highlight .gu {
  color: #cb4b16; }

/* Generic.Subheading */
.highlight .gt {
  color: #586e75; }

/* Generic.Traceback */
.highlight .kc {
  color: #cb4b16; }

/* Keyword.Constant */
.highlight .kd {
  color: #22b3eb; }

/* Keyword.Declaration */
.highlight .kn {
  color: #859900; }

/* Keyword.Namespace */
.highlight .kp {
  color: #859900; }

/* Keyword.Pseudo */
.highlight .kr {
  color: #22b3eb; }

/* Keyword.Reserved */
.highlight .kt {
  color: #dc322f; }

/* Keyword.Type */
.highlight .ld {
  color: #586e75; }

/* Literal.Date */
.highlight .m {
  color: #2aa198; }

/* Literal.Number */
.highlight .s {
  color: #2aa198; }

/* Literal.String */
.highlight .na {
  color: #586e75; }

/* Name.Attribute */
.highlight .nb {
  color: #B58900; }

/* Name.Builtin */
.highlight .nc {
  color: #22b3eb; }

/* Name.Class */
.highlight .no {
  color: #cb4b16; }

/* Name.Constant */
.highlight .nd {
  color: #22b3eb; }

/* Name.Decorator */
.highlight .ni {
  color: #cb4b16; }

/* Name.Entity */
.highlight .ne {
  color: #cb4b16; }

/* Name.Exception */
.highlight .nf {
  color: #22b3eb; }

/* Name.Function */
.highlight .nl {
  color: #586e75; }

/* Name.Label */
.highlight .nn {
  color: #586e75; }

/* Name.Namespace */
.highlight .nx {
  color: #586e75; }

/* Name.Other */
.highlight .py {
  color: #586e75; }

/* Name.Property */
.highlight .nt {
  color: #22b3eb; }

/* Name.Tag */
.highlight .nv {
  color: #22b3eb; }

/* Name.Variable */
.highlight .ow {
  color: #859900; }

/* Operator.Word */
.highlight .w {
  color: #586e75; }

/* Text.Whitespace */
.highlight .mf {
  color: #2aa198; }

/* Literal.Number.Float */
.highlight .mh {
  color: #2aa198; }

/* Literal.Number.Hex */
.highlight .mi {
  color: #2aa198; }

/* Literal.Number.Integer */
.highlight .mo {
  color: #2aa198; }

/* Literal.Number.Oct */
.highlight .sb {
  color: #93a1a1; }

/* Literal.String.Backtick */
.highlight .sc {
  color: #2aa198; }

/* Literal.String.Char */
.highlight .sd {
  color: #586e75; }

/* Literal.String.Doc */
.highlight .s2 {
  color: #2aa198; }

/* Literal.String.Double */
.highlight .se {
  color: #cb4b16; }

/* Literal.String.Escape */
.highlight .sh {
  color: #586e75; }

/* Literal.String.Heredoc */
.highlight .si {
  color: #2aa198; }

/* Literal.String.Interpol */
.highlight .sx {
  color: #2aa198; }

/* Literal.String.Other */
.highlight .sr {
  color: #dc322f; }

/* Literal.String.Regex */
.highlight .s1 {
  color: #2aa198; }

/* Literal.String.Single */
.highlight .ss {
  color: #2aa198; }

/* Literal.String.Symbol */
.highlight .bp {
  color: #22b3eb; }

/* Name.Builtin.Pseudo */
.highlight .vc {
  color: #22b3eb; }

/* Name.Variable.Class */
.highlight .vg {
  color: #22b3eb; }

/* Name.Variable.Global */
.highlight .vi {
  color: #22b3eb; }

/* Name.Variable.Instance */
.highlight .il {
  color: #2aa198; }

/* Literal.Number.Integer.Long */
/* ==========================================================================
   Forms
   ========================================================================== */
form {
  margin: 0 0 5px 0; }
  form fieldset {
    margin-bottom: 5px;
    padding: 0;
    border-width: 0; }
  form legend {
    display: block;
    width: 100%;
    margin-bottom: 10px;
    *margin-left: -7px;
    padding: 0;
    color: var(--global-text-color);
    border: 0;
    border-bottom: 1px solid #cccccc;
    white-space: normal; }
  form p {
    margin-bottom: 5px / 2; }
  form ul {
    list-style-type: none;
    margin: 0 0 5px 0;
    padding: 0; }
  form br {
    display: none; }

label,
input,
button,
select,
textarea {
  vertical-align: baseline;
  *vertical-align: middle; }

input,
button,
select,
textarea {
  box-sizing: border-box;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif; }

label {
  display: block;
  margin-bottom: 0.25em;
  color: var(--global-text-color);
  cursor: pointer; }
  label small {
    font-size: 0.75em; }
  label input,
  label textarea,
  label select {
    display: block; }

input,
textarea,
select {
  display: inline-block;
  width: 100%;
  padding: 0.25em;
  margin-bottom: 0.5em;
  color: var(--global-text-color);
  background-color: #fff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125); }
  input:hover,
  textarea:hover,
  select:hover {
    border-color: var(--global-base-color); }

.input-mini {
  width: 60px; }

.input-small {
  width: 90px; }

input[type="image"],
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  height: auto;
  padding: 0;
  margin: 3px 0;
  *margin-top: 0;
  line-height: normal;
  cursor: pointer;
  border-radius: 0;
  border: 0 \9; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
  *width: 13px;
  *height: 13px; }

input[type="image"] {
  border: 0;
  box-shadow: none; }

input[type="file"] {
  width: auto;
  padding: initial;
  line-height: initial;
  border: initial;
  background-color: transparent;
  background-color: initial;
  box-shadow: none; }

input[type="button"],
input[type="reset"],
input[type="submit"] {
  width: auto;
  height: auto;
  cursor: pointer;
  *overflow: visible; }

select,
input[type="file"] {
  *margin-top: 4px; }

select {
  width: auto;
  background-color: #fff; }

select[multiple],
select[size] {
  height: auto; }

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

input[type="hidden"] {
  display: none; }

.form {
  position: relative; }

.radio,
.checkbox {
  padding-left: 18px;
  font-weight: normal; }

.radio input[type="radio"],
.checkbox input[type="checkbox"] {
  float: left;
  margin-left: -18px; }

.radio.inline,
.checkbox.inline {
  display: inline-block;
  padding-top: 5px;
  margin-bottom: 0;
  vertical-align: middle; }

.radio.inline + .radio.inline,
.checkbox.inline + .checkbox.inline {
  margin-left: 10px; }

/*
   Disabled state
   ========================================================================== */
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
  opacity: 0.5;
  cursor: not-allowed; }

/*
   Focus & active state
   ========================================================================== */
input:focus,
textarea:focus {
  border-color: var(--global-border-color);
  outline: 0;
  outline: thin dotted \9; }

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus,
select:focus {
  box-shadow: none; }

/*
   Help text
   ========================================================================== */
.help-block,
.help-inline {
  color: #2f7f93; }

.help-block {
  display: block;
  margin-bottom: 1em;
  line-height: 1em; }

.help-inline {
  display: inline-block;
  vertical-align: middle;
  padding-left: 5px; }

/*
   .form-inline
   ========================================================================== */
.form-inline input,
.form-inline textarea,
.form-inline select {
  display: inline-block;
  margin-bottom: 0; }

.form-inline label {
  display: inline-block; }

.form-inline .radio,
.form-inline .checkbox,
.form-inline .radio {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle; }

.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
  float: left;
  margin-left: 0;
  margin-right: 3px; }

/*
   .form-search
   ========================================================================== */
.form-search input,
.form-search textarea,
.form-search select {
  display: inline-block;
  margin-bottom: 0; }

.form-search .search-query {
  padding-left: 14px;
  padding-right: 14px;
  margin-bottom: 0;
  border-radius: 14px; }

.form-search label {
  display: inline-block; }

.form-search .radio,
.form-search .checkbox,
.form-inline .radio {
  padding-left: 0;
  margin-bottom: 0;
  vertical-align: middle; }

.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"] {
  float: left;
  margin-left: 0;
  margin-right: 3px; }

/*
   .form--loading
   ========================================================================== */
.form--loading:before {
  content: ''; }

.form--loading .form__spinner {
  display: block; }

.form:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 10; }

.form__spinner {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 11; }

/*
   Google search form
   ========================================================================== */
#goog-fixurl ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0; }
  #goog-fixurl ul li {
    list-style-type: none; }

#goog-wm-qt {
  width: auto;
  margin-right: 10px;
  margin-bottom: 20px;
  padding: 8px 20px;
  display: inline-block;
  font-size: 0.75em;
  background-color: #fff;
  color: #000;
  border-width: 2px !important;
  border-style: solid !important;
  border-color: gray;
  border-radius: 4px; }

/* ==========================================================================
   SINGLE PAGE/POST
   ========================================================================== */
#main {
  max-width: 925px;
  margin-left: auto;
  margin-right: auto;
  clear: both;
  margin-top: 2em;
  padding-left: 1em;
  padding-right: 1em;
  animation: intro 0.3s both;
  animation-delay: 0.35s; }
  #main:after {
    content: " ";
    display: block;
    clear: both; }
  #main::after {
    clear: both;
    content: "";
    display: table; }
  @media (min-width: 80em) {
    #main {
      max-width: 1280px; } }

@media (min-width: 57.8125em) {
  .page {
    width: 83.0508474576%;
    float: right;
    margin-right: 0;
    padding-left: 4.2372881356%;
    padding-right: 16.9491525424%; } }
.page .page__inner-wrap {
  clear: both;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0; }
  .page .page__inner-wrap .page__content,
  .page .page__inner-wrap .page__meta,
  .page .page__inner-wrap .comment__date,
  .page .page__inner-wrap .page__share {
    clear: both;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0; }

.page__title {
  margin-top: 0;
  line-height: 1; }
  .page__title + .page__meta, .page__title + .comment__date {
    margin-top: -0.5em; }

.page__lead {
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 1.25em; }

.page__content {
  /* paragraph indents */
  /* blockquote citations */ }
  .page__content h2 {
    padding-bottom: 0.5em;
    border-bottom: 1px solid var(--global-border-color); }
  .page__content p, .page__content li, .page__content dl {
    font-size: 1em; }
  .page__content p {
    margin: 0 0 1.3em;
    /* sibling indentation*/ }
  .page__content a {
    text-decoration: underline; }
    .page__content a:hover {
      text-decoration: underline; }
      .page__content a:hover img {
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); }
  .page__content dt {
    margin-top: 1em;
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
    font-weight: bold; }
  .page__content dd {
    margin-left: 1em;
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
    font-size: 0.75em; }
  .page__content .small {
    font-size: 0.75em; }
  .page__content blockquote + .small {
    margin-top: -1.5em;
    padding-left: 1.25rem; }

.page__hero {
  position: relative;
  margin-bottom: 2em;
  clear: both;
  animation: intro 0.3s both;
  animation-delay: 0.25s; }
  .page__hero::after {
    clear: both;
    content: "";
    display: table; }
  .page__hero--overlay {
    position: relative;
    margin-bottom: 2em;
    padding: 3em 0;
    clear: both;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    animation: intro 0.3s both;
    animation-delay: 0.25s; }
    .page__hero--overlay::after {
      clear: both;
      content: "";
      display: table; }
    .page__hero--overlay a {
      color: #fff; }
    .page__hero--overlay .wrapper {
      padding-left: 1em;
      padding-right: 1em; }
      @media (min-width: 80em) {
        .page__hero--overlay .wrapper {
          max-width: 1280px; } }
    .page__hero--overlay .page__title,
    .page__hero--overlay .page__meta,
    .page__hero--overlay .comment__date,
    .page__hero--overlay .page__lead,
    .page__hero--overlay .btn,
    .page__hero--overlay #goog-wm-sb {
      color: #fff;
      text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5); }
    .page__hero--overlay .page__lead {
      max-width: 768px; }
    .page__hero--overlay .page__title {
      font-size: 1.953em; }
      @media (min-width: 37.5em) {
        .page__hero--overlay .page__title {
          font-size: 2.441em; } }

.page__hero-image {
  width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic; }

.page__hero-caption {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0 auto;
  padding: 2px 5px;
  color: #fff;
  font-family: Georgia, Times, serif;
  font-size: 0.6875em;
  background: #000;
  text-align: right;
  z-index: 5;
  opacity: 0.5;
  border-radius: 4px 0 4px 0; }
  @media (min-width: 57.8125em) {
    .page__hero-caption {
      padding: 5px 10px; } }
  .page__hero-caption a {
    color: #fff;
    text-decoration: none; }

/*
   Social sharing
   ========================================================================== */
.page__share {
  margin-top: 2em;
  padding-top: 1em;
  border-top: 1px solid var(--global-border-color); }
  @media (max-width: 37.5em) {
    .page__share .btn span, .page__share #goog-wm-sb span {
      border: 0;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px; } }

.page__share-title {
  margin-bottom: 10px;
  font-size: 0.75em;
  text-transform: uppercase; }

/*
   Page meta
   ========================================================================== */
.page__meta, .comment__date {
  margin-top: 2em;
  color: var(--global-text-color-light);
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 0.75em; }
  .page__meta p, .comment__date p {
    margin: 0; }
  .page__meta a, .comment__date a {
    color: inherit; }

.page__meta-title {
  margin-bottom: 10px;
  font-size: 0.75em;
  text-transform: uppercase; }

/*
   Page taxonomy
   ========================================================================== */
.page__taxonomy .sep {
  display: none; }
.page__taxonomy strong {
  margin-right: 10px; }

.page__taxonomy-item {
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 8px;
  padding: 5px 10px;
  text-decoration: none;
  border: 1px solid var(--global-border-color);
  border-radius: 4px; }
  .page__taxonomy-item:hover {
    text-decoration: none;
    color: var(--global-link-color-hover); }

/*
   Comments
   ========================================================================== */
.page__comments {
  clear: both;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0; }

.page__comments-title {
  margin-top: 2rem;
  margin-bottom: 10px;
  padding-top: 2rem;
  font-size: 0.75em;
  border-top: 1px solid var(--global-border-color);
  text-transform: uppercase; }

.page__comments-form {
  padding: 1em;
  background: var(--global-border-color);
  transition: all 0.2s ease-in-out; }
  .page__comments-form.disabled input,
  .page__comments-form.disabled button,
  .page__comments-form.disabled textarea,
  .page__comments-form.disabled label {
    pointer-events: none;
    cursor: not-allowed;
    filter: alpha(opacity=65);
    box-shadow: none;
    opacity: 0.65; }

.comment {
  clear: both;
  margin: 1em 0; }
  .comment::after {
    clear: both;
    content: "";
    display: table; }
  .comment:not(:last-child) {
    border-bottom: 1px solid var(--global-border-color); }

.comment__avatar-wrapper {
  float: left;
  width: 60px;
  height: 60px; }
  @media (min-width: 57.8125em) {
    .comment__avatar-wrapper {
      width: 100px;
      height: 100px; } }

.comment__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%; }
  @media (min-width: 57.8125em) {
    .comment__avatar {
      width: 80px;
      height: 80px;
      padding: 5px;
      border: 1px solid var(--global-border-color); } }

.comment__content-wrapper {
  float: right;
  width: calc(100% - 60px); }
  @media (min-width: 57.8125em) {
    .comment__content-wrapper {
      width: calc(100% - 100px); } }

.comment__author {
  margin: 0; }
  .comment__author a {
    text-decoration: none; }

.comment__date {
  margin: 0; }
  .comment__date a {
    text-decoration: none; }

/*
   Related
   ========================================================================== */
.page__related {
  margin-top: 2em;
  padding-top: 1em;
  border-top: 1px solid var(--global-border-color);
  clear: both;
  float: left; }
  .page__related::after {
    clear: both;
    content: "";
    display: table; }
  @media (min-width: 57.8125em) {
    .page__related {
      margin-left: 21.186440678%; } }
  .page__related a {
    color: inherit;
    text-decoration: none; }

.page__related-title {
  margin-bottom: 10px;
  font-size: 0.75em;
  text-transform: uppercase; }

/* ==========================================================================
   ARCHIVE
   ========================================================================== */
.archive {
  margin-bottom: 2em; }
  @media (min-width: 48em) {
    .archive {
      width: 100%;
      float: left;
      margin-left: 0;
      margin-right: 0; } }
  @media (min-width: 57.8125em) {
    .archive {
      width: 83.0508474576%;
      float: right;
      margin-right: 0;
      padding-left: 4.2372881356%; } }
  .archive a {
    text-decoration: underline; }
    .archive a:hover {
      text-decoration: underline; }
      .archive a:hover img {
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); }

.archive__subtitle {
  margin: 1.414em 0 0;
  padding-bottom: 0.5em;
  font-size: 1em;
  color: var(--global-text-color-light);
  border-bottom: 1px solid var(--global-border-color); }
  .archive__subtitle + .list__item .archive__item-title {
    margin-top: 0.5em; }

.archive__item-title {
  margin-bottom: 0.25em;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif; }
  .archive__item-title a + a {
    opacity: 0.5; }

/* remove border*/
.page__content .archive__item-title {
  margin-top: 1em;
  border-bottom: none; }

.archive__item-excerpt {
  margin-top: 0;
  font-size: 0.75em; }
  .archive__item-excerpt + p {
    text-indent: 0; }

.archive__item-teaser {
  border-radius: 4px;
  overflow: hidden; }
  .archive__item-teaser img {
    width: 100%; }

.archive__item:hover .archive__item-teaser {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); }
.archive__item:hover .archive__item-title {
  text-decoration: underline; }

/*
   List view
   ========================================================================== */
@media (min-width: 48em) {
  .list__item {
    padding-right: auto; } }
@media (min-width: 57.8125em) {
  .list__item {
    padding-right: auto; } }
@media (min-width: 80em) {
  .list__item {
    padding-right: auto; } }
.list__item .page__meta, .list__item .comment__date {
  margin: 0 0 4px; }

/*
   Grid view
   ========================================================================== */
.grid__item {
  margin-bottom: 2em; }
  .grid__item .page__meta, .grid__item .comment__date {
    margin: 0 0 4px; }
  .grid__item .archive__item-title {
    margin-top: 0.5em;
    font-size: 1em; }
  .grid__item .archive__item-excerpt {
    display: none; }
  @media (min-width: 37.5em) {
    .grid__item {
      width: 48.9795918367%;
      float: left; }
      .grid__item:nth-child(2n + 1) {
        margin-left: 0;
        margin-right: -100%;
        clear: both;
        margin-left: 0; }
      .grid__item:nth-child(2n + 2) {
        margin-left: 51.0204081633%;
        margin-right: -100%;
        clear: none; }
      .grid__item .archive__item-teaser {
        max-height: 200px; } }
  @media (min-width: 48em) {
    .grid__item {
      margin-left: 0;
      /* reset before mixin does its thing*/
      margin-right: 0;
      /* reset before mixin does its thing*/
      width: 23.4693877551%;
      float: left; }
      .grid__item:nth-child(4n + 1) {
        margin-left: 0;
        margin-right: -100%;
        clear: both;
        margin-left: 0; }
      .grid__item:nth-child(4n + 2) {
        margin-left: 25.5102040816%;
        margin-right: -100%;
        clear: none; }
      .grid__item:nth-child(4n + 3) {
        margin-left: 51.0204081633%;
        margin-right: -100%;
        clear: none; }
      .grid__item:nth-child(4n + 4) {
        margin-left: 76.5306122449%;
        margin-right: -100%;
        clear: none; }
      .grid__item .archive__item-teaser {
        max-height: 120px; }
      .grid__item .archive__item-excerpt {
        display: block;
        font-size: 0.75em; } }

/*
   Features
   ========================================================================== */
.feature__wrapper {
  clear: both;
  margin-bottom: 2em;
  border-bottom: 1px solid var(--global-border-color); }
  .feature__wrapper::after {
    clear: both;
    content: "";
    display: table; }

.feature__item {
  margin-bottom: 2em;
  font-size: 1.25rem; }
  @media (min-width: 37.5em) {
    .feature__item {
      margin-bottom: 0;
      width: 32.2033898305%;
      float: left; }
      .feature__item:nth-child(3n + 1) {
        margin-left: 0;
        margin-right: -100%;
        clear: both;
        margin-left: 0; }
      .feature__item:nth-child(3n + 2) {
        margin-left: 33.8983050847%;
        margin-right: -100%;
        clear: none; }
      .feature__item:nth-child(3n + 3) {
        margin-left: 67.7966101695%;
        margin-right: -100%;
        clear: none; }
      .feature__item .feature__item-teaser {
        max-height: 200px;
        overflow: hidden; } }
  .feature__item--left {
    clear: both;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    font-size: 1.25rem; }
    .feature__item--left .archive__item-teaser {
      margin-bottom: 2em; }
    @media (min-width: 37.5em) {
      .feature__item--left .archive__item-teaser {
        width: 40.6779661017%;
        float: left;
        margin-right: 1.6949152542%; }
      .feature__item--left .archive__item-body {
        width: 57.6271186441%;
        float: right;
        margin-right: 0;
        padding-left: 4.2372881356%;
        padding-right: 8.4745762712%; } }
  .feature__item--right {
    clear: both;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    font-size: 1.25rem; }
    .feature__item--right .archive__item-teaser {
      margin-bottom: 2em; }
    @media (min-width: 37.5em) {
      .feature__item--right {
        text-align: right; }
        .feature__item--right .archive__item-teaser {
          width: 40.6779661017%;
          float: right;
          margin-left: 1.6949152542%; }
        .feature__item--right .archive__item-body {
          width: 57.6271186441%;
          float: left;
          margin-left: 0;
          padding-left: 4.2372881356%;
          padding-right: 8.4745762712%; } }
  .feature__item--center {
    clear: both;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    font-size: 1.25rem; }
    .feature__item--center .archive__item-teaser {
      margin-bottom: 2em; }
    @media (min-width: 37.5em) {
      .feature__item--center {
        text-align: center; }
        .feature__item--center .archive__item-teaser {
          margin: 0 auto;
          width: 40.6779661017%; }
        .feature__item--center .archive__item-body {
          margin: 0 auto;
          width: 57.6271186441%; } }

/* ==========================================================================
   SIDEBAR
   ========================================================================== */
/*
   Default
   ========================================================================== */
.sidebar {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  clear: both;
  margin-bottom: 1em; }
  .sidebar::after {
    clear: both;
    content: "";
    display: table; }
  @media (orientation: portrait) {
    .sidebar {
      margin-top: 1em; } }
  @media screen and (min-width: 1024px) {
    .sidebar {
      height: 100vh;
      overflow-y: auto;
      position: fixed;
      padding-top: 70px; } }
  @media (min-width: 57.8125em) {
    .sidebar {
      width: 15.2542372881%;
      float: left;
      margin-right: 1.6949152542%;
      opacity: 1;
      -webkit-transition: opacity 0.2s ease-in-out;
      transition: opacity 0.2s ease-in-out; }
      .sidebar:hover {
        opacity: 1; } }
  @media (min-width: 80em) {
    .sidebar {
      max-width: 250px;
      padding-right: 0; } }
  .sidebar h2, .sidebar h3, .sidebar h4, .sidebar h5, .sidebar h6 {
    margin-bottom: 0;
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif; }
  .sidebar h3, .sidebar h4 {
    font-size: 1em; }
  .sidebar p, .sidebar li {
    font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
    font-size: 0.75em;
    line-height: 1.5; }
  .sidebar img {
    width: 100%; }

.sidebar__right {
  margin-bottom: 1em; }
  @media (min-width: 57.8125em) {
    .sidebar__right {
      position: relative;
      float: right;
      width: auto;
      margin-left: 2.5423728814%;
      z-index: 10; } }
  @media (min-width: 80em) {
    .sidebar__right {
      width: auto; } }

/*
   Table of contents
   ========================================================================== */
.toc {
  background-color: var(--global-bg-color);
  border: 1px solid var(--global-border-color);
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.125);
  padding: 1em; }
  .toc .nav__title {
    color: var(--global-text-color);
    font-size: 0.75em;
    background: transparent;
    border: 0;
    padding: 0; }
  .toc .toc__menu {
    margin: 0;
    padding: 0;
    width: 100%;
    list-style: none;
    font-size: 0.75em; }
    .toc .toc__menu a {
      display: block;
      padding: 0.25rem 0;
      color: var(--global-text-color);
      font-size: 0.6875em;
      font-weight: normal;
      line-height: 1.5;
      border-bottom: 0; }
      .toc .toc__menu a:hover {
        text-decoration: underline; }
    .toc .toc__menu > li > a {
      font-weight: bold; }
    .toc .toc__menu li ul > li a {
      padding-left: 1rem;
      font-weight: normal; }
    .toc .toc__menu li ul li ul > li a {
      padding-left: 2rem; }
    .toc .toc__menu li ul li ul li ul > li a {
      padding-left: 3rem; }

/*
   Author profile and links
   ========================================================================== */
.author__avatar {
  display: table-cell;
  vertical-align: top;
  width: 36px; }
  @media (min-width: 57.8125em) {
    .author__avatar {
      display: block;
      width: auto;
      height: auto; } }
  .author__avatar img {
    max-width: 175px;
    border-radius: 50%; }
    @media (min-width: 57.8125em) {
      .author__avatar img {
        padding: 5px;
        border: 1px solid var(--global-border-color); } }

.author__content {
  display: table-cell;
  vertical-align: top;
  padding-left: 15px;
  padding-right: 25px;
  line-height: 1; }
  @media (min-width: 57.8125em) {
    .author__content {
      display: block;
      width: 100%;
      padding-left: 0;
      padding-right: 0; } }

.author__name {
  margin: 0; }
  @media (min-width: 57.8125em) {
    .author__name {
      margin-top: 10px;
      margin-bottom: 10px; } }

.sidebar .author__name {
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  font-size: 1em; }

.sidebar .author__desktop {
  display: none; }
  @media screen and (min-width: 1024px) {
    .sidebar .author__desktop {
      display: block; } }

.author__pronouns {
  margin: 0; }
  @media (min-width: 57.8125em) {
    .author__pronouns {
      margin-top: 10px;
      margin-bottom: 10px; } }

.author__bio {
  margin: 0; }
  @media (min-width: 57.8125em) {
    .author__bio {
      margin-top: 10px;
      margin-bottom: 20px; } }

.author__urls-wrapper {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
  z-index: 10;
  position: relative;
  cursor: pointer; }
  .author__urls-wrapper li:last-child a {
    margin-bottom: 0; }
  @media (min-width: 57.8125em) {
    .author__urls-wrapper {
      display: block; } }
  .author__urls-wrapper button {
    margin-bottom: 0; }
    @media (min-width: 57.8125em) {
      .author__urls-wrapper button {
        display: none; } }

.author__urls {
  display: none;
  position: absolute;
  right: 0;
  margin-top: 15px;
  padding: 10px;
  list-style-type: none;
  border: 1px solid var(--global-border-color);
  border-radius: 4px;
  background: var(--global-bg-color);
  z-index: -1;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  cursor: default; }
  @media (min-width: 57.8125em) {
    .author__urls {
      display: block;
      position: relative;
      margin: 0;
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none; } }
  .author__urls:before {
    display: block;
    content: "";
    position: absolute;
    top: -11px;
    left: calc(50% - 10px);
    width: 0;
    border-style: solid;
    border-width: 0 10px 10px;
    border-color: var(--global-border-color) transparent;
    z-index: 0; }
    @media (min-width: 57.8125em) {
      .author__urls:before {
        display: none; } }
  .author__urls:after {
    display: block;
    content: "";
    position: absolute;
    top: -10px;
    left: calc(50% - 10px);
    width: 0;
    border-style: solid;
    border-width: 0 10px 10px;
    border-color: #fff transparent;
    z-index: 1; }
    @media (min-width: 57.8125em) {
      .author__urls:after {
        display: none; } }
  .author__urls li {
    white-space: nowrap; }
  .author__urls a {
    display: block;
    margin-bottom: 5px;
    padding-right: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
    color: inherit;
    font-size: 1em;
    text-decoration: none; }
    .author__urls a:hover {
      text-decoration: underline; }

/* ==========================================================================
   JSON CV
   ========================================================================== */
/* CV Template Styles */
.cv-container {
  max-width: 1000px;
  margin: 0 auto;
  font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--global-text-color);
  line-height: 1.6; }

/* Header Styles */
.cv-header {
  margin-bottom: 2rem;
  border-bottom: 2px solid var(--global-thead-color);
  padding-bottom: 1rem; }

.cv-header h1 {
  margin-bottom: 0.5rem;
  color: var(--global-text-color); }

.cv-contact-info {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 0.5rem; }

.cv-contact-item {
  display: flex;
  align-items: center;
  gap: 0.5rem; }

.cv-profiles {
  display: flex;
  gap: 1rem;
  margin-top: 0.5rem; }

.cv-profile-item {
  display: flex;
  align-items: center;
  gap: 0.5rem; }

.cv-profile-item a {
  color: var(--global-link-color);
  text-decoration: none; }

.cv-profile-item a:hover {
  text-decoration: underline; }

/* Section Styles */
.cv-section {
  margin-bottom: 2rem; }

.cv-section h2 {
  border-bottom: 1px solid var(--global-border-color);
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--global-text-color); }

.cv-section h2 i {
  color: var(--global-text-color); }

/* Item Styles */
.cv-item {
  margin-bottom: 1.5rem; }

.cv-list {
  list-style-type: none; }

.cv-item-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.5rem; }

.cv-item-title {
  font-weight: bold;
  font-size: 1.1rem; }

.cv-item-date {
  color: var(--global-text-color); }

.cv-item-subtitle {
  color: var(--global-text-color);
  margin-bottom: 0.5rem; }

.cv-item-summary {
  margin-bottom: 0.5rem; }

.cv-item-highlights {
  margin-top: 0.5rem;
  padding-left: 1.5rem; }

.cv-item-highlights li {
  margin-bottom: 0.25rem; }

.cv-item-courses li {
  margin-bottom: 0.25rem; }

/* Skills Styles */
.cv-skills {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem; }

.cv-skill-category h3 {
  margin-bottom: 0.5rem;
  color: var(--global-text-color); }

.cv-skill-keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem; }

.cv-skill-keyword {
  background-color: var(--global-bg-color);
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-size: 0.9rem; }

/* Project Styles */
.cv-project-keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem; }

.cv-project-keyword {
  background-color: var(--global-bg-color);
  color: var(--global-thead-color);
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-size: 0.9rem; }

/* Languages Styles */
.cv-languages {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem; }

.cv-language {
  display: flex;
  flex-direction: column; }

.cv-language-name {
  font-weight: bold; }

.cv-language-fluency {
  color: var(--global-text-color);
  font-size: 0.9rem; }

/* Interests Styles */
.cv-interests {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem; }

.cv-interest h3 {
  margin-bottom: 0.5rem;
  color: var(--global-text-color); }

.cv-interest-keywords {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem; }

.cv-interest-keyword {
  background-color: var(--global-bg-color);
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-size: 0.9rem; }

/* References Styles */
.cv-references {
  font-style: italic;
  color: var(--global-text-color); }

/* Print Styles */
@media print {
  .cv-container {
    max-width: 100%; }

  .cv-header {
    border-bottom-color: var(--global-border-color); }

  .cv-section h2 {
    border-bottom-color: var(--global-border-color); }

  .cv-skill-keyword,
  .cv-project-keyword,
  .cv-interest-keyword {
    border: 1px solid var(--global-border-color);
    background-color: transparent; } }