* { margin: 0; padding: 0; box-sizing: border-box; } html { font-family: "Lato", "Helvetica", "Arial", sans-serif; font-size: max(0.825vw, 15px); } body { color: rgb(51,51,51); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='160' height='32'%3E%3Cfilter id='vnoise' x='0' y='0'%3E%3CfeTurbulence type='turbulence' baseFrequency='1.0 0.01' numOctaves='2' seed='16807' stitchTiles='stitch' result='noise' /%3E%3CfeBlend mode='color-dodge' in='SourceGraphic' in2='noise'/%3E%3C/filter%3E%3Crect width='160' height='32' filter='url(%23vnoise)' fill='%23ccc5' opacity='0.35'/%3E%3C/svg%3E"), linear-gradient(90deg, rgb(121, 158, 136) 5%, rgb(171, 171, 138) 28% 72%, rgb(121,158,136) 95%); } :target:before { content:""; display:block; height:150px; margin:-150px 0 0; } pre { display: inline; margin: 0; } p { margin: 20px auto; line-height: 1.4; letter-spacing: 0.010rem; } a { width: auto; margin: 0px; text-decoration: none; color: rgb(16,109,151); } code { display: block; margin: 20px 2%; padding: 10px 10px; } li { margin: 0 5%; line-height: 0.5; } hr { border: 0; } figcaption { margin: 40px auto -5px; font-size: 1rem; color: rgb(48,96,128); text-align: center; } img { display: block; max-width: 100%; width: auto; height: auto; object-fit: scale-down; margin: 15px auto; } .title { margin: 2px auto 5px; font-family: "Helvetica", "Arial", sans-serif; } .subtitle { margin: 2px auto 5px; font-family: "Helvetica", "Arial", sans-serif; color: rgb(96,96,96); } .keyword { font-weight: 400; color: rgb(135,90,180); } .line-top { height: 3px; } .line-bottom { height: 3px; } .divider { width: 40%; margin: 80px auto 20px; border-top: 3px dotted rgb(112,112,112,0.3); } .nav-divider { width: 60%; height: 3px; margin: 18px auto; background-color: rgba(199, 211, 188, 0.36); } .notice-divider { width: 40%; margin: 8px auto; border-top: 2px solid rgb(157, 177, 159); } .article-section > .section-bookend { width: 30%; margin: auto; background: linear-gradient(to right, rgba(173, 10, 62, 0.17) 10%, rgba(216, 170, 166, 0.83) 40%, rgba(173, 10, 62, 0.11) 98%); height: 15px; margin-left: -60px; border: 2px solid rgba(163, 122, 122, 0.27); } .footer-section > .section-bookend { width: 30%; margin: auto; background: linear-gradient(to right, rgba(207, 102, 10, 0.18) 10%, rgba(218, 189, 168, 0.83) 40%, rgba(210, 103, 52, 0.19) 98%); height: 15px; margin-left: -40px; border: 2px solid rgb(201, 180, 162); } .counter, .date { margin-right: 25px; font-family: "Lato", sans-serif; font-size: 0.800rem; } .image-block { width: 90%; margin: 40px auto 20px; text-align: center; } .image-block > .frame { display: inline-block; padding: 10px 5% 10px; text-align: center; background: rgba(204,205,188); } .frame > img { display: inline-block; width: auto; height: auto; object-fit: scale-down; } .frame > .title { margin: 5px auto -5px; font-family: "Lato", sans-serif; font-size: 1.000rem; color: rgb(95,90,90); } .frame > .caption { margin: 5px auto 5px; font-family: "Lato", sans-serif; font-size: 0.850rem; color: rgb(59,88,99); } #banner { width: 100%; max-width: inherit; min-width: 720px; height: 96px; position: sticky; top: 0; z-index: 99; padding-bottom: 0px; box-shadow: 2px 2px 3px rgba(38, 103, 97, 0.67); } #masthead { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; height: 72px; background-color: rgb(233,227,210); } #masthead .site-emboss { margin: auto 20px; font-family: "Impact", serif; font-size: 3.000rem; white-space: nowrap; color: rgb(222,216,199); } #masthead .invisible { visibility: hidden; } #masthead .site-title { align-self: center; padding-left: 60px; font-family: "Alfa Slab One", serif; font-size: 2.500rem; white-space: nowrap; color: rgb(43,88,111); } #site-sections-bar { display: flex; flex-wrap: wrap; justify-content: center; height: 24px; background-color: rgb(185, 215, 204); } #site-section-links { display: flex; align-items: flex-end; flex-wrap: wrap; justify-content: space-around; width: 100%; max-width: 960px; } #site-section-links a { font-family: "Lato", "Helvetica", "Arial", sans-serif; font-size: 0.9000rem; padding: 0px 0px 2px; color: rgb(51,51,51); } #content-container { width: 70vw; min-width: 720px; display: grid; grid-template-columns: 14% 84%; gap: 2%; margin: auto; margin-top: 54px; margin-left: calc(50vw - 40%); } @media all and (width a > img { max-width:70%; height: auto; margin: 60px auto; border: none; opacity: 50%; } #article-body, #toc-body { min-height: calc(100vh - 330px); padding: 20px 20px 60px; background: rgb(212,215,201); box-shadow: 4px 4px 6px rgb(97, 96, 92, 0.5), -4px 0px 3px rgb(97, 96, 92, 0.5); } .notice-main { margin: 20px auto; padding: 10px; border-radius: 5px; text-align: center; color: rgb(65, 87, 87); background-color: rgba(187, 209, 181, 0.61); border-left: 10px solid #76896d8a; border-right: 10px solid #9aaa91; box-shadow: 0px 2px 5px #a09484b8; width: 80%; } .notice-main > a { color: rgb(129, 64, 79); } .toc-header { margin-left: -20px; margin-right: -20px; margin-bottom: 50px; background: linear-gradient(90deg, #9a7474 1%, #ad7878 1% 6%, rgb(196, 155, 148) 6% 11%, rgb(197, 198, 186) 11% 89%, rgb(196, 155, 148) 89% 94%, #ad7878 94% 99%, #9a7474 99%); box-shadow: 0px 4px 7px rgba(158, 152, 106, 0.73); } .toc-title { padding-top: 10px; padding-bottom: 0px; font-family: "Oswald", "Bookman Old Style", serif; font-weight: 400; font-size: 1.800rem; color: rgb(105, 105, 102); letter-spacing: 0.12rem; width: max-content; margin: auto; } .toc-subtitle { padding-bottom: 15px; font-family: Roboto, inherit"Merienda", sans-serif; font-weight: 400; font-size: 1.000rem; color: rgb(116, 112, 94); letter-spacing: 0.100rem; margin: auto; width: max-content; } #toc-body .notice { margin: 20px auto; padding: 10px; border-radius: 5px; text-align: center; color: rgb(34, 53, 60); background-color: rgb(197, 199, 199); border-left: 10px solid #b2b1bc; border-right: 10px solid #b2b1bc; box-shadow: 0px 2px 5px #9fa7a5; width: 80%; } #toc-body .notice strong { color: rgb(129, 64, 64); font-weight: normal; } #toc-body .notice em { font-style: oblique 3deg; color: rgb(123, 49, 49); } #toc-body .notice a { padding: 0px 2px; text-decoration: underline #fff67082 solid 2px; color: rgb(34, 53, 60); } .toc-section { margin: 60px 40px 0px 40px; font-family: "Lato", "Bookman Old Style", sans-serif; font-size: 1.000em; color: rgb(51,51,51); } .toc-section > .section-title-box { display: block; width: max-content; margin-left: -60px; margin-right: 100px; margin-bottom: 40px; padding: 2px 40px 4px 20px; background: linear-gradient(90deg, rgb(189, 190, 172) 18px, rgb(196, 197, 182) 18px calc(100% - 18px), rgb(189, 190, 172) calc(100% - 18px)); box-shadow: 3px 2px 5px rgba(99, 112, 101, 0.57); } .toc-section > .section-title-box > .section-title { font-family: "Oswald", "Bookman Old Style", serif; font-weight: 700; font-size: 1.25rem; color: rgb(124, 123, 112); letter-spacing: 0.05rem; padding-left: 15px; } .toc-entries { width: 90%; height: auto; /*! border-radius: 5px; */ border: 3px solid #bdbebd; margin: 10px auto 10px; border-left: 3px solid #24694547; border-right: 3px solid #24694547; } .toc-entry-box { background: rgba(179, 201, 183, 0.72); } .toc-entry-box:nth-child(4n+3) { background: #c0cdbcde; } .toc-entry-divider { width: 100%; margin: 0px; border-top: 2px solid rgb(178, 189, 184); } .toc-entry-box > .title { margin: 0px 1%; width: 100%; font-family: Roboto Condensed, serif; font-size: 1.1rem; padding: 6px 10px 0px 12px; color: #524f41f5; } .toc-entry-box > .metadata { display: flex; justify-content: space-between; width: 100%; padding: 2px 1% 3px; } .toc-entry-box > .metadata > .author { font-family: "Roboto Condensed", "Arial", serif; font-size: 0.8rem; color: #5b614d; visibility: hidden; } .toc-entry-box > .metadata > .date { font-family: "Arial", serif; font-size: 0.7rem; color: #616161; margin-right: 10px; } .article-header { margin-left: -20px; margin-right: -20px; margin-bottom: 50px; background: linear-gradient(90deg, #506569 1%, #4476a2 1% 6%, rgb(103, 162, 131) 6% 11%, rgb(202, 203, 178) 11% 89%, rgb(103, 162, 131) 89% 94%, #4476a2 94% 99%, #506569 99%); box-shadow: 0px 4px 10px rgba(179, 157, 144, 0.93); } .article-title { padding-top: 10px; padding-bottom: 0px; font-family: "Oswald", "Bookman Old Style", serif; font-weight: 300; font-size: 1.600rem; color: rgb(107, 108, 110); letter-spacing: 0.060rem; width: max-content; margin: auto; } .article-subtitle { padding-bottom: 15px; font-family: Roboto, sans-serif; font-weight: 400; font-size: 0.900rem; color: rgba(129, 64, 79, 0.69); letter-spacing: 0.100rem; width: max-content; margin: auto; } .article-byline { width: max-content; margin: 20px -20px 40px auto; padding: 5px 20px 5px 20px; font-size: 0.800rem; color: rgb(116, 120, 106); border-top-left-radius: 5px; border-bottom-left-radius: 5px; background: rgb(195, 200, 186); box-shadow: -3px 2px 5px rgba(172, 178, 161, 0.93); } .article-byline > .article-author { font-size: 0.900rem; font-weight: 700; } .article-byline > .article-date { margin-right: 1rem; } .article-section { margin: 60px 40px 0px 40px; font-family: "Lato", "Bookman Old Style", sans-serif; font-size: 1.000em; color: rgb(51,51,51); } .article-section > .section-title-box { display: block; width: max-content; margin-left: -60px; margin-right: 100px; margin-bottom: 20px; padding: 5px 40px 5px 20px; background: linear-gradient(90deg, rgb(189, 190, 172) 18px, rgb(196, 197, 182) 18px calc(100% - 18px), rgb(189, 190, 172) calc(100% - 18px)); box-shadow: 2px 3px 4px rgba(132, 115, 105, 0.66); } .article-section > .section-title-box > .section-title { font-family: "Oswald", "Bookman Old Style", serif; font-weight: 700; font-size: 1.250rem; color: rgb(124, 123, 112); letter-spacing: 0.05rem; padding-left: 10px; } .section-body { padding: 20px 12px; border-radius: 5px; } .section-body > p { margin: 10px auto; } .section-body > p > a { color: rgb(40,93,160); } .section-body > p > em { font-style: oblique 5deg; color: rgb(101, 31, 122); } .code-inline { margin: 0px 3px; padding: 0px 3px; font-family: "Inconsolata", monospace; color: rgb(34, 52, 36); background-color: rgb(185, 211, 193); } #article-body .notice { width: 81%; margin: 20px auto; padding: 10px; text-align: center; color: rgb(72, 88, 89); background-color: rgb(202, 203, 189); border-radius: 5px; border-left: 10px solid #82ad89; border-right: 10px solid #82ad89; box-shadow: 0px 2px 5px #8b887a94; } #article-body .notice strong { color: rgb(113, 69, 69); font-weight: normal; } #article-body .notice em { font-style: oblique 3deg; color: rgb(123, 49, 49); } #article-body .notice a { padding: 0px 2px; text-decoration: underline #6e989c solid 2px; color: rgb(34, 53, 60); } .article-section > .section-body > .code-block { margin: 10px 2%; } .article-section > .section-body > .code-block div { margin: 2px 5px -15px 4%; font-size: 0.833rem; color: rgb(45, 91, 52); } code .tokens-red { font-style: normal; color: rgb(235, 176, 72); } code .tokens-green { font-style: normal; color: rgb(203,244,204); } code .tokens-yellow { font-style: normal; color: rgb(235, 231, 175); } .command, .infobox { font-family: "Inconsolata", monospace; font-size: 1.000rem; color: rgb(214, 217, 211); background-color: rgb(42, 79, 102); border: 3px solid #a7a7a7; } .infobox > .tokensgrid { display: flex; flex-flow: row wrap; justify-content: start; #justify-content: space-evenly; } .infobox > .tokensgrid > span { margin-left: 50px; } .notice > .command-inline { display: inline; margin: 0px 5px; padding: 0px 4px; font-family: "Inconsolata", monospace; font-size: 1.000rem; color: rgb(32, 32, 32); background-color: rgb(192, 192, 184); border: 1px solid #a7a7a7; } .notice > .command-inline span { color: rgb(0, 60, 150); } .tokenstable { font-family: "Inconsolata", monospace; font-size: 1.000rem; #color: rgb(50,44,19); color: rgb(16,48,96); background-color: rgb(208, 208, 187); border: 1px solid #328b33; } .tokenslist { font-family: "Inconsolata", monospace; font-size: 1.000rem; color: rgb(112,11,11); background-color: rgb(208, 208, 187); border: 1px solid #328b33; } .tokenslist > span:nth-child(odd) { color: rgb(50,44,19); } .article-section > .section-body > .link-block { margin: 10px 2%; } .article-section > .section-body > .link-block div { margin: 2px 5px -15px 4%; font-size: 0.833rem; color: rgb(68, 78, 97); } .link { display: flex; flex-wrap: wrap; color: rgba(64,96,64,1); background-color: rgb(200, 211, 185); border: 1px solid #7f857a; } .link a { margin-right: 1.5em; font-family: "Lato", sans-serif; font-weight: normal; font-size: 0.900rem; letter-spacing: 0.030rem; color: rgb(52, 70, 50); } span.ancl { align-self: end; margin-right: 1.5em; margin-left: auto; font-family: "Lato", sans-serif; font-size: 0.800rem; color: rgba(22, 42, 22, 1); } span.ancl * { margin-right: 1.5em; } span.break { flex-basis: 100%; height: 5px; } span.break + span.break { height: 20px; } #article-footer { margin: 30px auto 60px; padding: 40px; padding-left: 0px; background: rgb(204, 216, 207); box-shadow: 4px 4px 6px rgb(97, 96, 92, 0.5), -4px 0px 3px rgb(97, 96, 92, 0.5); } .footer-section > .section-body a { color: rgb(88, 79, 85); border: 2px solid #b6c0b8; padding: 1px 4px; background: #d7d8c6; } .footer-section { margin: 0px 40px 60px 40px; font-family: "Lato", "Bookman Old Style", sans-serif; font-size: 1.000em; color: rgb(51,51,51); } .footer-section > .table { border: 15px ridge #968a6e1f; margin: 30px auto; width: 80%; padding: 0px; } .footer-section > .section-title-box { display: block; width: max-content; margin-left: -40px; margin-right: 100px; margin-bottom: 20px; padding: 5px 40px 5px 20px; background-color: rgba(140,115,103,1); background: linear-gradient(90deg, rgb(121, 156, 145) 18px, rgb(131, 169, 157) 18px calc(100% - 18px), rgb(121, 156, 145) calc(100% - 18px)); box-shadow: 2px 3px 4px rgba(43, 85, 84, 0.61); } .footer-section > .section-title-box > .section-title { font-family: "Oswald", "Bookman Old Style", serif; font-weight: 300; font-size: 1.250rem; color: rgb(241, 240, 230); letter-spacing: 0.05rem; padding-left: 10px; } .footer-section p { margin: 10px 40px; padding: 0px 30px; } .footer-section em { font-style: oblique 3deg; color: rgb(137,42,42); } .notes ol { list-style: none; counter-reset: idx 1; } .notes li { margin: 2% 5%; padding: 0 0 0 .5em; counter-increment: idx; font-size: 0.900rem; line-height: 1.1; } .notes li::marker { content: counter(idx) ". "; color: black; } div.changelog { display: grid; grid-template-columns: minmax(4%, max-content) minmax(14%, max-content) 1fr; gap: 1%; width: 100%; margin: 10px 0px; padding: 0 30px; font-size: 0.850rem; background: rgb(207, 203, 194); } .changelog .counter { display: block; padding: 2px; color: rgb(80,80,80); align-self: center; } .changelog .date { display: block; padding: 2px; color: rgb(64, 68, 69); background: rgb(212, 216, 196); align-self: center; text-align: center; } .changelog > a { color: rgb(52, 41, 41); border: 0px dashed #8c97a063; padding: 1px 4px; background: #d8cdcc; } #site-footer { width: 100%; min-width: 720px; min-height: 120px; margin: 60px auto 0px; padding-top: 10px; padding-bottom: 10px; background-color: rgba(11,78,42,0.36); } #site-footer p { width: fit-content; min-width: 720px; max-width: 1280px; font-family: "Lato", "Arial", sans-serif; font-size: 0.800rem; margin: 1px auto; text-align: center; color: rgb(240,240,240); } #site-footer a { color: rgb(232,222,95); } #site-footer > p.copyright { margin-top: 20px; }