(zettel (meta (back "00001005000000 00001005090000 00001010070200") (backward "00001005000000 00001005090000 00001010070200") (box-number "2") (created "20200804111624") (modified "20240827143500") (published "20240827143500") (role "configuration") (syntax "css") (title "Zettelstore Base CSS") (visibility "public")) (rights 4) (encoding "") (content "/*-----------------------------------------------------------------------------\n * Copyright (c) 2020-present Detlef Stern\n *\n * This file is part of Zettelstore.\n *\n * Zettelstore is licensed under the latest version of the EUPL (European Union\n * Public License). Please see file LICENSE.txt for your rights and obligations\n * under this license.\n *\n * SPDX-License-Identifier: EUPL-1.2\n * SPDX-FileCopyrightText: 2020-present Detlef Stern\n *-----------------------------------------------------------------------------\n */\n\n*,*::before,*::after {\n box-sizing: border-box;\n }\n html {\n font-family: serif;\n scroll-behavior: smooth;\n height: 100%;\n }\n body {\n margin: 0;\n min-height: 100vh;\n line-height: 1.4;\n background-color: #f8f8f8 ;\n height: 100%;\n }\n nav.zs-menu {\n background-color: hsl(210, 28%, 90%);\n overflow: auto;\n white-space: nowrap;\n font-family: sans-serif;\n padding-left: .5rem;\n }\n nav.zs-menu > a {\n float:left;\n display: block;\n text-align: center;\n padding:.41rem .5rem;\n text-decoration: none;\n color:black;\n }\n nav.zs-menu > a:hover, .zs-dropdown:hover button { background-color: hsl(210, 28%, 80%) }\n nav.zs-menu form { float: right }\n nav.zs-menu form input[type=text] {\n padding: .12rem;\n border: none;\n margin-top: .25rem;\n margin-right: .5rem;\n }\n .zs-dropdown {\n float: left;\n overflow: hidden;\n }\n .zs-dropdown > button {\n font-size: 16px;\n border: none;\n outline: none;\n color: black;\n padding:.41rem .5rem;\n background-color: inherit;\n font-family: inherit;\n margin: 0;\n }\n .zs-dropdown-content {\n display: none;\n position: absolute;\n background-color: #f9f9f9;\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n z-index: 1;\n }\n .zs-dropdown-content > a {\n float: none;\n color: black;\n padding:.41rem .5rem;\n text-decoration: none;\n display: block;\n text-align: left;\n }\n .zs-dropdown-content > a:hover { background-color: hsl(210, 28%, 75%) }\n .zs-dropdown:hover > .zs-dropdown-content { display: block }\n main { padding: 0 1rem }\n article > * + * { margin-top: .5rem }\n article header {\n padding: 0;\n margin: 0;\n }\n h1,h2,h3,h4,h5,h6 { font-family:sans-serif; font-weight:normal; margin:.4em 0 }\n h1 { font-size:1.5em }\n h2 { font-size:1.25em }\n h3 { font-size:1.15em }\n h4 { font-size:1.05em; font-weight: bold }\n h5 { font-size:1.05em }\n h6 { font-size:1.05em; font-weight: lighter }\n p { margin: .5em 0 0 0 }\n p.zs-meta-zettel { margin-top: .5em; margin-left: .5em }\n li,figure,figcaption,dl { margin: 0 }\n dt { margin: .5em 0 0 0 }\n dt+dd { margin-top: 0 }\n dd { margin: .5em 0 0 2em }\n dd > p:first-child { margin: 0 0 0 0 }\n blockquote {\n border-left: .5em solid lightgray;\n padding-left: 1em;\n margin-left: 1em;\n margin-right: 2em;\n }\n blockquote p { margin-bottom: .5em }\n table {\n border-collapse: collapse;\n border-spacing: 0;\n max-width: 100%;\n }\n td, th {text-align: left; padding: .25em .5em;}\n th { font-weight: bold }\n thead th { border-bottom: 2px solid hsl(0, 0%, 70%) }\n td { border-bottom: 1px solid hsl(0, 0%, 85%) }\n main form {\n padding: 0 .5em;\n margin: .5em 0 0 0;\n }\n main form:after {\n content: \".\";\n display: block;\n height: 0;\n clear: both;\n visibility: hidden;\n }\n main form div { margin: .5em 0 0 0 }\n input { font-family: monospace }\n input[type=\"submit\"],button,select { font: inherit }\n label { font-family: sans-serif; font-size:.9rem }\n textarea {\n font-family: monospace;\n resize: vertical;\n width: 100%;\n }\n .zs-input {\n padding: .5em;\n display:block;\n border:none;\n border-bottom:1px solid #ccc;\n width:100%;\n }\n input.zs-primary { float:right }\n input.zs-secondary { float:left }\n input.zs-upload {\n padding-left: 1em;\n padding-right: 1em;\n }\n a:not([class]) { text-decoration-skip-ink: auto }\n a.broken { text-decoration: line-through }\n a[rel~=\"external\"]::after { content: \"➚\"; display: inline-block }\n img { max-width: 100% }\n img.right { float: right }\n ol.zs-endnotes {\n padding-top: .5em;\n border-top: 1px solid;\n }\n kbd { font-family:monospace }\n code,pre {\n font-family: monospace;\n font-size: 85%;\n }\n code {\n padding: .1em .2em;\n background: #f0f0f0;\n border: 1px solid #ccc;\n border-radius: .25em;\n }\n pre {\n padding: .5em .7em;\n max-width: 100%;\n overflow: auto;\n border: 1px solid #ccc;\n border-radius: .5em;\n background: #f0f0f0;\n }\n pre code {\n font-size: 95%;\n position: relative;\n padding: 0;\n border: none;\n }\n div.zs-indication {\n padding: .5em .7em;\n max-width: 100%;\n border-radius: .5em;\n border: 1px solid black;\n }\n div.zs-indication p:first-child { margin-top: 0 }\n span.zs-indication {\n border: 1px solid black;\n border-radius: .25em;\n padding: .1rem .2em;\n font-size: 95%;\n }\n .zs-info {\n background-color: lightblue;\n padding: .5em 1em;\n }\n .zs-warning {\n background-color: lightyellow;\n padding: .5em 1em;\n }\n .zs-error {\n background-color: lightpink;\n border-style: none !important;\n font-weight: bold;\n }\n td.left, th.left { text-align:left }\n td.center, th.center { text-align:center }\n td.right, th.right { text-align:right }\n .zs-font-size-0 { font-size:75% }\n .zs-font-size-1 { font-size:83% }\n .zs-font-size-2 { font-size:100% }\n .zs-font-size-3 { font-size:117% }\n .zs-font-size-4 { font-size:150% }\n .zs-font-size-5 { font-size:200% }\n .zs-deprecated { border-style: dashed; padding: .2em }\n .zs-meta {\n font-size:.75rem;\n color:#444;\n margin-bottom:1em;\n }\n .zs-meta a { color:#444 }\n h1+.zs-meta { margin-top:-1em }\n nav > details { margin-top:1em }\n details > summary {\n width: 100%;\n background-color: #eee;\n font-family:sans-serif;\n }\n details > ul {\n margin-top:0;\n padding-left:2em;\n background-color: #eee;\n }\n footer { padding: 0 1em }\n @media (prefers-reduced-motion: reduce) {\n * {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n scroll-behavior: auto !important;\n }\n }\n"))