:root{
    --background-color: #0F1212;
    --background-secondary-color: #2C313C;
    --text-color: #d0d0d0;
    --text-comment-color: #63686F;
    --text-tag-reserved-color: #CF5DD8;
    --text-tag-variables-color: #EF596F;
    --text-tag-property-color: #E5C07B;
    --text-tag-function-color: #61AFEF;
    --text-tag-text-color: #82C072;
    --link-color: #4c92dd;
    --container-width: 720px;
}

::selection{
    background: var(--background-secondary-color);
}

*{
    font-size: 20px;
    font-weight: bold;
}

html{
    font-family: "Fira Code", Consolas, "Courier New", monospace;
    line-height: 1.55;
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
}

body{
    background-color: var(--background-color);
    color: var(--text-color);
    cursor:text;
    margin: 0;
    padding: 0;
}

h1{
    white-space: pre;
    color: var(--text-comment-color);
}

h1>b{
    color: var(--text-color);
}

a{
    color: var(--link-color);
    text-decoration: none;
    cursor: pointer;
}

a:hover{
    filter: brightness(1.3);
    text-decoration: wavy underline red;
}

tagReserved{
    color: var(--text-tag-reserved-color);
    font-style: italic;
}

tagProperty{
    color: var(--text-tag-property-color);
}

tagVariables{
    color: var(--text-tag-variables-color);
}

tagFunction{
    color: var(--text-tag-function-color);
}

tagText{
    color: var(--text-tag-text-color);
}

ul {
    list-style-type: none;
    display: inline;
}

li {
    display: inline;
}

li>a{
    color: var(--text-color);
}

.container{
    max-width: var(--container-width);
    margin: 0 auto;
}