.web-content p, .web-content h1, .web-content h2, .web-content h3, .web-content h4, .web-content h5, .web-content h6,
.web-content ul, .web-content ol, .web-content table, .web-content blockquote, .web-content pre {
margin: .8em 0;
}
.web-content ul, .web-content ol, .web-content dd {
margin-left: 2em;
}
.web-content ul {
list-style-type: disc;
}
.web-content ol {
list-style-type: decimal;
}
.web-content blockquote::before {
content: "”";
color: #999;
display: block;
position: absolute;
font-style: italic;
font-size: 3rem;
line-height: 2rem;
margin-left: -3rem;
}
.web-content blockquote {
font-size: 1.1em;
padding-left: 3rem;
margin: 1rem 0;
}
.web-content table {
border-collapse: collapse;
}
.web-content table th, .web-content table td {
border: 1px solid #999;
padding: .5rem;
text-align: center;
}
.web-content table th {
background: #eee;
font-weight: bold;
}
.web-content .toc {
border: 1px solid rgba(0, 0, 0, 0.2);
background: rgba(0, 0, 0, 0.1);
padding: .3rem;
width: max-content;
}
.web-content .toc ol {
list-style: none;
counter-reset: item;
margin: .5rem 0 .5rem .5rem;
}
.web-content .toc ol li:before {
content: counters(item, ".") " ";
counter-increment: item;
color: #666;
}
.web-content aside.file {
margin: 1em;
}
.web-content aside.file small {
opacity: 0.7;
}
.web-content aside.file a {
display: inline-block;
margin-right: 1em;
padding: .5em;
padding-left: 1.8em;
border: 1px solid #999;
background: #eee;
border-radius: .5em;
background-repeat: no-repeat;
background-position: .5em center;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAQCAYAAADAvYV+AAAAd0lEQVQoz2NgQAVNQDwDCTcw4AF3gPg/Er4xSBWnAXEHFL9HU/wWSS4FpFgZiJ+jKULHT4BYAWa6LhC/w6HwNRBrojvHEoi/oCn8BMQmuDzoBsQ/oQq/A7E9AwEQDMQ/gNiHgUggx0AN8IVI/AGkeA+ReCdJTgAAgMhKhf6mzTIAAAAASUVORK5CYII=");
transition: background-color .2s, color .2s;
}
.web-content aside.file a:hover {
background-color: #ccc;
color: darkred;
}
.web-content figure.image {
text-align: center;
}
.web-content figure.image figcaption {
font-style: italic;
color: #666;
margin-top: 2pt;
}
.web-content figure.image.img-center {
max-width: 500px;
margin: 0 auto 8pt auto;
}
.web-content figure.image.img-left {
max-width: 200px;
float: left;
margin: 0 8pt 4pt 0;
clear: left;
}
.web-content figure.image.img-right {
max-width: 200px;
float: right;
margin: 0 0 4pt 8pt;
clear: right;
}
.web-content figure.image.img-left figcaption, .web-content figure.image.img-right figcaption {
font-size: .8em;
}
.web-content a.internal-image {
cursor: zoom-in;
}
.web-content img {
max-width: 100%;
}
.imageBrowser {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
background: url("data:image/svg+xml;base64,PCEtLSBCeSBTYW0gSGVyYmVydCAoQHNoZXJiKSwgZm9yIGV2ZXJ5b25lLiBNb3JlIEAgaHR0cDovL2dvby5nbC83QUp6YkwgLS0+Cjxzdmcgd2lkdGg9IjM4IiBoZWlnaHQ9IjM4IiB2aWV3Qm94PSIwIDAgMzggMzgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlLXdpZHRoPSIyIj4KICAgICAgICAgICAgPGNpcmNsZSBzdHJva2Utb3BhY2l0eT0iLjUiIGN4PSIxOCIgY3k9IjE4IiByPSIxOCIvPgogICAgICAgICAgICA8cGF0aCBkPSJNMzYgMThjMC05Ljk0LTguMDYtMTgtMTgtMTgiPgogICAgICAgICAgICAgICAgPGFuaW1hdGVUcmFuc2Zvcm0gYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgMTggMTgiIHRvPSIzNjAgMTggMTgiIGR1cj0iMXMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+CiAgICAgICAgICAgIDwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==") no-repeat center center;
background-color: rgb(0, 0, 0);
background-color: rgba(0, 0, 0, 0.75);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
transition: opacity .5s;
cursor: zoom-out;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
.imageBrowser figure {
max-height: 90%;
max-width: 90%;
display: inline-flex;
align-items: center;
justify-content: center;
transition: all .5s;
margin: 0;
}
.imageBrowser figure img {
background: #000;
max-width: 100%;
max-height: 100%;
padding: .5rem;
border-radius: .5em;
cursor: pointer;
}
@media handheld, screen and (max-width: 980px) {
.imageBrowser figure {
max-width: 100%;
max-height: 100%;
}
}