html{
  --color-mode: 'lit';
  --light: #fff;
  --dark: #000;
  --bg: #002538;
  --haze: #f2f2f2;
  --gray: #020202;
  --accent: var(--gray);
  --text: #575757;
  --header-text: var(--dark);
  --font: Metropolis, sans-serif;
  --theme: #0077b8;
  --ease: cubic-bezier(.19,1,.22,1);
  --code-bg: var(--bg);
  --table-bg: var(--light);
  --table-haze: var(--haze);
  --table-border: #dedede;
  --footer-bg: var(--haze);
  --shadow: rgba(0,0,0,0.12);
  --translucent: rgba(0,0,0,0.05);
  --translucent-light: rgba(255,255,255,0.05);
  --post-bg: var(--light);
  --choice-bg: var(--haze);
  --ease: cubic-bezier(0.39, 0.575, 0.565, 1);
  --easing: cubic-bezier(.19,1,.22,1);
  --notice-code-bg: var(--bg);
  --notice-info-border-color: #6AB0DE;
  --notice-info-background: #E7F2FA;
  --notice-note-border-color: #F0B37E;
  --notice-note-background: #FFF2DB;
  --notice-tip-border-color: rgba(92, 184, 92, 0.8);
  --notice-tip-background: #E6F9E6;
  --notice-warning-border-color: rgba(217, 83, 79, 0.8);
  --notice-warning-background: #FAE2E2
}
html.page{
  --choice-bg: var(--light)
}
html[data-mode="dim"]{
  --light: hsla(0,0%,100%,0.87);
  --color-mode: 'dim';
  --text: var(--light);
  --accent: var(--bubble);
  --choice-bg: var(--bg);
  --code-bg: var(--translucent-light);
  --header-text: var(--light);
  --table-bg: var(--code-bg);
  --table-haze: rgba(255,255,255,0.1);
  --table-border: var(--code-bg);
  --footer-bg: var(--bg);
  --post-bg: var(--translucent-light)
}
html[data-mode="dim"] blockquote{
  background:var(--translucent-light);
  color:#dedede
}
html[data-mode="dim"] svg.icon{
  fill:var(--light)
}
html[data-mode="dim"] .icon img{
  background:none
}
html[data-mode="dim"] .icon svg{
  fill:#fafafa
}
html[data-mode="dim"] .sidebar_inner::before{
  display:none
}
html[data-mode="dim"] .color_choice::after{
  background-image:url("../images/night-moon.jpg");
  transform:translateX(1.4rem)
}
@media (prefers-color-scheme: dark){
  html:not([data-mode="lit"]){
      --light: hsla(0,0%,100%,0.87);
      --color-mode: 'dim';
      --text: var(--light);
      --accent: var(--bubble);
      --choice-bg: var(--bg);
      --code-bg: var(--translucent-light);
      --header-text: var(--light);
      --table-bg: var(--code-bg);
      --table-haze: rgba(255,255,255,0.1);
      --table-border: var(--code-bg);
      --footer-bg: var(--bg);
      --post-bg: var(--translucent-light)
  }
  html:not([data-mode="lit"]) blockquote{
      background:var(--translucent-light);
      color:#dedede
  }
  html:not([data-mode="lit"]) svg.icon{
      fill:var(--light)
  }
  html:not([data-mode="lit"]) .icon img{
      background:none
  }
  html:not([data-mode="lit"]) .icon svg{
      fill:#fafafa
  }
  html:not([data-mode="lit"]) .sidebar_inner::before{
      display:none
  }
  html:not([data-mode="lit"]) .color_choice::after{
      background-image:url("../images/night-moon.jpg");
      transform:translateX(1.4rem)
  }
}
.landing-content{
  margin:0;
  padding:2rem;
  gap:10px;
  max-width:100%;
  display:grid;
  align-content:center;
  justify-content:center;
  margin:15px auto
}
.landing-content div{
  text-align:center
}
.landing-content h3{
  max-width:1000px
}
.info{
  max-width:65rem;
  margin:15px auto
}
html{
  --color-mode: 'lit';
  --light: #fff;
  --dark: #102723;
  --bg: #374955;
  --haze: #f2f2f2;
  --gray: #020202;
  --accent: var(--gray);
  --text: #575757;
  --header-text: var(--dark);
  --font: Metropolis, sans-serif;
  --theme: #0077b8;
  --ease: cubic-bezier(.19,1,.22,1);
  --code-bg: var(--bg);
  --table-bg: var(--light);
  --table-haze: var(--haze);
  --table-border: #dedede;
  --footer-bg: var(--haze);
  --shadow: rgba(0,0,0,0.12);
  --translucent: rgba(0,0,0,0.05);
  --translucent-light: rgba(255,255,255,0.05);
  --post-bg: var(--light);
  --choice-bg: var(--haze);
  --ease: cubic-bezier(0.39, 0.575, 0.565, 1);
  --easing: cubic-bezier(.19,1,.22,1);
  --notice-code-bg: var(--bg);
  --notice-info-border-color: #6AB0DE;
  --notice-info-background: #E7F2FA;
  --notice-note-border-color: #F0B37E;
  --notice-note-background: #FFF2DB;
  --notice-tip-border-color: rgba(92, 184, 92, 0.8);
  --notice-tip-background: #E6F9E6;
  --notice-warning-border-color: rgba(217, 83, 79, 0.8);
  --notice-warning-background: #FAE2E2
}
.logo{
  height:50px
}
h3>a{
  color:#0ca5de
}
.author_name{
  font-weight:500
}
@font-face{
  font-family:'Metropolis';
  font-style:normal;
  font-weight:200;
  src:local("Metropolis Extra Light"),local("Metropolis-Light"),url("../fonts/Metropolis-ExtraLight.woff2") format("woff2"),url("../fonts/Metropolis-ExtraLight.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:italic;
  font-weight:200;
  src:local("Metropolis Extra Light Italic"),local("Metropolis-ExtraLightItalic"),url("../fonts/Metropolis-ExtraLightItalic.woff2") format("woff2"),url("../fonts/Metropolis-ExtraLightItalic.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:normal;
  font-weight:300;
  src:local("Metropolis Light"),local("Metropolis-Light"),url("../fonts/Metropolis-Light.woff2") format("woff2"),url("../fonts/Metropolis-Light.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:italic;
  font-weight:300;
  src:local("Metropolis Light Italic"),local("Metropolis-LightItalic"),url("../fonts/Metropolis-LightItalic.woff2") format("woff2"),url("../fonts/Metropolis-LightItalic.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:normal;
  font-weight:400;
  src:local("Metropolis Regular"),local("Metropolis-Regular"),url("../fonts/Metropolis-Regular.woff2") format("woff2"),url("../fonts/Metropolis-Regular.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:italic;
  font-weight:400;
  src:local("Metropolis Regular Italic"),local("Metropolis-RegularItalic"),url("../fonts/Metropolis-RegularItalic.woff2") format("woff2"),url("../fonts/Metropolis-RegularItalic.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:normal;
  font-weight:500;
  src:local("Metropolis Medium"),local("Metropolis-Medium"),url("../fonts/Metropolis-Medium.woff2") format("woff2"),url("../fonts/Metropolis-Medium.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:italic;
  font-weight:500;
  src:local("Metropolis Medium Italic"),local("Metropolis-MediumItalic"),url("../fonts/Metropolis-MediumItalic.woff2") format("woff2"),url("../fonts/Metropolis-MediumItalic.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:normal;
  font-weight:700;
  src:local("Metropolis Bold"),local("Metropolis-Bold"),url("../fonts/Metropolis-Bold.woff2") format("woff2"),url("../fonts/Metropolis-Bold.woff") format("woff");
  font-display:swap
}
@font-face{
  font-family:'Metropolis';
  font-style:italic;
  font-weight:700;
  src:local("Metropolis Bold Italic"),local("Metropolis-BoldItalic"),url("../fonts/Metropolis-BoldItalic.woff2") format("woff2"),url("../fonts/Metropolis-BoldItalic.woff") format("woff");
  font-display:swap
}
*{
  box-sizing:border-box;
  -webkit-appearance:none;
  margin:0;
  padding:0
}
body,html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  font-kerning:normal;
  -webkit-font-feature-settings:"kern" 1;
  text-rendering:optimizeLegibility;
  text-rendering:geometricPrecision;
  -webkit-text-size-adjust:100%;
  font-size:100%;
  scroll-padding-top:4.5rem
}
body::-webkit-scrollbar-corner,html::-webkit-scrollbar-corner{
  background-color:transparent
}
body{
  font-family:var(--font);
  background:var(--choice-bg);
  color:var(--text);
  font-size:1.1rem;
  line-height:1.5;
  max-width:1920px;
  margin:0 auto;
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:100vh;
  font-kerning:normal;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale
}
a{
  text-decoration:none;
  color:inherit
}
a:focus,a:focus-within{
  outline:none !important
}
h1,h2,h3,h4,h5{
  font-family:inherit;
  font-weight:300;
  padding:5px 0;
  margin:15px 0;
  color:var(--header-text);
  line-height:1.35
}
h1:hover .link,h2:hover .link,h3:hover .link,h4:hover .link,h5:hover .link{
  opacity:1
}
h1{
  font-size:200%;
  font-weight:400
}
h2{
  font-size:175%
}
h3{
  font-size:150%
}
h4{
  font-size:125%
}
h5{
  font-size:120%
}
h6{
  font-size:100%
}
img,svg{
  max-width:100%;
  vertical-align:middle
}
img{
  height:auto;
  margin:1rem auto;
  padding:0
}
img:focus,img:focus-within{
  outline:none !important;
  border:none !important
}
main{
  flex:1
}

ul.posts {
   list-style:none!important;
  -webkit-padding-start:0!important;
  -moz-padding-start:0!important;
}

em{
  font-weight:500
}
b,strong{
  font-weight:700
}
hr{
  border:none;
  padding:1px;
  background:#e7e7e7;
  opacity:0.5;
  margin:1rem 0
}
@media (prefers-color-scheme: dark){
  hr{
      background:var(--theme)
  }
}
aside h3{
  position:relative;
  margin:0 !important
}
aside ul{
  list-style:initial;
  padding-left:1rem
}
aside li{
  padding:0.25rem 0
}
table{
  width:100%;
  border-collapse:collapse;
  background:var(--table-haze);
  margin-bottom:1.5rem
}
table:not(.ln-table) t{
  background:var(--table-bg)
}
td,th{
  padding:0.5rem 1rem;
  border:1px solid var(--table-border)
}
td,th{
  padding:0.5rem 1rem;
  font-weight:400
}
td:not(:first-child),th:not(:first-child){
  padding-left:1.5rem
}
th{
  font-weight:700
}
tbody{
  padding:0
}
tbody tr:nth-child(even){
  background-color:var(--table-haze)
}
tbody tr:nth-child(odd){
  background-color:var(--table-bg)
}
blockquote{
  margin:25px auto;
  quotes:"“" "”" "‘" "’";
  padding:1.5rem;
  color:#555555;
  padding:1rem 1.5rem;
  border-left:0.2rem solid #0ca5de;
  position:relative;
  background:var(--haze)
}
blockquote+.highlight_wrap{
  margin-top:2.25rem
}
p{
  padding:0.8rem 0
}
picture{
  display:block;
  width:100%
}
.nav_open+.nav_sub::before,.nav_open+.nav_sub .nav_child:first-child::before{
  width:0;
  height:0;
  border-left:0.33rem solid transparent;
  border-right:0.33rem solid transparent;
  top:-0.5rem;
  left:1rem
}
.nav{
  color:#fafafa;
  display:flex;
  justify-content:space-between;
  --maxWidth: 1440px;
  max-width:var(--maxWidth);
  margin-left:auto;
  margin-right:auto
}
.nav_active{
  background-color:rgba(230,244,241,0.05);
  border-radius:0.25rem
}
.nav_icon{
  width:0.7rem;
  margin-left:0.33rem;
  transition:transform 0.3s var(--ease);
  transform-origin:50% 50%
}
.nav_body{
  display:flex;
  flex:1
}
.nav_header{
  background-color:#374955;
  padding:0 1.5rem;
  position:fixed;
  width:100%;
  z-index:99;
  left:0
}
.nav_item{
  padding:0.5rem 1rem;
  display:inline-flex;
  align-items:center
}
.nav_sub{
  width:100%;
  left:0;
  position:absolute;
  z-index:20;
  border-radius:0 0 0.5rem 0.5rem;
  top:3rem;
  transition:height 0.3s ease-in-out;
  height:0;
  overflow:hidden;
  padding:0.96rem 0 0;
  background:transparent
}
.nav_parent{
  position:relative;
  display:flex;
  align-items:center;
  margin:0.25rem 0;
  border-radius:0.5rem
}
.nav_open+.nav_sub .nav_child{
  padding-top:0.5rem;
  padding-bottom:0.5rem;
  z-index:3
}
@media screen and (min-width: 769px){
  .nav_open+.nav_sub .nav_child+a{
      padding-top:0
  }
}
.nav_open+.nav_sub .nav_child:not(:first-child){
  position:relative
}
.nav_open+.nav_sub .nav_child:first-child::before{
  position:absolute;
  content:"";
  border-bottom:0.5rem solid var(--translucent-light);
  z-index:2
}
.nav_open+.nav_sub{
  height:initial;
  z-index:999;
  overflow:initial;
  border-radius:0.5rem;
  padding-bottom:0.5rem
}
@media screen and (min-width: 769px){
  .nav_open+.nav_sub{
      color:var(--text)
  }
}
.nav_open+.nav_sub::before,.nav_open+.nav_sub::after{
  content:"";
  position:absolute
}
.nav_open+.nav_sub::before{
  z-index:1
}
@media screen and (min-width: 769px){
  .nav_open+.nav_sub::before{
      border-bottom:0.5rem solid var(--choice-bg)
  }
}
.nav_open+.nav_sub::after{
  top:0;
  left:0;
  right:0;
  bottom:0;
  background:var(--translucent-light);
  border-radius:0.5rem;
  box-shadow:0 1rem 3rem rgba(0,0,0,0.25)
}
@media screen and (min-width: 769px){
  .nav_open+.nav_sub{
      background:var(--choice-bg);
      width:auto;
      white-space:nowrap
  }
}
.nav_open .nav_icon{
  transform:rotate(180deg)
}
.nav_sub .nav_item{
  z-index:5;
  display:block;
  padding-top:0.75rem;
  padding-bottom:0.75rem;
  transition:background 0.3s ease-out;
  margin:0
}
.nav_sub .nav_item:not(.nav_child){
  position:relative
}
.nav_brand img{
  max-width:15rem;
  margin:0
}
@media screen and (min-width: 769px){
  .nav_brand{
      padding-left:0
  }
  .nav_brand img{
      background:transparent !important
  }
}
.nav_center{
  display:none
}
@media screen and (min-width: 769px){
  .nav_center{
      display:flex;
      flex:1;
      align-items:center;
      justify-content:center
  }
  .nav_center+.follow{
      flex:initial
  }
}
@media screen and (min-width: 769px){
  .nav_hide{
      display:none
  }
}
.nav_close{
  display:none
}
.nav .extra{
  padding-top:0.3rem;
}
.content.extra{
  padding-top:50px;
}
.content,.footer{
  padding:1.5rem
}
@media screen and (min-width: 1441px){
  .content,.footer{
      padding:1.5rem 0
  }
}
.content{
  --maxWidth: 1440px;
  max-width:var(--maxWidth);
  margin-left:auto;
  margin-right:auto
}
.footer{
  background:var(--footer-bg);
  margin-top:2rem;
  font-size:0.9rem
}
.footer_inner{
  --maxWidth: 1440px;
  max-width:var(--maxWidth);
  margin-left:auto;
  margin-right:auto;
  display:flex;
  justify-content:center;
  align-items:center;
  position:relative
}
.button{
  background-color:#0ca5de;
  color:#e6f4f1;
  display:inline-flex;
  padding:0.5rem 1.5rem;
  text-transform:uppercase;
  border:1px solid #0ca5de;
  border-radius:1.5rem;
  font-size:0.9rem;
  align-items:center;
  user-select:none
}
.button_back{
  color:#e6f4f1;
  outline:none;
  border:none;
  appearance:none;
  background-color:#0ca5de;
  font-size:1rem;
  cursor:pointer;
  padding:0.5rem 1rem;
  margin-bottom:1.33rem;
  border-radius:1.5rem
}
.button:hover,.button:focus{
  background-color:#075d7d;
  color:#e6f4f1;
  border:1px solid #075d7d
}
.button_translucent{
  background-color:rgba(12,165,222,0.15);
  color:#0ca5de;
  border:1px solid transparent
}
.button_tally{
  padding:0 0.75rem;
  border-radius:0.5rem;
  background-color:#0ca5de;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  color:#e6f4f1;
  margin:0.1rem 0 0.1rem 0.2rem;
  font-size:0.7rem
}
.post_link,.post_title{
  margin-bottom:0
}
.post_link{
  line-height:1
}
.post_link>a{
  display:block;
  line-height:1.35
}
.posts{
  margin-top:2rem
}
.post_header{
  height:50vh;
  max-height:35rem;
  background-color:#374955;
  background-size:cover;
  background-position:center;
  margin-top:4.2rem
}
@media screen and (max-width: 992px){
  .post_header{
      height:40vh;
      margin-top:3rem
  }
}
@media screen and (max-width: 667px){
  .post_header{
      height:30vh
  }
}
.post_header+.content{
  padding-top:0
}
.post_item{
  margin-bottom:3rem;
  border-radius:0.5rem;
  background:var(--post-bg)
}
.post_tag{
  padding:0.2rem 0.8rem;
  font-size:0.8rem
}
.post_tags{
  display:none
}
.post_tags.jswidgetopen{
  display:initial;
  position:fixed;
  top:0;
  left:0;
  height:100vh;
  overflow-y:auto;
  width:100vw;
  padding:5rem 1.5rem;
  background:var(--translucent-light);
  cursor:pointer;
  z-index:999;
  overflow-y:auto
}
.post_tags_toggle{
  margin-top:0.5rem;
  margin-left:0.5rem;
  cursor:pointer
}
.post_tag,.post_share{
  margin:0.5rem
}
.post_share{
  display:inline-flex
}
.post_meta{
  align-items:stretch
}
.post_meta,.post_meta span{
  display:inline-flex;
  flex-flow:row wrap
}
.post_meta span{
  align-items:center;
  margin-bottom:0.5rem
}
@media screen and (min-width: 557px){
  .post_meta span{
      gap:0.5rem 0
  }
}
@media screen and (max-width: 667px){
  .post_meta span:last-of-type{
      margin-top:-0.5rem
  }
}
@media screen and (min-width: 667px){
  .post_meta .button{
      margin:0 0.5rem
  }
}
.post_date{
  margin-right:0.5rem;
  margin-left:0.25rem
}
.post_featured{
  display:block;
  margin:1rem auto
}
.post_content a:not(.button){
  color:#0ca5de
}
.post_content ul,.post_content ol{
  list-style:initial;
  padding:0.5rem 1.25rem
}
.post_content ul li,.post_content ol li{
  padding-top:0.25rem
}
.post_content ol{
  list-style:decimal
}
.scrollable{
  display:grid;
  width:100%;
  max-width:100%;
  overflow-x:auto
}
.to-top{
  position:fixed;
  bottom:2rem;
  right:1.5rem;
  height:2.25rem;
  width:2.25rem;
  background-color:#0ca5de;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  -webkit-appearance:none;
  border-radius:50%;
  color:#e6f4f1 !important;
  text-decoration:none !important;
  font-size:1.25rem;
  cursor:pointer
}
@media screen and (max-width: 667px){
  .to-top{
      bottom:2.25rem
  }
}
.to-top,.to-top:focus{
  outline:none
}
.mb-0{
  margin-bottom:0 !important
}
.tags_list{
  cursor:initial;
  background:var(--choice-bg);
  padding:4.5rem 1.5rem 1.5rem 1.5rem;
  border-radius:1rem;
  max-width:720px;
  margin:0 auto;
  box-shadow:0 0.5rem 1.5rem rgba(0,0,0,0.12);
  position:relative;
  display:flex;
  flex-flow:row wrap
}
.tags_nav{
  position:relative
}
.tags_hide{
  position:absolute;
  top:1rem;
  right:1.5rem;
  padding:0.5rem;
  border-radius:50%;
  cursor:pointer
}
@media screen and (min-width: 992px){
  .tags_hide{
      display:none
  }
}
.tags_sort{
  font-size:1rem;
  color:var(--light);
  background:var(--theme);
  position:absolute;
  top:1.5rem;
  left:1.5rem;
  border-radius:1.5rem;
  padding:0.1rem
}
.tags_sort,.tags_sort span{
  user-select:none
}
.tags_sort span{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  height:2rem;
  position:relative;
  z-index:5;
  cursor:pointer;
  width:5rem;
  font-weight:500
}
.tags_sort::before{
  content:"";
  position:absolute;
  width:4.5rem;
  top:0.25rem;
  bottom:0.25rem;
  left:0.25rem;
  z-index:3;
  background:var(--bg);
  opacity:0.5;
  border-radius:1.5rem;
  transition:0.25s transform var(--ease)
}
.tags_sort.sorted::before{
  transform:translateX(5rem)
}
.tag-title{
  border-bottom:none !important;
  display:inline-block !important;
  position:relative;
  font-size:2rem;
  margin-bottom:-1rem
}
.tag-title::after{
  content:attr(data-count);
  margin-left:1.5rem;
  background-color:#eee;
  padding:0.25rem 1rem;
  border-radius:15%;
  font-size:1.5rem
}
.icon{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  margin:0 0.5rem
}
.icon,.icon img,.icon svg{
  width:1.1rem;
  height:1.1rem
}
.icon_2{
  width:5rem;
  height:4rem
}
.link{
  opacity:0;
  position:relative
}
.link_owner .icon{
  background-image:url("../icons/link.svg");
  background-size:100%;
  background-repeat:no-repeat;
  background-position:center right
}
.link_yank{
  opacity:1
}
.link_yanked{
  position:absolute;
  right:-1rem;
  top:-2rem;
  background-color:#0ca5de;
  color:#e6f4f1;
  width:7rem;
  padding:0.25rem 0.5rem;
  font-size:0.9rem;
  border-radius:1rem;
  text-align:center
}
.link_yanked::after{
  position:absolute;
  top:1rem;
  content:"";
  border-color:#0ca5de transparent;
  border-style:solid;
  border-width:1rem 1rem 0 1rem;
  height:0;
  width:0;
  transform-origin:50% 50%;
  transform:rotate(145deg);
  right:0.45rem
}
.excerpt_header,.excerpt_footer{
  padding:1rem
}
.excerpt_footer{
  padding:0 1rem 2.25rem 1rem
}
.excerpt_thumbnail{
  min-height:10rem;
  display:none
}
@media screen and (min-width: 769px){
  .excerpt_thumbnail{
      display:block;
      border-radius:0.5rem
  }
}
.excerpt_footer.partition{
  display:grid
}
@media screen and (min-width: 769px){
  .excerpt_footer.partition{
      grid-template-columns:2fr 1fr;
      grid-gap:1rem
  }
}
.sidebar_inner{
  position:relative
}
.sidebar_inner::before{
  content:"";
  padding:0.5px;
  top:0;
  bottom:0;
  background:linear-gradient(to bottom, var(--haze), var(--light), var(--haze));
  position:absolute;
  left:-2rem
}
.author_header{
  display:grid;
  grid-template-columns:3rem 1fr;
  grid-gap:1rem
}
.author_bio a{
  color:#0ca5de
}
.pagination{
  display:flex
}
.page-item{
  padding:0.2rem
}
.page-item.disabled{
  opacity:0.7
}
.page-item:first-child,.page-item:last-child{
  display:none
}
.page-item.active a{
  background-color:#075d7d
}
.page-link{
  padding:0.25rem 0.75rem;
  background-color:#0ca5de;
  color:#e6f4f1;
  border-radius:1rem
}
.page_only{
  display:none !important
}
.page .page_only{
  display:initial !important
}
.round{
  border-radius:50%;
  max-width:100%;
  height:auto;
  padding:0;
  vertical-align:middle
}
.float_left{
  float:left;
  margin-right:1rem
}
.float_left+p{
  padding-top:0
}
.float_right{
  float:right;
  margin-left:1rem
}
.float_left::after,.float_right::after{
  clear:both
}
.follow{
  display:flex;
  align-items:center;
  flex:1;
  justify-content:flex-end
}
.follow svg{
  fill:#fafafa;
  margin-left:0.75rem
}
figcaption{
  font-style:italic;
  opacity:0.67;
  font-size:0.9rem
}
.to_top{
  background-color:#0ca5de;
  width:2.75rem;
  height:2.75rem;
  display:flex;
  justify-content:center;
  align-items:center;
  cursor:pointer;
  border-radius:50%;
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  z-index:99
}
.to_top.ios{
  position:absolute;
  bottom:0.75rem;
  right:0
}
.to_top:hover{
  background-color:#0ca5de
}
.to_top svg{
  fill:#e6f4f1;
  opacity:0.5;
  transition:0.3s opacity var(--ease)
}
.to_top:hover svg{
  opacity:1
}
.color_mode{
  height:1.5rem;
  display:grid;
  align-items:center;
  margin:0 0.5rem
}
@media screen and (min-width: 769px){
  .color_mode{
      margin:0 1.5rem;
      grid-template-columns:1fr
  }
}
.color_choice{
  width:3rem;
  background-color:var(--translucent-light);
  border-radius:1rem;
  height:1.5rem;
  outline:none;
  border:none;
  -webkit-appearance:none;
  cursor:pointer;
  position:relative;
  position:relative;
  overflow:hidden;
  box-shadow:0 0.25rem 1rem rgba(0,0,0,0.15)
}
.color_choice::after{
  content:"";
  position:absolute;
  top:0.1rem;
  left:0.1rem;
  width:1.3rem;
  height:1.3rem;
  background-image:url("../images/sun.svg");
  background-position:center;
  background-size:cover;
  border-radius:50%;
  z-index:2
}
.color_animate{
  transition:transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1)
}
.color_animate::after{
  transition:transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  will-change:transform
}
.taxonomy{
  text-transform:capitalize
}
.image-scale{
  position:fixed;
  z-index:999999;
  left:0;
  right:0;
  height:100vh;
  top:0;
  padding:1.5rem;
  background-color:var(--bg);
  display:grid;
  align-items:center;
  overflow:auto
}
.image-scale .image-scalable{
  background-color:var(--text)
}
.image-scalable{
  cursor:pointer;
  transition:transform 0.3s var(--ease)
}
.image_featured{
  display:block;
  margin-left:auto !important;
  margin-right:auto !important
}
.image_thumbnail{
  margin:0
}
.video{
  overflow:hidden;
  padding-bottom:56.25%;
  position:relative;
  height:0;
  margin:1.5rem 0;
  border-radius:0.6rem;
  background-color:var(--bg);
  box-shadow:0 1rem 2rem rgba(0,0,0,0.17)
}
.video iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  border:none;
  position:absolute;
  transform:scale(1.02)
}
.notices{
  border-top-width:2rem;
  border-top-style:solid;
  color:#666;
  margin:2rem 0;
  padding-bottom:.1px;
  padding-left:1rem;
  padding-right:1rem
}
.notices .label{
  color:#fff;
  margin-top:-1.75rem;
  font-weight:bold
}
.notices .label:first-child::before{
  font-weight:900;
  margin-left:-.35rem;
  margin-right:.35rem
}
.notices.info{
  border-color:var(--notice-info-border-color);
  background:var(--notice-info-background)
}
.notices.warning{
  border-color:var(--notice-warning-border-color);
  background:var(--notice-warning-background)
}
.notices.image-warning{
  margin:0
}
.notices.note{
  border-color:var(--notice-note-border-color);
  background:var(--notice-note-background)
}
.notices.tip{
  border-color:var(--notice-tip-border-color);
  background:var(--notice-tip-background)
}
.notices .highlight_wrap{
  background:var(--notice-code-bg) !important
}
.search{
  flex:1;
  display:flex;
  justify-content:flex-end;
  position:relative;
  max-width:25rem;
  margin:0.5rem 0 0;
  --border: transparent
}
.search_field{
  padding:0.5rem 1rem;
  width:100%;
  outline:none;
  color:var(--text);
  background:var(--post-bg);
  border:1px solid var(--border);
  border-radius:8px;
  font-size:1rem;
  box-shadow:0 0.25rem 1rem rgba(0,0,0,0.1)
}
.search_field:focus+.search_label{
  opacity:0
}
.search_label{
  position:absolute;
  z-index:9;
  opacity:0.67;
  right:0.67rem;
  top:0.25rem;
  width:1rem;
  height:1rem
}
.search_label svg{
  width:100%;
  height:100%;
  fill:#7C849B
}
.search_result{
  padding:0.5rem 1rem
}
.search_result:not(.passive):hover{
  background-color:var(--code-bg);
  color:#e6f4f1
}
.search_result.passive{
  display:grid
}
.search_results{
  width:100%;
  background-color:var(--choice-bg);
  color:var(--text);
  border-radius:var(--radius);
  box-shadow:0 1rem 4rem rgba(0,0,0,0.17) !important;
  position:absolute;
  top:125%;
  display:grid;
  overflow:hidden;
  z-index:3
}
.search_results:empty{
  display:none
}
.search_title{
  padding:0.25rem 1rem !important;
  background-color:#0ca5de;
  color:var(--light);
  margin:0;
  font-size:1.25rem
}
.search_title:empty{
  display:none
}
.search_submit{
  position:absolute;
  --margin: 3px;
  right:var(--margin);
  top:var(--margin);
  bottom:var(--margin);
  z-index:9;
  cursor:pointer;
  border-radius:calc(var(--radius) / 2)
}
#results .search_title,#results .search_result{
  padding:0.5rem 0
}
.openstreetmap{
  border:none
}
.post_content{
  max-width:65rem;
  margin-left:auto;
  margin-right:auto
}
.pt-1{
  padding-top:1.5rem
}
.pb-1{
  padding-bottom:1.5rem
}
.mt-1{
  margin-top:1.5rem
}
.mb-1{
  margin-bottom:1.5rem
}
.pt-2{
  padding-top:3rem
}
.pb-2{
  padding-bottom:3rem
}
.mt-2{
  margin-top:3rem
}
.mb-2{
  margin-bottom:3rem
}
.flex{
  display:flex;
  flex-direction:column;
  align-items:center
}
.shadow{
  box-shadow:0 0 60px rgba(0,0,0,0.17)
}
@media screen and (min-width: 42rem){
  .grid-2,.grid-3,.grid-4,.grid-auto,.grid-inverse{
      display:grid;
      grid-template-columns:1fr
  }
  [class*='grid-']{
      grid-gap:2rem
  }
  .grid-inverse{
      grid-template-columns:70% 1fr;
      grid-column-gap:4rem
  }
  .grid-2{
      grid-template-columns:1fr 1fr
  }
  .grid-3{
      grid-template-columns:repeat(auto-fit, minmax(19rem, 1fr))
  }
  .grid-4{
      grid-template-columns:repeat(auto-fit, minmax(16rem, 1fr))
  }
}
.facebook svg{
  fill:#325c94
}
.twitter svg{
  fill:#00abdc
}
.linkedin svg{
  fill:#007bb6
}
.never{
  height:75vh;
  display:flex;
  justify-content:center;
  align-items:center;
  flex-direction:column;
  padding:1.5rem;
  text-align:center
}
.inline{
  display:inline;
  margin:0
}
.hidden{
  display:none
}
@media screen and (max-width: 769px){
  .nav,.nav_body{
      flex-direction:column
  }
  .nav_body{
      position:fixed;
      width:90%;
      max-width:16.5rem;
      top:0;
      bottom:0;
      background-color:#374955;
      transition:transform 0.3s var(--easing)
  }
  .nav_body_right{
      transform:translateX(100vw);
      right:0
  }
  .nav_body_left{
      transform:translateX(-100vw);
      left:0
  }
  .nav_close{
      width:3rem;
      position:absolute;
      right:-4rem;
      top:0;
      bottom:0;
      height:100%;
      cursor:pointer;
      z-index:1000;
      display:flex;
      justify-content:center;
      align-items:center
  }
  .nav_close svg{
      width:1.25rem;
      fill:var(--light);
      height:1.25rem;
      display:none
  }
  .nav_close svg:first-child{
      display:initial
  }
  .nav_close svg.isopen{
      display:none
  }
  .nav_close svg.isopen+svg{
      display:initial
  }
  .nav_brand{
      position:relative;
      z-index:999;
      width:calc(100% - 3rem);
      padding-left:0
  }
  .nav_parent{
      display:grid
  }
  .nav_sub{
      position:relative;
      top:initial;
      padding-top:0
  }
  .jsopen::after{
      content:"";
      position:fixed;
      z-index:2;
      background-color:rgba(0,0,0,0.3);
      top:0;
      left:0;
      right:0;
      bottom:0
  }
  .jsopen .nav_body{
      transform:translateX(0);
      padding-left:1.5rem;
      padding-right:1.5rem
  }
  .jsopen .nav_parent:first-child{
      margin-top:4.4rem
  }
  .jsopen .nav .follow{
      justify-content:flex-start;
      flex:initial;
      margin-top:0.75rem
  }
}
@keyframes pulse{
  0%{
      opacity:1
  }
  75%{
      opacity:0.1
  }
  100%{
      opacity:1
  }
}
code{
  font-size:85%;
  font-weight:400;
  overflow-y:hidden;
  display:block;
  font-family:'Monaco', monospace;
  word-break:break-all
}
code.noClass{
  --inlineColor: #d63384;
  color:var(--inlineColor);
  display:inline;
  line-break:anywhere
}
.windows .highlight{
  overflow-x:hidden
}
.windows .highlight:hover{
  overflow-x:auto
}
.highlight{
  display:grid;
  width:100%;
  border-radius:0 0.2rem 0.2rem 0;
  overflow-x:auto;
  position:relative
}
.highlight_wrap{
  background:var(--code-bg) !important;
  border-radius:0.5rem;
  position:relative;
  padding:0 1rem;
  margin:1.5rem auto 1rem auto
}
.highlight_wrap+.highlight_wrap{
  margin-top:2.25rem
}
.highlight_wrap:hover>div{
  opacity:1
}
.highlight_wrap .lang{
  position:absolute;
  top:0;
  right:0;
  text-align:right;
  width:7.5rem;
  padding:0.5rem 1rem;
  font-style:italic;
  text-transform:uppercase;
  font-size:67%;
  opacity:0.5;
  color:var(--light)
}
.highlight_wrap:hover .lang{
  opacity:0.1
}
.highlight .highlight{
  margin:0
}
.highlight pre{
  /* color:var(--light) !important; */
  border-radius:4px;
  font-family:'Monaco', monospace;
  padding-top:1.5rem;
  padding-bottom:2rem;
  padding-left: 10px;
}
.highlight table{
  display:grid;
  max-width:100%;
  margin-bottom:0;
  background:transparent
}
.highlight td,.highlight th{
  padding:0
}
.highlight .lntd{
  width:100%;
  border:none
}
.highlight .lntd:first-child,.highlight .lntd:first-child pre{
  width:2.5rem !important;
  padding-left:0;
  padding-right:0;
  color:rgba(255,255,255,0.5);
  user-select:none
}
.highlight .lntd:first-child pre{
  width:100%;
  display:flex;
  align-items:center;
  flex-direction:column
}
.err{
  color:#a61717;
  background-color:#e3d2d2
}
.hl{
  width:100%;
  background-color:rgba(255,255,255,0.25)
}
.ln,.lnt{
  margin-right:0.75rem;
  padding:0;
  transition:opacity 0.3s var(--ease)
}
.ln,.ln span,.lnt,.lnt span{
  color:rgba(255,255,255,0.5);
  user-select:none
}
.k,.kc,.kd,.kn,.kp,.kr,.kt,.nt{
  color:#6ab825;
  font-weight:500
}
.kn,.kp{
  font-weight:400
}
.nb,.no,.nv{
  color:#24909d
}
.nc,.nf,.nn{
  color:#447fcf
}
.s,.sa,.sb,.sc,.dl,.sd,.s2,.se,.sh,.si,.sx,.sr,.s1,.ss{
  color:#ed9d13
}
.m,.mb,.mf,.mh,.mi,.il,.mo{
  color:#3677a9
}
.ow{
  color:#6ab825;
  font-weight:500
}
.c,.ch,.cm,.c1{
  color:#999;
  font-style:italic
}
.cs{
  color:#e50808;
  background-color:#520000;
  font-weight:500
}
.cp,.cpf{
  color:#cd2828;
  font-weight:500
}
.gd,.gr{
  color:#d22323
}
.ge{
  font-style:italic
}
.gh,.gu,.nd,.na,.ne{
  color:#ffa500;
  font-weight:500
}
.gi{
  color:#589819
}
.go{
  color:#ccc
}
.gp{
  color:#aaa
}
.gs{
  font-weight:500
}
.gt{
  color:#d22323
}
.w{
  color:#666
}
.hljs-string{
  color:#6ab825
}
.hljs-attr{
  color:#ed9d13
}
.p .hljs-attr{
  color:var(--light)
}
.pre_wrap{
  white-space:pre-wrap;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word
}
.pre_nolines.line .ln{
  display:none
}
.panel_box{
  display:inline-flex;
  perspective:300px;
  grid-gap:0.5rem;
  transition:opacity 0.3s var(--easing);
  background:var(--code-bg);
  padding:0.5rem 1.5rem;
  border-radius:2rem;
  align-items:center;
  position:absolute;
  right:0rem;
  top:-2.1rem;
  opacity:0
}
.panel_icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0.1rem;
  transform-origin:50% 50%;
  background-size:100%;
  background-repeat:no-repeat
}
.panel_icon.active{
  animation:pulse 0.1s linear
}
.panel_icon svg{
  fill:var(--light);
  width:1.5rem;
  height:1.5rem
}
.panel_hide{
  display:none
}
.panel_from{
  position:absolute;
  color:var(--theme);
  bottom:0;
  font-size:1.5rem;
  font-weight:500;
  padding:0.5rem 0;
  cursor:pointer;
  letter-spacing:0.1px;
  z-index:19
}
.panel_expanded .panel_from{
  display:none
}

a.link {
  opacity: 1!important;
}

a.page-number.active {
  background: #0ca5de!important;
}


.highlight *{
  background: #44002e!important;
}

.highlight span.n,
.highlight span.o {
  color: #ff7b72;
}

.highlight span.fm {
  color: #447fcf;
}

.highlight span.p {
  color: white;
}

.highlight span.bp {
  color: #ffa657;
}

.language-text.highlight *{
  background-color: #333!important;
}

.language-text.highlight code.noClass{
  --inlineColor: white!important;
  color: var(--inlineColor)!important;
}

.language-text.highlight .output {
  padding-bottom: 0px;
}

.code-output {
  border-top: 10px solid #383838;
}


.code-label {
  font-size: 18px;
  border-bottom: 1px solid #fafafa;
  line-height: 23.4px;
  position: absolute;
  right: 25px;
  margin-top: 15px;
  color: white!important;
}