@font-face {
    font-family: ArliradTriangular;
    src: url("/font/ArliradTriangular.otf") format("opentype");
}

* {
    color: #FFFFFF;
}

p,
h1,
h2,
h3,
h4,
small,
a,
li,
table,
input,
label,
button,
iframe,
div {
    color: #EEE;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

a {
    color: #9BF;
    text-shadow: #37A 0px 0px 3px;
}

h1 {
    font-weight: 300;
}

h2,
h3,
h4 {
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #FFF;
}

body {
    margin: 0px 0px;
    background-color: #111111;

    /* https://www.gradientmagic.com/ */
    background: linear-gradient(200deg, rgba(213, 213, 213, 0.01) 0%, rgba(213, 213, 213, 0.01) 14.286%, rgba(140, 140, 140, 0.01) 14.286%, rgba(140, 140, 140, 0.01) 28.572%, rgba(52, 52, 52, 0.01) 28.572%, rgba(52, 52, 52, 0.01) 42.858%, rgba(38, 38, 38, 0.01) 42.858%, rgba(38, 38, 38, 0.01) 57.144%, rgba(159, 159, 159, 0.01) 57.144%, rgba(159, 159, 159, 0.01) 71.42999999999999%, rgba(71, 71, 71, 0.01) 71.43%, rgba(71, 71, 71, 0.01) 85.71600000000001%, rgba(88, 88, 88, 0.01) 85.716%, rgba(88, 88, 88, 0.01) 100.002%), linear-gradient(337deg, rgba(25, 25, 25, 0.01) 0%, rgba(25, 25, 25, 0.01) 12.5%, rgba(150, 150, 150, 0.01) 12.5%, rgba(150, 150, 150, 0.01) 25%, rgba(84, 84, 84, 0.01) 25%, rgba(84, 84, 84, 0.01) 37.5%, rgba(85, 85, 85, 0.01) 37.5%, rgba(85, 85, 85, 0.01) 50%, rgba(188, 188, 188, 0.01) 50%, rgba(188, 188, 188, 0.01) 62.5%, rgba(80, 80, 80, 0.01) 62.5%, rgba(80, 80, 80, 0.01) 75%, rgba(73, 73, 73, 0.01) 75%, rgba(73, 73, 73, 0.01) 87.5%, rgba(219, 219, 219, 0.01) 87.5%, rgba(219, 219, 219, 0.01) 100%), linear-gradient(97deg, rgba(195, 195, 195, 0.03) 0%, rgba(195, 195, 195, 0.03) 16.667%, rgba(177, 177, 177, 0.03) 16.667%, rgba(177, 177, 177, 0.03) 33.334%, rgba(170, 170, 170, 0.03) 33.334%, rgba(170, 170, 170, 0.03) 50.001000000000005%, rgba(158, 158, 158, 0.03) 50.001%, rgba(158, 158, 158, 0.03) 66.668%, rgba(121, 121, 121, 0.03) 66.668%, rgba(121, 121, 121, 0.03) 83.33500000000001%, rgba(146, 146, 146, 0.03) 83.335%, rgba(146, 146, 146, 0.03) 100.002%), linear-gradient(90deg, hsl(98, 0%, 3%), hsl(98, 0%, 3%));
    background-attachment: fixed;
}

main {
    max-width: 1475px;
    margin-top: 32px;
    margin-bottom: 64px;
    margin-left: auto;
    margin-right: auto;
    padding: 32px 24px 24px 24px;
    background-color: #222222;
    border: #333333 1px solid;
}

footer {
    padding-top: 15px;
    padding-bottom: 22px;
}

footer .left {
    max-width: 200px;
    float: left;
}

footer .right {
    margin-left: 200px;
    text-align: right;
    min-height: 48px;
}

hr {
    border-color: #0081e0;
    border-top: none;
}

footer hr {
    border-color: #333333;
}

button,
select,
input[type=button],
input[type=submit],
input[type=text],
input[type=number],
input[type=password] {
    color: #EEE;
    background-color: #111111;
    border: #333333 solid 1px;
}

input[type=text],
input[type=password] {
    margin-bottom: 8px;
}

textarea {
    background-color: #111111;
    border: #333333 solid 1px;
}

.center {
    text-align: center;
}

.column2 {
    float: left;
    width: 50%;
}

.prompt {
    max-width: 384px;
    margin: auto;
    padding: 16px 24px 24px 24px;
    background-color: #171717;
    border: #333333 1px solid;
}

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #222222;
    border-left: solid 1px #333333;
}

::-webkit-scrollbar-thumb {
    background: #555;
}

::-webkit-scrollbar-thumb:hover,
button:hover {
    background: #888;
}

.level1 {
    color: #f9ffc5 !important;
}

.level2 {
    color: #ffd588 !important;
}

.level3 {
    color: #ffa053 !important;
}

.level4 {
    color: #ff5953 !important;
}