/*Fonts*/

@font-face {
    font-family: "Roboto";

    src: url("../assets/roboto-regular-webfont.eot");
    src: url("../assets/roboto-regular-webfont.eot?iefix") format("eot"),
    url("../assets/roboto-regular-webfont.woff") format("woff"),
    url("../assets/roboto-regular-webfont.ttf") format("truetype");
}

@font-face {
    font-family: "Roboto-bold";

    src: url("../assets/roboto-bold-webfont.eot");
    src: url("../assets/roboto-bold-webfont.eot?iefix") format("eot"),
    url("../assets/roboto-bold-webfont.woff") format("woff"),
    url("../assets/roboto-bold-webfont.ttf") format("truetype");
}

body {
    margin: 0;
    padding: 0;
    font-family: "Roboto", sans-serif;
    font-weight: normal;
    font-size: 16px;
    color: #222222;
    word-break: break-word;
}

body.high-contrast {
    background-color: #000000;
    color: #ffff00;
}

.high-contrast a {
    color: #ffff00;
    text-decoration: underline;
}

.high-contrast h1,
.high-contrast h2,
.high-contrast h3,
.high-contrast h4,
.high-contrast h5,
.high-contrast h6 {
    color: #ffff00;
}

.high-contrast::-webkit-scrollbar {
    width: 12px;
}

.high-contrast::-webkit-scrollbar-track {
    background: #000000;
}

.high-contrast::-webkit-scrollbar-thumb {
    background: #ffff00;
    border-radius: 6px;
    border: 2px solid #000000;
}

.high-contrast {
    scrollbar-color: #ffff00 #000000;
}

p {
    margin: 0 0 16px 0;
}

strong {
    font-family: "Roboto-bold", sans-serif;
}

.general-tnc {
    padding: 40px 20px;
}

/*Links*/

a {
    text-decoration: none;
}

.link--action {
    color: #222222;
}

.high-contrast .link--action {
    color: #ffff00;
}

.link--emphasized {
    text-decoration: underline;
}

/*lists*/

ol {
    counter-reset: level1;
    list-style: none;
    padding-left: 1.5em;
}

li {
    margin-bottom: 8px;
}

li::before {
    width: 5em;
}

ol > li {
    counter-increment: level1;
}

ol > li::before {
    content: counter(level1) ". ";
}

ol ol {
    counter-reset: level2;
    padding-left: 1.5em;
}

ol ol > li {
    counter-increment: level2;
}

ol ol > li::before {
    content: counter(level1) "." counter(level2) " ";
}

ol ol ol {
    counter-reset: level3;
    padding-left: 1.5em;
}

ol ol ol > li {
    counter-increment: level3;
}

ol ol ol > li::before {
    content: counter(level1) "." counter(level2) "." counter(level3) " ";
}

ol ol ol.letters > li::before {
    content: "(" counter(level3, lower-alpha) ") ";
}

/*Break points*/

@media only screen and (max-width: 376px) {
    h4 {
        font-size: 20px;
    }

    h5 {
        font-size: 15px;
    }
    .general-tnc {
        padding: 20px 16px;
    }

    body {
        font-size: 15px;
    }
}