body { --text-color: #222; --bkg-color: white; --alink-color: blue; --aactive-color: red; --avisited-color: #006400; --petite-color: #a0a0a0; --bg-new-color: #51F9BAA3; --wtc-bg: #eeeedd; --lnk-bg: #dadada; } body.dark-theme { --text-color: #d3cfc9; --bkg-color: #131516; --alink-color: #5555db; --aactive-color: red; --avisited-color: #0f7d0f; --petite-color: #aca59a; --bg-new-color: #DD10106B; --wtc-bg: #979774; --lnk-bg: #535353; } @media (prefers-color-scheme: dark) { /* defaults to dark theme */ body { --text-color: #d3cfc9; --bkg-color: #131516; --alink-color: #5555db; --aactive-color: red; --avisited-color: #0f7d0f; --petite-color: #aca59a; --bg-new-color: #DD10106B; --wtc-bg: #979774; --lnk-bg: #535353; } body.light-theme { --text-color: #222; --bkg-color: white; --alink-color: blue; --aactive-color: red; --avisited-color: #006400; --petite-color: #a0a0a0; --bg-new-color: #51F9BAA3; --wtc-bg: #eeeedd; --lnk-bg: #dadada; } } body { background-color: var(--bkg-color); font-family: Verdana, Arial, Helvetica, sans-serif; font-size : 11pt; max-width: 1000px; margin: auto; padding-left: 3vw; padding-right: 3vw; padding-top: 5px; color: var(--text-color); } a:link {color: var(--alink-color)} a:active {color: var(--aactive-color)} a:visited {color: var(--avisited-color)} h1 { font-size : 18px; font-weight: normal; } .title1{ font-size:min(7.5vw,48px); } .title2{ font-size:min(4.6vw,28px); } h2 { font-size : 16pt; } .norm { font-size : 11pt; } p { text-align: justify; text-indent: 41px; } .fontsize18 { font-size : 18pt; text-align: center; } .petite { font-size : 11pt; text-align: center; color: var(--petite-color); } .footnote{ text-align: justify; max-width: min(800px,80vw); margin: auto; font-size : 11pt; } .black{ background-color: black; color: gray; } .normBlack { color:gray } .cover-images { text-align: center; max-width: 950px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); } .cover-images img{ padding: 10px 0px; } #bar{ height: 4px; width: min(40vw,400px); background-color: #9e9e9e; margin: auto; } .w85{ width: 85%; margin: auto; } .w85b{ width: 95%; margin: auto; border-width: 2px; border-color: green; border-style: solid; padding: 3px; } .w85b2{ width: 84%; margin: auto; border-width: 1px; border-color: #330000; border-style: solid; padding: 3px; //background-color: #eeeedd; background-color: var(--wtc-bg); color: #330000; } .bg-new{ background:var(--bg-new-color); } #left{ float: left; padding: 5px 10px; } .center{ text-align: center; } hr{ height: 1px; } #back{ float: left; } .env{ float: right; padding-right: 5px; } .grayBack{ background-color: var(--lnk-bg); padding: 4px; }