:root{color-scheme:light dark;--font-family-heading:'Poppins', sans-serif;--font-family-paragraph:'Helvetica', sans-serif;--font-family-monospace:monospace;--base-color:light-dark(#fff, #1c1b1d);--base-offset-color:light-dark(#eaeaea, #2a2831);--highlight-color:light-dark(#7b16ff, #9d4eff);--heading-color:light-dark(#1c1b1d, #fff);--text-color:light-dark(#4e5157, #c4c5ca);--dot-color:light-dark(#7b16ff, #9d4eff)}body,html{margin:0;padding:0}ol,ul{margin:0;padding:0;list-style:none;li { list-style: none; }}h1,h2,h3{margin-top:20px;margin-bottom:20px}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;font-size:16px;a.header-logo { font-weight: bold; text-transform: uppercase; margin-right: 30px; }}.hamburger-trigger{height:30px;display:flex;align-items:center}@media(min-width:767px){.header{padding-bottom:5px;margin-bottom:40px}}@media(min-width:992px){.hamburger-trigger{display:none}}.hamburger{border:none;cursor:pointer;outline:none;position:relative;display:block;width:30px;height:20px;background:0 0;border-top:2px solid;border-bottom:2px solid;font-size:0;transition:all .25s ease-in-out;color:var(--highlight-color);&:before,&:after { content:''; display:block; width:100%; height:2px; position:absolute; top:50%; left:50%; background:currentColor; transform:translate(-50%,-50%); transition:transform 0.25s ease-in-out; } &:hover { opacity:0.7; } &.is-active { border-color:transparent; z-index:100; color:var(--base-color); &:hover { opacity:1; } &:before { transform:translate(-50%,-50%) rotate(45deg); } &:after { transform:translate(-50%,-50%) rotate(-45deg); } }}.footer{margin-top:30px}@media(min-width:767px){.footer{padding-top:40px}}.social-icon{margin-right:10px;a { color: var(--text-color); text-decoration: none; &:hover { text-decoration: none; svg { opacity: 0.7; } } }}a{color:var(--highlight-color);text-decoration:none;&:hover { text-decoration:underline; }}h1,h2,h3{margin-top:20px;margin-bottom:20px;color:var(--heading-color);font-family:var(--font-family-heading)}p{color:var(--text-color);font-family:var(--font-family-paragraph);font-size:18px;line-height:24px}ol,ul{margin:0;padding:0;list-style:none;li { list-style: none; }}div.chroma{overflow-x:scroll}.content{font-size:18px;p { font-size: 18px; line-height: 1.6; margin: 0; padding: 0; margin-bottom: 20px; } h1 { font-size: 40px; line-height: 1.6; font-weight: bold; margin-top: 30px; margin-bottom: 20px; &:first-of-type { margin-top: 0; } } h2 { font-size: 28px; line-height: 1.4; font-weight: bold; margin-top: 30px; margin-bottom: 20px; &:first-of-type { margin-top: 0; } } h3 { font-size: 22px; line-height: 1.4; font-weight: bold; margin-top: 30px; margin-bottom: 20px; } ul { list-style: disc; li { list-style: disc; } } ol { list-style: decimal; li { list-style: decimal; } } ul, ol { margin-left: 0; margin-top: 10px; margin-bottom: 20px; li { font-size: 18px; line-height: 20px; margin-bottom: 10px; margin-left: 0; } } a { text-decoration: underline; &:hover { } } blockquote { border-left: 5px solid var(--highlight-color); margin: 30px 0; padding: 20px; } blockquote p { font-size: 20px; display: inline; color: var(--color-base-text); } img { margin: 40px 0 40px 0; max-width: 100%; height: auto; } figure { margin: 2.6rem 0 1.18rem; img { margin: 0; } figcaption { margin-top: 10px; h4 { margin: 0; font-size: 1rem; font-weight: bold; } p { margin: 0; } } } code, pre { font-family: var(--font-family-monospace); } .highlight { pre { border-radius: 3px; font-size: 14px; line-height: 18px; overflow: auto; font-family: var(--font-family-monospace); } }}.dot{color:var(--dot-color)}.footnotes{ol { list-style: decimal; li { list-style: decimal; } }}@media(min-width:767px){h2{font-size:30px;line-height:1.4}.content ul,.content ol{margin-left:20px;li { margin-left: 20px; }}}.intro{margin-bottom:60px;h1 { font-size: 48px; line-height: 56px; margin-top: 0; margin-bottom: 30px; strong { color: var(--highlight-color); } } h2 { font-size: 50px; line-height: 56px; @media (min-width: 767px) { width: 80%; } } p { font-size: 20px; line-height: 26px; } .read-more { font-size: 20px; line-height: 26px; font-weight: bold; } img { max-width: 100%; }}@media(min-width:767px){.intro{h1 { width: 80%; font-size: 88px; line-height: 94px; margin-bottom: 50px; } p { width: 80%; font-size: 22px; line-height: 32px; } .read-more { font-size: 22px; line-height: 32px; }}}.summary{margin-bottom:50px;font-size:18px;line-height:24px;.summary-date { font-weight: bold; color: var(--heading-color); } .summary-title { margin: 16px 0 16px 0; width: 80%; font-size: 34px; line-height: 38px; } .summary-description { width: 80%; line-height: 1.5; }}@media(min-width:767px){.summary{margin-bottom:80px;font-size:18px;line-height:26px;.summary-title { width: 80%; font-size: 52px; line-height: 58px; }}}.author{margin-top:30px;margin-bottom:30px;color:var(--heading-color);img { width: 30px; height: 30px; border-radius: 50%; display: inline-block; vertical-align: middle; border: 2px solid var(--heading-color); } .author-name { display: inline-block; vertical-align: middle; font-weight: bold; margin-left: 5px; } .author-date { display: inline-block; vertical-align: middle; }}.author-large{font-size:20px;img { width: 50px; height: 50px; } .author-name { display: inline-block; vertical-align: middle; font-weight: bold; margin-left: 5px; } .author-title { display: inline-block; vertical-align: middle; }}ul.pagination{display:flex;justify-content:center;list-style:none;margin:20px 0;padding:0;li { list-style: none; text-decoration: none; border: 2px solid var(--highlight-color); border-right: none; text-align: center; vertical-align: middle; &:hover { border-color: var(--highlight-color); background-color: var(--highlight-color); color: white; a { color: white; } } &.pagination-item-current { border-color: var(--highlight-color); background-color: var(--highlight-color); color: white; a { color: white; } } a { padding: 9px 13px; display: block; color: var(--highlight-color); text-decoration: none; } &:last-of-type { border-right: 2px solid var(--highlight-color); border-top-right-radius: 3px; border-bottom-right-radius: 3px; &:hover { border-color: var(--highlight-color); } &.active { border-color: var(--highlight-color); } } &:first-of-type { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } svg { width: 8px; line-height: 10px; margin-bottom: 2px; vertical-align: middle; } }}.view-more{font-size:18px;font-weight:700}.menu-main{display:none;flex:0;> ul { display: flex; align-items: center; justify-content: flex-start; > li { margin-right: 10px; > a { display: inline-block; text-decoration: none; &:hover { text-decoration: underline; } } &.active { > a { display: inline-block; font-weight: bold; } } &:last-of-type { margin-right: 0; } } }}@media(min-width:992px){.menu-main{display:block}}.menu-main-mobile{position:fixed;background:var(--highlight-color);top:0;left:0;width:100%;height:100vh;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s,height .35s;overflow:hidden;display:none;justify-content:center;flex-direction:column;&.open { opacity: 1; visibility: visible; height: 100%; z-index: 10; display: flex; li { animation: fadeInTop 0.5s ease forwards; animation-delay: 0.1s; &:nth-of-type(2) { animation-delay: 0.15s; } &:nth-of-type(3) { animation-delay: 0.20s; } &:nth-of-type(4) { animation-delay: 0.25s; } &:nth-of-type(5) { animation-delay: 0.30s; } &:nth-of-type(6) { animation-delay: 0.35s; } } } ul { font-size: 2rem; font-family: var(--font-family-heading); text-align: center; list-style: none; margin: 0; flex: 0; li { display: block; position: relative; opacity: 0; a { display: block; position: relative; color: var(--base-color); text-decoration: none; &:hover { opacity: 0.7; } } ul.sub-menu { font-size: 1.2rem; li { a { } } } } }}.hamburger-trigger{height:30px;display:flex;align-items:center}@media(min-width:992px){.hamburger-trigger{display:none}}.hamburger{border:none;cursor:pointer;outline:none;position:relative;display:block;width:30px;height:20px;background:0 0;border-top:2px solid;border-bottom:2px solid;font-size:0;transition:all .25s ease-in-out;color:var(--highlight-color);&:before,&:after { content:''; display:block; width:100%; height:2px; position:absolute; top:50%; left:50%; background:currentColor; transform:translate(-50%,-50%); transition:transform 0.25s ease-in-out; } &:hover { opacity:0.7; } &.is-active { border-color:transparent; z-index:100; color:var(--base-color); &:hover { opacity:1; } &:before { transform:translate(-50%,-50%) rotate(45deg); } &:after { transform:translate(-50%,-50%) rotate(-45deg); } }}@keyframes fadeInTop{0%{opacity:0;top:20%}100%{opacity:1;top:0}}.bg{background-color:#fff}.chroma{background-color:#fff}.chroma .x{}.chroma .err{color:#f6f8fa;background-color:#82071e}.chroma .cl{}.chroma .lnlinks{outline:none;text-decoration:none;color:inherit}.chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}.chroma .lntable{border-spacing:0;padding:0;margin:0;border:0}.chroma .hl{background-color:#e5e5e5}.chroma .lnt{white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#7f7f7f}.chroma .ln{white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#7f7f7f}.chroma .line{display:flex}.chroma .k{color:#cf222e}.chroma .kc{color:#cf222e}.chroma .kd{color:#cf222e}.chroma .kn{color:#cf222e}.chroma .kp{color:#cf222e}.chroma .kr{color:#cf222e}.chroma .kt{color:#cf222e}.chroma .n{}.chroma .na{color:#1f2328}.chroma .nb{color:#6639ba}.chroma .bp{color:#6a737d}.chroma .nc{color:#1f2328}.chroma .no{color:#0550ae}.chroma .nd{color:#0550ae}.chroma .ni{color:#6639ba}.chroma .ne{}.chroma .nf{color:#6639ba}.chroma .fm{}.chroma .nl{color:#900;font-weight:700}.chroma .nn{color:#24292e}.chroma .nx{color:#1f2328}.chroma .py{}.chroma .nt{color:#0550ae}.chroma .nv{color:#953800}.chroma .vc{color:#953800}.chroma .vg{color:#953800}.chroma .vi{color:#953800}.chroma .vm{}.chroma .l{}.chroma .ld{}.chroma .s{color:#0a3069}.chroma .sa{color:#0a3069}.chroma .sb{color:#0a3069}.chroma .sc{color:#0a3069}.chroma .dl{color:#0a3069}.chroma .sd{color:#0a3069}.chroma .s2{color:#0a3069}.chroma .se{color:#0a3069}.chroma .sh{color:#0a3069}.chroma .si{color:#0a3069}.chroma .sx{color:#0a3069}.chroma .sr{color:#0a3069}.chroma .s1{color:#0a3069}.chroma .ss{color:#032f62}.chroma .m{color:#0550ae}.chroma .mb{color:#0550ae}.chroma .mf{color:#0550ae}.chroma .mh{color:#0550ae}.chroma .mi{color:#0550ae}.chroma .il{color:#0550ae}.chroma .mo{color:#0550ae}.chroma .o{color:#0550ae}.chroma .ow{color:#0550ae}.chroma .p{color:#1f2328}.chroma .c{color:#57606a}.chroma .ch{color:#57606a}.chroma .cm{color:#57606a}.chroma .c1{color:#57606a}.chroma .cs{color:#57606a}.chroma .cp{color:#57606a}.chroma .cpf{color:#57606a}.chroma .g{}.chroma .gd{color:#82071e;background-color:#ffebe9}.chroma .ge{color:#1f2328}.chroma .gr{}.chroma .gh{}.chroma .gi{color:#116329;background-color:#dafbe1}.chroma .go{color:#1f2328}.chroma .gp{}.chroma .gs{}.chroma .gu{}.chroma .gt{}.chroma .gl{text-decoration:underline}.chroma .w{color:#fff}@media(prefers-color-scheme:dark){.bg{color:#e6edf3;background-color:#0d1117}.chroma{color:#e6edf3;background-color:#0d1117}.chroma .x{}.chroma .err{color:#f85149}.chroma .cl{}.chroma .lnlinks{outline:none;text-decoration:none;color:inherit}.chroma .lntd{vertical-align:top;padding:0;margin:0;border:0}.chroma .lntable{border-spacing:0;padding:0;margin:0;border:0}.chroma .hl{background-color:#6e7681}.chroma .lnt{white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#737679}.chroma .ln{white-space:pre;-webkit-user-select:none;user-select:none;margin-right:.4em;padding:0 .4em;color:#6e7681}.chroma .line{display:flex}.chroma .k{color:#ff7b72}.chroma .kc{color:#79c0ff}.chroma .kd{color:#ff7b72}.chroma .kn{color:#ff7b72}.chroma .kp{color:#79c0ff}.chroma .kr{color:#ff7b72}.chroma .kt{color:#ff7b72}.chroma .n{}.chroma .na{}.chroma .nb{color:#99c645}.chroma .bp{}.chroma .nc{color:#f0883e;font-weight:700}.chroma .no{color:#79c0ff;font-weight:700}.chroma .nd{color:#d2a8ff;font-weight:700}.chroma .ni{color:#ffa657}.chroma .ne{color:#f0883e;font-weight:700}.chroma .nf{color:#d2a8ff;font-weight:700}.chroma .fm{}.chroma .nl{color:#79c0ff;font-weight:700}.chroma .nn{color:#ff7b72}.chroma .nx{color:#e0dcd7}.chroma .py{color:#79c0ff}.chroma .nt{color:#7ee787}.chroma .nv{color:#79c0ff}.chroma .vc{}.chroma .vg{}.chroma .vi{}.chroma .vm{}.chroma .l{color:#a5d6ff}.chroma .ld{color:#79c0ff}.chroma .s{color:#a5d6ff}.chroma .sa{color:#79c0ff}.chroma .sb{color:#a5d6ff}.chroma .sc{color:#a5d6ff}.chroma .dl{color:#79c0ff}.chroma .sd{color:#a5d6ff}.chroma .s2{color:#a5d6ff}.chroma .se{color:#79c0ff}.chroma .sh{color:#79c0ff}.chroma .si{color:#a5d6ff}.chroma .sx{color:#a5d6ff}.chroma .sr{color:#79c0ff}.chroma .s1{color:#a5d6ff}.chroma .ss{color:#a5d6ff}.chroma .m{color:#a5d6ff}.chroma .mb{color:#a5d6ff}.chroma .mf{color:#a5d6ff}.chroma .mh{color:#a5d6ff}.chroma .mi{color:#a5d6ff}.chroma .il{color:#a5d6ff}.chroma .mo{color:#a5d6ff}.chroma .o{color:#ff7b72;font-weight:700}.chroma .ow{color:#ff7b72;font-weight:700}.chroma .p{color:#e0dcd7}.chroma .c{color:#8b949e;font-style:italic}.chroma .ch{color:#8b949e;font-style:italic}.chroma .cm{color:#8b949e;font-style:italic}.chroma .c1{color:#8b949e;font-style:italic}.chroma .cs{color:#8b949e;font-weight:700;font-style:italic}.chroma .cp{color:#8b949e;font-weight:700;font-style:italic}.chroma .cpf{color:#8b949e;font-weight:700;font-style:italic}.chroma .g{}.chroma .gd{color:#ffa198;background-color:#490202}.chroma .ge{font-style:italic}.chroma .gr{color:#ffa198}.chroma .gh{color:#79c0ff;font-weight:700}.chroma .gi{color:#56d364;background-color:#0f5323}.chroma .go{color:#8b949e}.chroma .gp{color:#8b949e}.chroma .gs{font-weight:700}.chroma .gu{color:#79c0ff}.chroma .gt{color:#ff7b72}.chroma .gl{text-decoration:underline}.chroma .w{color:#6e7681}}html,body{box-sizing:border-box}body{background:var(--base-color);font-family:var(--font-family-paragraph);color:var(--text-color);margin:0;padding:20px;overflow-x:hidden;&.frame { min-height: 100vh; border: 18px solid var(--highlight-color); }}@media(min-width:767px){body{padding:50px}}.wrapper{max-width:1000px;margin:0 auto}