/* ==========================================================================
   Seminaire Overrides
   ========================================================================== */

/* ==========================================================================
   Configuration & Layout
   ========================================================================== */

:root {
    --sidebar-width: 0px;
    --text-muted: #606060;
}

body {
    max-width: 40em;
}

/* ==========================================================================
   Typography & Headers
   ========================================================================== */

h2, h3, h4 {
    position: relative;
    float: none;
    width: auto;

    margin-bottom: 0.75em;
    
    text-align: left;
    font-weight: 400; 
    color: var(--text-muted);
}

h2 {
    font-size: 1.1rem;
}

/* 
   Margin Symbol
   Usage: @@html:<span class="margin-mark">⧉</span>@@ Text... 
*/
span.margin-mark {
    position: absolute;
    left: -1.6em; 
    top: 0; 
    
    font-size: 1.4em;
    font-weight: 500;
    line-height: 1;
    color: var(--text-muted);
}

/* ==========================================================================
   Tables
   ========================================================================== */

table {
    margin-top: -0.25em;
    margin-bottom: 1em;
}

th {
    text-align: center;
    font-weight: 400; 
    
    padding-top: 0.5em; 
    padding-bottom: 0.5em;
    border-bottom: 1px solid black;
}

td {
    text-align: center;
    
    padding-top: 0.8em;
    padding-bottom: 0.8em;
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

@media (max-width: 768px) {
    /* Reset Headers */
    h2, h3, h4 {
        margin-left: 0; 
    }
    
    /* Reset Symbol */
    span.margin-mark {
        position: static;
        margin-right: 0.5em;  
    }
}