@charset 'UTF-8';
@font-face {
    font-family: 'Istok Web';
    font-style: normal;
    font-weight: 700;
    src:
        url('fonts/istok-bold-webfont.woff2') format('woff2'),
        url('fonts/istok-bold-webfont.woff') format('woff');
    unicode-range: U+0020-007F, U+00A9; /* Basic Latin, Copyright Symbol */
}
@font-face {
    font-family: 'Istok Web';
    font-style: normal;
    font-weight: 400;
    src:
        url('fonts/istok-regular-webfont.woff2') format('woff2'),
        url('fonts/istok-regular-webfont.woff') format('woff');
    unicode-range: U+0020-007F, U+00A9; /* Basic Latin, Copyright Symbol */
}
@keyframes fade-1 {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes fade-2 {
    0% { opacity: 0; }
    25% { opacity: 0; }
    75% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes fade-3 {
    0% { opacity: 0; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes fade-4 {
    0% { opacity: 0; }
    50% { opacity: 0; }
    75% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes fade-5 {
    0% { opacity: 0; }
    62.5% { opacity: 0; }
    87.5% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes fade-6 {
    0% { opacity: 0; }
    75% { opacity: 0; }
    100% { opacity: 1; }
}
*,
*::before,
*::after {
    box-sizing: border-box;
}
a,
body,
div,
h1,
h2,
h3,
html,
li,
p,
span,
sup,
ul {
    border: 0;
    font: inherit;
    font-size: 100%;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
a,
a:link,
a:visited {
    -webkit-tap-highlight-color: rgba(232, 162, 93, 0.5);
    color: #d8b28d;
    font-size: 1rem;
    font-weight: 700;
    padding: 0 0.3333rem;
    tap-highlight-color: rgba(232, 162, 93, 0.5);
    text-decoration: none;
    transition: color 0.125s;
}
a:active {
    color: #e8a25d;
}
body {
    background-color: #332e2a;
    color: #efe0d1;
    font-family: 'Istok Web', Helvetica, Arial, sans-serif;
    line-height: 1.6667;
    text-align: center;
}
h1 {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}
h2 {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}
html {
    font-size: 20px;
    font-weight: 400;
}
li {
    display: inline-block;
    line-height: 1.125;
    margin: 0.5rem;
}
section > * {
    margin: 0.75rem auto;
}
span {
    font-size: 0.9rem;
    padding: 0 0.3333rem;
}
sup {
    font-size: 50%;
    vertical-align: super;
}
ul {
    font-size: 0;
    list-style: none;
}
ul ~ ul {
    margin-bottom: -0.3333rem;
    margin-top: -0.5rem;
}
.bg {
    background-image: url('images/icon-pattern.svg');
    background-position: 0 0;
    background-size: 64px 64px;
    bottom: 0;
    filter: blur(2px);
    left: 0;
    opacity: 0.1;
    position: fixed;
    right: 0;
    top: 0;
    z-index: -9999;
}
.bg::before {
    background-image: radial-gradient(rgba(51, 46, 42, 1), rgba(51, 46, 42, 0));
    bottom: 0;
    content: '';
    left: 25%;
    position: absolute;
    right: 25%;
    top: 0;
}
.content {
    display: inline-block;
    font-size: 1rem;
    padding: 0 2rem;
    vertical-align: middle;
    width: 100%;
}
.content > * {
    margin: 1.5rem auto;
}
.content-parent {
    bottom: 0;
    font-size: 0;
    left: 0;
    min-width: 320px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
}
.content-parent::before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.fade-1 {
    animation: 2s fade-1;
}
.fade-2 {
    animation: 2s fade-2;
}
.fade-3 {
    animation: 2s fade-3;
}
.fade-4 {
    animation: 2s fade-4;
}
.fade-5 {
    animation: 2s fade-5;
}
.fade-6 {
    animation: 2s fade-6;
}
.splash > svg {
    margin-top: 0.5rem;
}
.svg-anchor {
    display: inline-block;
}
.svg-anchor path {
    transition: fill 0.125s;
}
.svg-anchor:active path {
    fill: #e8a25d;
}
@media (hover: hover) { /* Focus/hover states for desktop only. */
    a:focus,
    a:hover {
        color: #e8a25d;
    }
    .svg-anchor:hover path {
        fill: #e8a25d;
    }
}