/* Copyright (c) 2017-2025 The Wizard Of Finity (https://ZedLX.com). All rights reserved. */ /*==== stylesheet for artic only (artic2) ====*/  a, title, h1, h2, p, div, ul, ol, li, textarea, pre, table, td, th, tr { padding: 0px; margin: 0px; border: none; font-weight: inherit;} em { font-style: normal; font-weight: normal;} /* the only way to render it consistently across browsers*/ i { margin-right:0.15em } /* to make space after italicized text */ body { padding: 0px; margin: 0px; border: none; } body, p, h1, h2, h3, h4, .artic h2 { font-family: "Nunito", Arimo, Arial, "Open Sans", sans-serif, "Adobe Blank";} /* Nunito, Arimo and Arial have almost identical dimensions; Open Sans is wider and higher */ .titleFont, .artic .homeH1, .keys, #headtitle a, #tophead #headtitle h1 a, #tophead h1, #tophead .subtitle, #tophead h2 { font-family: "Maven Pro", Nunito, Arimo, Arial, sans-serif, "Adobe Blank"; } /* Maven is slight wider than Nunito */ pre, textarea, .zcode, code, .fontSrcMono, .fontSrcMonoOrigSize, .zsymbols, .monosrc { tab-size:4; -moz-tab-size: 4; font-family: "Source Code Pro Medium", "Roboto Mono", "Droid Sans Mono", "Noto Sans Mono", monospace, "Adobe Blank"; } /* Text sizes for mobile and old devices */ body, .bodyFontSize { font-size: 15.6px; } /* font size of the interface */ .fontSrcMono, textarea { font-size: 16.0px; } /* monospaced font size; the minimum for textboxes, otherwise mobile devices will zoom automatically */ .articleFontSize, .artic article.articleWidth { font-size: 17.7px; } /* font size for articles; */ pre, code { overflow-x: auto; } pre, code, .zsymbols, .monosrc { font-size: 96%; } /* must be in percentages because the base font can be mediumFontSize or articleFontSize */ pre code, pre .zsymbols, pre .monosrc { font-size: 100%; } /* avoids nested 90% font size */ textarea.fontSrcMono { line-break: anywhere; overflow-y: scroll; scrollbar-width: thin; } .articleWidth { max-width: 48em; } /* about 112 characters, max. 115, for Nunito 18.8px font */ .artic article ul, .artic article ol { padding-left: 2.4em; margin-top: 0.24em; line-height: 1.45em; } .artic article ol > li, .artic article ul > li { padding-left: 0.6em; margin-top: 0.5em; margin-bottom: 0.5em; margin-right: 1.0em; } .artic article h2, .artic article h3, .artic article h4 { text-align: left; } .artic article p { line-height: 1.55em; margin-top: 0.7em; margin-bottom: 0.2em; } .artic article { padding: 0px 0px; } .artic article { margin-top: 1.5em;} .artic article h1 { font-size: 144%; font-weight: bold; margin-top: 0.9em; margin-bottom: 0.3em; text-align: center; } .artic article h2 { font-size: 130%; font-weight: normal; margin-top: 1.2em; margin-bottom: 0.3em; } .artic article h3 { font-size: 120%; font-weight: bold; margin-top: 0.8em; margin-bottom: 0.2em; } .artic article h4 { font-size: 110%; font-weight: normal; margin-top: 0.8em; margin-bottom: 0.2em; } .zcode, .monosrc { white-space: nowrap; } .zsymbols, .zcode { padding: 0.1em 0.1em; margin-left: 0.2em; margin-right: 0.2em; } pre, code, .pre, .zsymbols { white-space: pre; line-height: 140%; } .inlinepre { white-space: pre; display: inline; } /* where is this usefull? */ .keys { font-weight: 700; } .math { font-style: italic; white-space: pre; } .mathBlock { font-style: italic; display:inline-block; } .mathBlockBig { display:block; margin-top: 0.5em; white-space: pre; overflow-x: auto; } .underlineP:hover { text-decoration: underline;} .block { display: block; } .bottomLine { border-bottom: 1px solid; } .topLine { border-top: 1px solid; } .allLine { border: 1px solid;} .noUdBorder { border-bottom: none; border-top: none;} .noLeftBorder { border-left: none;} .noRightBorder { border-right: none;} .bigMarginTop, #contentmargin .bigMarginTop { margin-top: 1.3em;} #contentmargin .contentTitle nav { display:inline; float:right; margin-left: 25px; } #contentmargin .contentTitle nav > div { display:inline-block; margin-left: 15px; } #contentmargin .contentTitle h1 { padding: 0.45em 5%; margin: 0px; } #contentmargin .contentTitle hr { border-width: 1.7px; border-style: solid; margin-bottom:0.2em; margin-top:0.2em;} #endPrevNext { font-size: 115%; } .borderDoubleHorizontal { border-top: 4px solid #999; border-bottom: 4px solid #999; margin: 0.2em 0px 0.2em 0px; } .marginCenter { margin-left:auto; margin-right:auto; } img.article-image { border: 4px solid #333; height: auto; width:50%;} img.article-image.float-right { float: right; margin: 1em 0em 1em 2em;} img.article-image.float-left { float: left ; margin: 1em 2em 1em 0em;} dl { display: grid; column-gap: 1.5em; row-gap: 0.3em; margin-top: 0.4em; } dd { margin-left: 0em; } .childDTsuffixEquals > dt::after { content: "="; margin-left: 1.1em; } .childDTsuffixColon > dt::after { content: ":"; margin-left: 0.1em; } .childDDalignRight > dd { text-align: right; } .indentMargin3 { margin-left: 3em; } /***********************************************************************/ #tophead { font-weight: 400; } #tophead a { text-decoration: none;} #tophead #titlediv a:hover { text-decoration: none;} #titlediv { text-align: center; } #titlediv h1, #headtitle { text-align: center; font-size: 165%; margin:0px; padding:5px; padding-top:0.4em; border: none;} #titlediv .subtitle { font-size: 108%; padding-bottom: 0.9em;} #topnav { z-index: 10; /*padding-bottom:1px;*/} #topnav ul { padding-left:19px; float:left; } #topnav li { display: inline-block; margin-left: 0px; margin-top: 0px; } #topnav li a { display: block; padding: 5px 13px 0px 13px; height: 26px; } #topnav { border-bottom: 1px solid; } #socshare { display: none; } /* don't display it until the socshare css loads */ /* disabled: when console doesn't fit, can't scroll or move console left or right */ /* #pagemargin { overflow-x:hidden; } ???? to fix chrome mobile zoom on overflow */ #contentmargin { margin: 0px 10%; padding: 0px; } #contentmargin { max-width: 1651px; } /* never reached by OokBF */ #innercontent { margin-left:auto; margin-right:auto; margin-bottom: 25px; } #contentmargin { min-height: 70vh; } #innercontent { min-height: 85vh; } #footermargin { margin: 0px 0px; padding: 0px; } #footermargin { clear: both; padding-top:10px; } #footer { width: 100%; font-size: 95%; text-align: center;} #footer { padding-left: 0px; padding-right: 0px; padding-top: 0.4em; padding-bottom: 0.4em;} #footer #privacyLink, #footer #licensesLink { float:right; opacity: 0.8; } @media only screen and (hover: none) and (max-width: 1040px){ .desktopOnly { display: none; } } @media screen and (max-width: 900px) { /* js matches 900*/ .tabletPortrait { display: initial; } #contentmargin { margin-left: 3%; margin-right: 5%; } /* reduce page margins on small screens*/ } @media screen and (max-height: 900px), screen and (orientation:landscape) { .tabletPortrait { display: none; } } @media screen and (max-width: 736px) { #titlediv { height: initial;} #tophead h1, #headtitle { font-size: 155%;} #titlediv .subtitle { font-size: 110%; /*padding: 0px 10px;*/ padding-bottom: 10px;} } @media screen and (max-width: 736px) and (max-height: 770px){ .artic article p, .artic article h1, .artic article h2 { margin-top: 0.7em; } .artic article p { line-height: 1.5em; } } @media screen and (max-width: 590px) { .artic article p { line-height: 1.5em; } .artic article p, .artic article h1, .artic article h2 { margin-top: 0.65em; } } @media screen and (max-width: 450px) { /* #contentmargin { margin-left: 2%; margin-right: 5%; } /* reduce page margins on very small screens*/ } /**************************** content element styles ********************************/ aside { float: right; border: 6px solid; margin:12px; padding: 0px 20px; } label { display: inline-block; margin: 2px;} select { font-size: 105%; border: 2px solid ; height: 33px; padding-left: 15px; padding-bottom: 2px;} button { font-size: 100%; border: 0px solid ; padding:6px; margin: 7px; padding-left: 20px; padding-right: 20px;} button span { vertical-align: middle; } input { display:inline-block; text-align: right; } textarea { padding: 6px; width: 100%; min-height: 1.25em; resize: vertical; vertical-align: top; } fieldset { display:inline-block; border: 2px solid; margin: 4px; margin-left: 20px; margin-bottom:10px;} fieldset label { min-width: 75%; } details { border: 2px solid; margin-top:10px; margin-bottom:10px; } details > summary { cursor:pointer; padding:9px; padding-left:20px; padding-right:20px; } details > div { padding-left:30px; padding-right:20px; } details { transition: height 0.1s; } details > div { transition: opacity 0.5s; } ::-webkit-scrollbar { width: 1.3em; } /**************************** colors default **********************************/ .artic h2 { border-bottom: 3px solid #999} .artic article h1, .artic article h2, .artic article h3, .artic article h4, article .contentTitle, article .contentTitle hr, article .contentTitle .borderDoubleHorizontal { color: #aad; border-color: #88b; } aside { border-color: #3d3d3d; background-color: #2a2a2a; } textarea, select { color: #DDD; background-color: #383838; border-color: #777 } textarea:focus { border: 1px solid #56f; outline: none; box-shadow: 0px 0px 4px #56f; } textarea { border: 1px solid #333; scrollbar-color: #666 #444; } ::-webkit-scrollbar { background-color: #444; } ::-webkit-scrollbar-thumb { background-color: #666; border: 1px solid #444; } ::-webkit-resizer { background-color: #555; } textarea::selection { background-color: #34d; color: #eee; } input { color: #DDD; background-color: #555; } button { color: #a0b0e4; background-color: #232b99; } button:hover { color: #bcf; background-color: #23c; } button:active /* active = pressed down */ { color: #cdf; background-color: #34f; } details { background-color: #282828; border-color: #444 } fieldset { border-color: #555; } body, html, input { scrollbar-color: #40404f #334; } /*{ scrollbar-color: dark; }*/ body::-webkit-scrollbar { background-color: #334; width: 13px; } body::-webkit-scrollbar-thumb { background-color: #42424c; border: 1px solid #333;} /* main body scrollbars are above*/ .artic .homeH1 { color: #d9d9d9; } body, .fontColorNormal { color: #ccc; background-color: #202020; } code, .zcode, .zsymbols, .monosrc { color: #a7c7ee; } b code, code b, b .zcode .zcode b, .monosrc b, b .monosrc { color: #fff3c4; font-weight: normal; } .zsymbols { background-color: #3a3a5a; } .mathBlockBig { color: #dc7; } hr { border-color: #aaa;} a, .buttonColor { color: #8bf; } main a:visited { color: #6692ee; } #titlediv { background-color: #121877; /* fallback */ /*background-image: linear-gradient(to right, #2a0d5e, #121877); } */ } #titlediv a, #headtitle, #tophead h1, #tophead h2, #tophead p { color: #ccc;} .topLine, .bottomLine , .allLine , #pagemargin #topnav { border-color: #0d29c9; } /*#2a44a6;*/ .buttonColor, .hoverButton { background-color: #202020; } .hoverButton:hover { background-color: #202890; } #footer, #footer a { color: #b0b0b0; background-color: #161f66; } /***************************** MEDRES ******************************************/ /*@media screen and (min-width: 1300px), screen and (min-width: 1245px) and (max-height: 810px) {*/ /*@media screen and (min-width: 1201px) {*/ /*@media screen and (min-width: 1371px) { /* until 11.2023. */ /*@media screen and (min-width: 1315px) { /* from 11.2023. */ @media screen and (min-width: 1420px) { /* from 05.2024. view: 1390px (sans scrollbar) */ /* change the following two values to adjust the font sizes */ body, .bodyFontSize { font-size: 16.7px; } /* font size of the interface, should equal 0.934 × mediumFontSize */ .fontSrcMono { font-size: 16.1px; } /* monospaced font size; should be about 95% of bodyFontSize for Source Code Pro */ .articleFontSize, .artic article.articleWidth { font-size: 18.8px; } /* font size for articles; should equal mediumFontSize ×1.05 */ /* body, .bodyFontSize { font-size: 17.4px; } pre, #source, .CodeMirror { font-size: 15.66px; } /* 0.9 × bodyFontSize */ #titlediv { height: initial;} #titlediv h1, #headtitle { padding:7px; padding-top:14px; font-size: 160%;} #titlediv .subtitle { padding-bottom: 16px; font-size: 113%;} #topnav { /*min-height: 39px;*/ } #topnav ul { padding-left:35px; } #topnav li a { height: 28px; padding: 5px 20px 0px 20px; } /* must be in px to keep the same height for socshare */ }