body { color:#007575;}
.md-typeset table:not([class]) { font-size:0.8rem; }

.md-typeset a { color:blueviolet; }
div.admonition { font-size:small; border:solid gray 1px; width:75%; margin:auto !important; margin-bottom:2vh; }
img { display:block; margin:auto; width:30%; border:solid gray 1px;cursor:pointer; }
img:hover{opacity:0.7}
h2 { font-size:1.5rem; }
h3 { font-size:1.2rem; font-weight:700; }
#modal-image { cursor:default; opacity:1;}
.headerlink { display:none; }

.test { display:none !important; }

/* from https://www.w3schools.com/howto/howto_css_modal_images.asp */

.modal{display:none;position:fixed;z-index:1;padding-top:100px;left:0;top:0;width:100vw;height:100vh;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.9)}
.modal-content{margin:auto;display:block;width:80%;max-width:700px}
#caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}
#caption,.modal-content{animation-name:zoom;animation-duration:0.3s}

@keyframes zoom{from{transform:scale(0)}to{transform:scale(1)}}.close{position:absolute;top:15px;right:35px;color:#f1f1f1;font-size:40px;font-weight:bold;transition:0.3s}.close:focus,.close:hover{color:#bbb;text-decoration:none;cursor:pointer}@media only screen and (max-width: 700px){.modal-content{width:100%}}

span.hll{ background-color:#cc0; display:block; }

@media (prefers-color-scheme:dark) {
  /*  @import werkt niet na media-queries
         https://developer.mozilla.org/en-US/docs/Web/CSS/@import#description  
      dus dracula-theme maar hier gekopieerd.
      https://github.com/dracula/highlightjs
  */

    body { background-color: #1d1d1d; color:#c9c9c9; }
    .nav-link { color: #6c757d; }
    .bs-sidenav { background-color:#e9ecef;}

    .hljs{display:block;overflow-x:auto;padding:0.5em;background:#282a36}.hljs-built_in,.hljs-link,.hljs-section,.hljs-selector-tag{color:#8be9fd}.hljs-keyword{color:#ff79c6}.hljs,.hljs-subst{color:#f8f8f2}.hljs-attr,.hljs-meta-keyword,.hljs-title{font-style:italic;color:#50fa7b}.hljs-addition,.hljs-bullet,.hljs-meta,.hljs-name,.hljs-string,.hljs-symbol,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable{color:#f1fa8c}.hljs-comment,.hljs-deletion,.hljs-quote{color:#6272a4}.hljs-doctag,.hljs-keyword,.hljs-literal,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-strong,.hljs-title,.hljs-type{font-weight:bold}.hljs-literal,.hljs-number{color:#bd93f9}.hljs-emphasis{font-style:italic}
    span.hll { background-color:darkblue; display:block; }
    span.hljs-tag { color:gray;}
}
