#key {
    position: fixed;
    top: 0;
    right: 0;
}

#box2 {
    background: #ffffff00;
    font-size: 13px;
    padding: 0 5px
}

#box2 .function {
    background: url(/assets/images/function-icons.png);
    width: 32px;
    height: 37px;
    position: relative
}

#box2 .function.save {
    background-position: -5px top
}

#box2 .function.enabled.save {
    background-position: -5px center
}

#box2 .function.enabled.save:hover {
    background-position: -5px bottom
}

#box2 .function.new {
    background-position: -42px top
}

#box2 .function.enabled.new {
    background-position: -42px center
}

#box2 .function.enabled.new:hover {
    background-position: -42px bottom
}

#box2 .function.duplicate {
    background-position: -79px top
}

#box2 .function.enabled.duplicate {
    background-position: -79px center
}

#box2 .function.enabled.duplicate:hover {
    background-position: -79px bottom
}

#box2 .function.raw {
    background-position: -116px top
}

#box2 .function.enabled.raw {
    background-position: -116px center
}

#box2 .function.enabled.raw:hover {
    background-position: -116px bottom
}

#box2 .button-picture {
    border-width: 0;
    font-size: inherit
}

#box2 .button-picture:focus-visible {
    outline: 2px solid #bd93f9;
    outline-offset: -2px;
}

.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 130px;
    height: auto;
    color: #ffffff;
    background: #44475a;
    text-align: center;
    padding: 5px 0;
    /* Position the tooltip */
    position: fixed;
    z-index: 1;
    top: 32px;
    right: 0;
}

.tooltip:hover .tooltiptext,
.tooltip:focus-visible .tooltiptext {
    visibility: visible;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.select {
    -webkit-touch-callout: default; /* iOS Safari */
    -webkit-user-select: text; /* Safari */
    -khtml-user-select: text; /* Konqueror HTML */
    -moz-user-select: text; /* Old versions of Firefox */
    -ms-user-select: text; /* Internet Explorer/Edge */
    user-select: text;
}

.hljs-ln-numbers {
    height: 100%;
    color: #686b78;
    border-right: 1px solid #686b78;
    vertical-align: top;
    padding-right: 5px;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.hljs-ln-code {
    padding-left: 10px !important;
}

td.hljs-ln-code {
    white-space: pre;
    color: white;
}

/* Firefox */
* {
    scrollbar-width: auto;
    scrollbar-color: #686b78 #4f4f4f;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
    width: 15px;
    height: 15px;
}

*::-webkit-scrollbar-track {
    background: #4f4f4f;
}

*::-webkit-scrollbar-thumb {
    background-color: #686b78;
    border-radius: 10px;
    border: 3px solid #707070;
}