@font-face {
    font-family: 'Moon';
    src: url('../fonts/Moon-Bold.eot');
    src: url('../fonts/Moon-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Moon-Bold.woff2') format('woff2'),
        url('../fonts/Moon-Bold.woff') format('woff'),
        url('../fonts/Moon-Bold.ttf') format('truetype'),
        url('../fonts/Moon-Bold.svg#Moon-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-Bold.eot');
    src: url('../fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gotham-Bold.woff2') format('woff2'),
        url('../fonts/Gotham-Bold.woff') format('woff'),
        url('../fonts/Gotham-Bold.svg#Gotham-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

html{
    font-family: 'Gotham';
}

html title{
    font-family: 'Gotham';
}

body{
    margin: 0;
    padding: 0;
    background:#0C0C09;
}

title {
    font-family: 'Gotham';
}


.navigation-mobile-menu{
    width: 100%;
    height:100vh;
    margin:0 auto;
    margin-top: -2%;
    background:white;
    position: fixed;
}

#copyright{
    position: absolute; top: 93%; left: 50%;
    transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */
    color: #0C0C09;
    text-decoration: none;
    font-family: 'Courier New', Courier, monospace;
    font-size: .9em;
    font-weight: 400;
}

#navigation-menu-bar{
    position: absolute; top: 47%; left: 50%;
    transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */
    text-align: center;
}

#nav{
    margin: 2em;
}

#nav a{
    font-size: 1em;
    color: #0C0C09;
    text-decoration: none;
    font-family: 'Gotham';
}

#list-nav{
    list-style: none;
}

#floated{
    position: absolute; top: 88%; left: 50%;
    transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); 
    -webkit-transform: translate(-50%, -50%); 
}

#floated li{
    list-style-type: none;
}

#floated li{
    text-decoration: none;
}

#floated i{
    color:#0C0C09;
    margin: .5em;
    text-decoration: none;
    list-style-type: none;
}

@media screen and (max-width: 1150px) {

    .navigation-mobile-menu{
        width: 100%;
        height:100vh;
        margin:0 auto;
        margin-top: -0%;
        background:white;
        bottom: 0px;
    }

}

@media screen and (max-width: 600px) {

    .navigation-mobile-menu{
        width: 100%;
        height:100vh;
        margin:0 auto;
        margin-top: -2%;
        background:white;
        bottom: 0px;
    }

}