/** CSS style for website */
/** codepen demo scroll bar */
#output pre, #output iframe::-webkit-scrollbar {
    /** if you want to style your own scroll bar, this pseudo should be written */
    /** Part 1 */
    width: 6px;
    height: 6px;
}

#output pre, #output iframe::-webkit-scrollbar-button {
    /** Part 2 */
    display: none;
}

#output pre, #output iframe::-webkit-scrollbar-track {
    /** Part 3 */
}

#output pre, #output iframe::-webkit-scrollbar-track-piece {
    /** Part 4 */
}

#output pre, #output iframe::-webkit-scrollbar-thumb {
    /** Part 5 */
    background-color: rgba(0, 0, 0, 1);
    border-radius: 10px;
}

#output pre, #output iframe::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 159, 166, 1);
}

#output pre, #output iframe::-webkit-scrollbar-thumb:active {
    background-color: rgba(0, 120, 125, 1);
}

#output pre, #output iframe::-webkit-scrollbar-corner {
    /** Part 6 */
}

#output pre, #output iframe::-webkit-resizer {
    /** Part 7 */
}

/** ace scroll bar */
.ace_scrollbar-h::-webkit-scrollbar,
.ace_scrollbar-v::-webkit-scrollbar{
    /** if you want to style your own scroll bar, this pseudo should be written */
    /** Part 1 */
    width: 6px;
    height: 6px;
}

.ace_scrollbar-h::-webkit-scrollbar-button,
.ace_scrollbar-v::-webkit-scrollbar-button {
    /** Part 2 */
    display: none;
}

.ace_scrollbar-h::-webkit-scrollbar-track,
.ace_scrollbar-v::-webkit-scrollbar-track {
    /** Part 3 */
}

.ace_scrollbar-h::-webkit-scrollbar-track-piece,
.ace_scrollbar-v::-webkit-scrollbar-track-piece {
    /** Part 4 */
}

@media (min-width: 720px) {
    .ace_scrollbar-h::-webkit-scrollbar-thumb,
    .ace_scrollbar-v::-webkit-scrollbar-thumb {
        /** Part 5 */
        background-color: rgba(0, 0, 0, 1);
        border-radius: 10px;
    }

    .ace_scrollbar-h::-webkit-scrollbar-thumb:hover,
    .ace_scrollbar-v::-webkit-scrollbar-thumb:hover {
        background-color: rgba(161, 0, 0, 1);
    }

    .ace_scrollbar-h::-webkit-scrollbar-thumb:active,
    .ace_scrollbar-v::-webkit-scrollbar-thumb:active {
        background-color: rgba(100, 0, 0, 1);
    }
}

@media (max-width: 720px) {
    .ace_scrollbar-h::-webkit-scrollbar-thumb,
    .ace_scrollbar-v::-webkit-scrollbar-thumb {
        /** Part 5 */
        background-color: rgba(0, 0, 0, 0.2);
        border-radius: 10px;
    }

    .ace_scrollbar-h::-webkit-scrollbar-thumb:hover,
    .ace_scrollbar-v::-webkit-scrollbar-thumb:hover {
        background-color: rgba(161, 0, 0, 0.2);
    }

    .ace_scrollbar-h::-webkit-scrollbar-thumb:active,
    .ace_scrollbar-v::-webkit-scrollbar-thumb:active {
        background-color: rgba(100, 0, 0, 0.2);
    }
}

.ace_scrollbar-h::-webkit-scrollbar-corner,
.ace_scrollbar-v::-webkit-scrollbar-corner {
    /** Part 6 */
}

.ace_scrollbar-h::-webkit-resizer,
.ace_scrollbar-v::-webkit-resizer {
    /** Part 7 */
}

.ace_gutter {
    box-shadow: -4px 0 13px 7px rgba(0, 0, 0, 0.2) !important;
}

.ace_scroller.ace_scroll-left {
    box-shadow: none !important;
}

.ace {
    border: 1px solid #EBEBEB !important;
    margin: 2em 0 !important;
}

/** mathjax */
p.comments-section:first-child + span.mjx-chtml {
    width: 100% !important;
    text-align: center !important;
    margin: 44px 0 !important;
}

:root {
    --theme-color: #009fa6;
    --navigator-bg: #000 url(https://raw.githubusercontent.com/aleen42/javascript/master/pic/summary-background.jpg) no-repeat 60%;
}