@keyframes load {
    0% {
        opacity: 0;
    }  
    100% {
        opacity: 1;
    }
}
* {
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: 1;
}
main {
    max-width: 1200px;
    margin: auto;
}
body {
    font-family: Oswald;
    animation: load 1s;
    max-width: 90vw;
    margin: auto;
}
nav ul {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-grow: 1;
    align-content: center;
    font-size: calc(44px + 2vw);
    padding: 3vw 6vw 0 6vw;
}
nav li a {
    color: black;
    flex-grow: 1;
}
#logo {
    height: calc(64px + 2vw);
}
.ns {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}
::-moz-selection {
    color: white;
    background: black;
}

::selection {
    color: white; 
    background: black;
}
#poster {
    width: 600px;
    display: block;
    margin: 2vw auto;
    border: solid black 1px;
    max-width: 90vw;
}
.bf {
    clear: both;
}
h1 {
    text-transform: uppercase;
    font-size: calc(30px + 7vw);
    margin: 3vw auto;
    text-align: center;
    display: block;
    color: white;
    background: black;
    padding: 1vw;
    width: calc((30px + 7vw)*5);
}
h2 {
    text-transform: uppercase;
    font-size: calc(20px + 2vw);
    margin: 1vw;
    text-align: center;
    letter-spacing: .2vw;
}
p {
    text-transform: uppercase;
    font-size: calc(20px + 1vw);
    margin: 1vw;
    text-align: center;
}
footer p {
    font-size: calc(7px + .5vw);
    margin-bottom: calc(10px + 3.5vw);
}
footer {
}
.APPSTORE {
    margin: 1vw auto;
    display: block;
    width: 80vw;
    max-width: 400px;
}
dd {
    line-height: 2;
}
dt {
    font-size: calc(20px + 1.5vw);
    font-weight: bold;
}
dd {
    font-size: calc(15px + .75vw);
    font-weight: 200;
    text-indent: 1em;
}
.socials {
    display: flex;
    position:absolute;
    width:100vw;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    bottom:0px;
}
.socials div {
    text-transform: uppercase;
    letter-spacing: .5em;
    width: 33.33vw;
    font-weight: 200;
    text-align: center;
    padding: .5vw;
    font-size: 1.7vw;
    display:flex;
    justify-content:center;
    align-items:center;
}
.socials li a {
    text-decoration: none;
    color: white;
}
#twitterblock {
    background: #00aced;
}
#discordblock {
    background: #7289da;
}
#emailblock {
    background: dimgrey;
}
@media screen and (max-width: 1000px) {
    #logo {
        content: url("http://studio-or.tech/logo/icon_no_border.svg");
    }
    .socials div {
        font-size: calc(10px + 1vw);
        height: calc(20px + 1vh);
    }
}