/* === Fonts: same as clean.css (edit these to exactly match your current file) === */ @import url("https://fonts.googleapis.com/css?family=Noto+Serif:400,400italic,700,700italic"); @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600"); @import url("https://fonts.googleapis.com/css?family=Inconsolata:400,700"); /* === Base document (compact) === */ html, body { font-family: "Noto Serif", "Times New Roman", serif; font-size: 14px; line-height: 1.4; margin: 0; padding: 0; color: #111; background-color: #ffffff; } /* main content column; will be shifted right if toc2 is present */ #header, #content, #footnotes, #footer { margin: 0.5in auto; max-width: 900px; } /* headings: clean.css look, compact spacing */ h1, h2, h3, h4, h5, h6, #toctitle, .sidebarblock > .content > .title { font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif; font-weight: 600; color: #222; line-height: 1.2; margin-top: 1em; margin-bottom: 0.5em; } /* title block */ #header > h1 { margin-top: 0.2em; margin-bottom: 0.1em; } #header .details { font-size: 0.95em; margin-top: 0.2em; } /* paragraphs and lists: tighter vertical space */ p { margin: 0 0 0.75em 0; } ul, ol { margin-top: 0; margin-bottom: 0.75em; padding-left: 1.6em; } li > p { margin-bottom: 0.3em; } /* section body spacing */ .sectionbody { margin-top: 0.5em; } /* monospace/code */ code, pre, tt { font-family: "Inconsolata", "Droid Sans Mono", "Courier New", monospace; } pre { font-size: 13px; line-height: 1.35; padding: 0.5em 0.75em; margin: 0.75em 0; background-color: #f7f7f7; border-radius: 3px; overflow-x: auto; } /* tables: slightly compact */ table.tableblock { font-size: 13px; border-collapse: collapse; } table.tableblock th, table.tableblock td { padding: 0.3em 0.5em; border: 1px solid #ddd; } /* admonitions / examples / sidebars */ .admonitionblock, .exampleblock, .sidebarblock { margin: 0.75em 0; padding: 0.6em 0.8em; border-radius: 3px; background-color: #f8f8f8; } /* images & equations */ .imageblock, .stemblock { margin: 0.75em 0; } .figure .title, .stemblock .title { margin-top: 0.25em; } /* Responsive images - fit within page width */ .imageblock img { max-width: 100%; height: auto; display: block; margin: 0 auto; cursor: pointer; transition: transform 0.2s ease; } /* Click-to-zoom functionality */ .imageblock img:hover { opacity: 0.9; } .imageblock img.zoomed { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1.5); max-width: 95vw; max-height: 95vh; z-index: 1000; cursor: zoom-out; box-shadow: 0 0 20px rgba(0,0,0,0.5); background: white; padding: 10px; } /* Overlay for zoomed images */ .image-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 999; display: none; } .image-overlay.active { display: block; } /* footnotes compact */ .footnote, .footnotes { font-size: 0.9em; line-height: 1.3; } /* === TOC as left sidebar (toc2) === */ /* Asciidoctor adds class 'toc2' on when :toc: left or right */ body.toc2 { padding-top: 0; } /* sidebar box */ #toc.toc2 { position: fixed; top: 0; left: 0; width: 18em; height: 100%; overflow: auto; padding: 1em; background-color: #f8f8f7; border-right: 1px solid #e7e7e9; box-sizing: border-box; } /* TOC title and list style */ #toctitle { margin-top: 0; font-size: 1.1em; } #toc.toc2 > ul { list-style: none; padding-left: 0; margin: 0.5em 0 0 0; } #toc.toc2 ul ul { padding-left: 1em; } #toc.toc2 a { text-decoration: none; color: #336699; } #toc.toc2 a:hover { text-decoration: underline; } /* shift main content to the right when toc2 present */ body.toc2 #header, body.toc2 #content, body.toc2 #footnotes, body.toc2 #footer { margin-left: 19.5em; margin-right: 0.75in; max-width: none; } /* === Collapsible blocks styling === */ /* Outer collapsible blocks (sections) */ details { margin: 0.75em 0; padding: 0.75em; background-color: #e8e8e8; border-radius: 4px; border-left: 3px solid #999; } details summary { cursor: pointer; font-weight: 600; color: #333; margin-bottom: 0.5em; } details[open] { background-color: #e8e8e8; } details > .content { margin-left: 1em; } /* Nested collapsible blocks (answers within questions) */ details details { background-color: #f5f5f5; border-left: 3px solid #bbb; padding: 0.5em 0.75em; margin: 0.5em 0; } details details summary { font-weight: 500; font-size: 0.95em; } details details[open] { background-color: #f5f5f5; } /* === Small screen tweak === */ @media screen and (max-width: 768px) { #header, #content, #footnotes, #footer { margin: 0.5em; } body.toc2 #header, body.toc2 #content, body.toc2 #footnotes, body.toc2 #footer { margin-left: 0.5em; margin-right: 0.5em; } #toc.toc2 { position: static; width: auto; height: auto; border-right: none; border-bottom: 1px solid #e7e7e9; } }