/* Some inspiration: https://andybrewer.github.io/mvp/mvp.css */
.anki-gen #deck {
    margin-bottom: 2em;
    margin-top: 0;
    color: #6c71c4;
    font-size: 13pt
    }
.anki-gen .card {
    font-family: Menlo, baskerville, sans;
    font-size: 12.5pt;
    text-align: left;
    color: #D7DEE9;
    line-height: 1.6em;
    background-color: #333B45;
    max-width: 800px;
    margin: auto;
    padding-bottom: 3em;
    padding-top: 2em;
    padding-left: 1em;
    padding-right: 1em
    }
.anki-gen img {
    max-width: min(750px, 100%)
    }
.anki-gen img.small {
    max-width: max(400px, 100%);
    display: block;
    margin: auto
    }
.anki-gen .recap img {
    max-width: 100%
    }
.anki-gen img.masked-img {
    filter: blur(8px) opacity(50%)
    }
.anki-gen .cloze {
    /*font-weight: bold;*/
    color: MediumSeaGreen
    }
/* Bold underline, italic and link styles. */
.anki-gen b {
    color: #C695C6 !important
    }
.anki-gen u {
    text-decoration: none;
    color: #5EB3B3
    }
.anki-gen a {
    color: LightGray;
    font-style: normal
    }
/* For mobile. */
.anki-gen .mobile .card {
    color: #D7DEE9;
    background-color: #333B45
    }
.anki-gen .mobile .tags:hover {
    opacity: 1;
    position: relative
    }
.anki-gen h1, .anki-gen h2, .anki-gen h3, .anki-gen h4, .anki-gen h5 {
    text-align: center;
    margin-bottom: 1em;
    margin-top: 2.5em
    }
.anki-gen h1 {
    font-size: 18pt;
    font-weight: normal;
    font-family: san-serif;
    margin-top: 0;
    /* To cancel the above rule. */
    }
.anki-gen h2 {
    font-size: 16pt;
    font-weight: normal
    }
.anki-gen h3 {
    font-size: 15pt;
    font-weight: normal
    }
.anki-gen h4 {
    font-size: 13.5pt;
    font-weight: bold;
    margin-bottom: 0.5em
    }
.anki-gen span .book-title {
    font-style: italic
    }
.anki-gen p span.inline-heading {
    text-decoration: underline
    }
.anki-gen div#example {
    margin-top: 4em
    }
.anki-gen div#back_only {
    margin-top: 2em
    }
/* For text that reveals to much on the front side, 
but isn't really meant to be guessed as a cloze. */
.anki-gen #front .back-only {
    filter: blur(3px) opacity(25%);
    /* Alternatively: */
    /* visibility: hidden; */
    }
.anki-gen hr#source {
    margin-top: 6em
    }
.anki-gen .update_note {
    color: #8DB2D7;
    font-style: oblique
    }
.anki-gen .em2 {
    color: #75EFEF
    }
.anki-gen em.def {
    /* The first one is quite bright and a possibly a little distracting. Testing out the second one now. */
    color: #ff7;
    color: #F2F2AA
    }
.anki-gen .def .cloze {
    color: #ff7;
    text-decoration: underline;
    text-decoration-color: MediumSeaGreen
    }
/* For questions on the front that should be highlighted in
the same sort of way that cloze deletions are (to show the 
reader that this question should be addressed before flipping). */
.anki-gen .prompt {
    text-decoration: underline;
    /* I feel that the MediumSeaGreen is too saturated/vibrant? 
         as an undeline color. Choose a green between it and white. */
    text-decoration-color: #94d5b1;
    /*text-decoration-color: MediumSeaGreen;*/
    }
.anki-gen div.theorem, .anki-gen div.definition, .anki-gen div.lemma, .anki-gen div.proposition, .anki-gen div.corollary {
    background: #4C3D45;
    /*background: #444C56;*/
    padding: 0.5em 1em 0.5em 1em;
    max-width: 620px;
    color: #E7EEF9;
    /* margin: auto; */
    margin: 2em 3em 2em 3em
    }
.anki-gen .nightMode div.theorem, .anki-gen .nightMode div.definition, .anki-gen .nightMode div.lemma, .anki-gen .nightMode div.proposition, .anki-gen .nightMode div.corollary {
    /*d: #5C3837; //progressively lighter-> #5E3636;//#6B3E3D;//#704140;*/
    background: #523333
    }
.anki-gen div.minor_lemma, .anki-gen div.minor_definition, .anki-gen div.minor_theorem, .anki-gen div.minor_corollary {
    font-size: 95%;
    border: 1px solid #999;
    padding: 0 2em 1em 2em;
    margin: 2.5em 3em 2em 3em
    }
/* em_recap seems like a bad name. Switching to just recap. */
.anki-gen div.em_recap, .anki-gen div.recap, .anki-gen div.remark {
    font-size: 85%;
    border: 1px solid #999;
    padding: 0 2em 1em 2em;
    margin: 2.5em 3em 2em 3em
    }
.anki-gen div.remark {
    padding-top: 0.5em;
    /* was previously 1.0em. Not sure why. */
    color: #CCC
    }
.anki-gen div.recap h4, .anki-gen div.remark h4 {
    margin-top: 0.8em
    }
.anki-gen .boxed {
    border: 1px solid #999;
    padding: 0 2em 1em 2em;
    margin: 2em 3em
    }
.anki-gen .larger_eq {
    font-size: 110%
    }
.anki-gen .em_recap h4, .anki-gen .recap h4, .anki-gen .minor_lemma h4, .anki-gen .minor_definition h4 {
    margin-top: 1em
    }
.anki-gen .proposition h3, .anki-gen .proposition h4, .anki-gen .lemma h3, .anki-gen .lemma h4, .anki-gen .definition h3, .anki-gen .definition h4, .anki-gen .theorem h3, .anki-gen .theorem h4, .anki-gen .corollary h3, .anki-gen .corollary h4 {
    margin-top: 0.5em
    }
/* Remarks within a paragraph. */
.anki-gen p.remark, .anki-gen span.remark {
    color: #CCC;
    font-size: 85%
    }
/* Update: 'block_eq' isn't needed anymore. Custom JS handles it instead */
/* This is sometimes used when we want a block latex AND to use cloze hints.
Using both causes the front side to wrap the hint version in square brackets *before* the
newlines are added for the block quality of \[ \] latex blocks.*/
.anki-gen div.block_eq {
    display: block;
    text-align: center
    }
.anki-gen div.context div.arrow-list em {
    font-weight: bold
    }
.anki-gen ol.lower_alpha > li {
    list-style-type: lower-alpha
    }
.anki-gen dl.horizontal {
    display: grid;
    grid-template-columns: fit-content fit-content;
    grid-row-gap: 0.8em
    }
.anki-gen dl.horizontal dt {
    grid-column-start: 1
    }
.anki-gen dl.horizontal dd {
    grid-column-start: 2
    }