html, body {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
}

.page {
    background-color: #1a1a1a !important;
    color: #e0e0e0 !important;
}

h1, h2, h3, .page-title {
    color: #ffffff !important;
}

a, a.visited {
    color: #66b3ff !important;
}

blockquote {
    border-left-color: #555555 !important;
    background-color: #2a2a2a !important;
    color: #cccccc !important;
}

table, th, td {
    border-color: #444444 !important;
    background-color: #1a1a1a !important;
}

th {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

.code, code {
    background-color: #2a2a2a !important;
    color: #ff6b6b !important;
}

.code {
    background-color: #1e1e1e !important;
    border: 1px solid #444444 !important;
}

hr {
    border-bottom-color: #444444 !important;
}

mark {
    background-color: #4a4a4a !important;
    color: #ffffff !important;
}

.highlight-pink_background {
    background-color: #4a2a3a !important;
    color: #ffccdd !important;
}

.highlight-purple_background {
    background-color: #3a2a4a !important;
    color: #ddccff !important;
}

.highlight-default_background {
    background-color: #3a3a3a !important;
    color: #ffffff !important;
}

.callout {
    background-color: #2a2a2a !important;
    border: 1px solid #444444 !important;
}

img {
    border: 1px solid #444444;
    border-radius: 4px;
}

.selected-value {
    background-color: #3a3a3a !important;
    color: #e0e0e0 !important;
}

.simple-table-header-color {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

.block-color-gray_background {
    background-color: #2a2a2a !important;
}

.block-color-brown_background {
    background-color: #3a2a2a !important;
}

.block-color-orange_background {
    background-color: #3a2a1a !important;
}

.block-color-yellow_background {
    background-color: #3a3a1a !important;
}

.block-color-teal_background {
    background-color: #1a3a2a !important;
}

.block-color-blue_background {
    background-color: #1a2a3a !important;
}

.block-color-purple_background {
    background-color: #2a1a3a !important;
}

.block-color-pink_background {
    background-color: #3a1a2a !important;
}

.block-color-red_background {
    background-color: #3a1a1a !important;
}

details {
    border: 1px solid #444444;
    border-radius: 4px;
    padding: 8px;
    background-color: #2a2a2a;
    overflow: hidden;
}

summary {
    color: #66b3ff;
    cursor: pointer;
    font-weight: bold;
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
    box-sizing: border-box;
}

details p, details figure, details a {
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
    box-sizing: border-box;
}

details a {
    display: inline-block;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.pdf-relative-link-path {
    color: #888888 !important;
}

time {
    color: #888888 !important;
}

figcaption {
    color: #888888 !important;
}

.source {
    border: 1px solid #444444 !important;
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

.text-icon {
    border: 1px solid #666666 !important;
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

.bookmark-description {
    color: #888888 !important;
}

.checkbox-off {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Crect%20x%3D%220.75%22%20y%3D%220.75%22%20width%3D%2214.5%22%20height%3D%2214.5%22%20fill%3D%22%23e0e0e0%22%20stroke%3D%22%23666666%22%20stroke-width%3D%221.5%22%2F%3E%0A%3C%2Fsvg%3E") !important;
}

@media only screen and (max-width: 768px) {
    body {
        margin: 0 !important;
        max-width: none !important;
        width: 100% !important;
        padding: 1em !important;
    }
    
    .page-body {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    article.page {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    a {
        word-wrap: break-word !important;
        word-break: break-all !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
        white-space: normal !important;
        display: inline-block !important;
    }
    
    p a, li a {
        max-width: calc(100vw - 2em) !important;
        box-sizing: border-box !important;
    }
    
    .page-title {
        font-size: 2rem !important;
        line-height: 1.3 !important;
    }
    
    h1 {
        font-size: 1.5rem !important;
    }
    
    h2 {
        font-size: 1.25rem !important;
    }
    
    h3 {
        font-size: 1.125rem !important;
    }
    
    .column-list {
        flex-direction: column !important;
    }
    
    .column {
        width: 100% !important;
        padding: 0 !important;
        margin-bottom: 1em !important;
    }
    
    details {
        padding: 6px !important;
    }
    
    details a {
        font-size: 14px !important;
        word-break: break-all !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
    
    summary {
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding-right: 0.5em !important;
    }
    
    figure img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
    }
    
    .toggle > li > details {
        padding-left: 1em !important;
    }
    
    .toggle > li > details > summary {
        margin-left: -0.5em !important;
    }
}

@media only screen and (max-width: 480px) {
    body {
        margin: 0.5em !important;
        padding: 0 0.25em !important;
    }
    
    .page-title {
        font-size: 1.75rem !important;
    }
    
    details {
        padding: 4px !important;
    }
    
    summary {
        font-size: 15px !important;
    }
    
    details a {
        font-size: 13px !important;
    }
}
