html {
    overflow-y: scroll;
}

body {
    line-height: 1.4;
    font-size: 1.1em;
    padding: 0 10px;
    margin-top: 50px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    max-width: 700px; 
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}


#body_main {
    max-width: 42em;
}


iframe {
    max-width: 580;
    height: 327;
    width: 100%;
}


a {
    word-wrap: break-word; /* older browsers */
    overflow-wrap: break-word; /* modern browsers */
}

a:link,
a:visited {
    color: #0000bb;
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: underline;
}

ul {
    margin-top: 0;
}

li {
    margin-top: 13px;
}

h2 {
    margin-bottom: 0px;
    line-height: normal;
}

h3 {
    margin-top: 30px;
}


.sitovin_subtitle {
    margin-bottom: 15px;
    line-height: normal;
}


.applications_eg {
    color: #6b6b6b;
}

footer {
    margin-top: 90px;
    margin-bottom: 20px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}


#sitovin_scherma_3x1_jpeg {
    max-width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
}


.sitovin_example {
    background: #f1f1f1;
    padding: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.sitovin_code {
    font-size: 0.9em;
    background: #f1f1f1;
    padding-left: 4px;
    padding-right: 4px;
}


/* MONO SPACING */
.mono, .sitovin_example, .sitovin_code {
    font-family:

        /* system UI monospace where supported */
        ui-monospace,
                
        /* macOS / iOS (varies by version) */
        SFMono-Regular, Menlo, Monaco,

        /* Windows */
        Consolas, "Lucida Console",

        /* Android (varies by device) */
        "Roboto Mono", "Droid Sans Mono",

        /* Linux */
        "Liberation Mono", "DejaVu Sans Mono", "Nimbus Mono L", "FreeMono", 

        /* old/legacy */
        "Courier New", Courier, 
        
        /* last-resort generic */
        monospace;
}




/* DARK COLOR SCHEME */
@media (prefers-color-scheme: dark) {

    body {
        background: #000;
        color: #EAEAEA;
    }

    a:link,
    a:visited {
        color: #66aaff;
    }

    .applications_eg {
        color: #909090;
    }

    .sitovin_example {
        background: #393939;
    }
    
    .sitovin_code {
        background: #393939;
    }


}
