@font-face
    font-family: 'Gotham'
    src: url('../fonts/Gotham-Font/Gotham-Bold.otf')

*
    margin: 0
    padding: 0

body
    font-family: 'Gotham', sans-serif
    background-image: url('../images/background.png')
    background-size: cover
    background-attachment: fixed
    background-position: center
    background-repeat: no-repeat
    text-transform: uppercase

iframe
    margin: 1.5% 1.5% 1.5% 1.5%

.socials
    font-size: 3vh
    left: 0
    line-height: 4vh
    letter-spacing: 15px
    position: absolute
    text-align: center
    top: 25%
    width: 100%
    text-transform: uppercase

    a
        text-decoration: none
        color: #ffffff

    a:hover
        color: #a865ff81

.links
    display: inline-block

a
    display: flex
    justify-content: space-between

.logo
    width: auto
    height: 10vh

.credits
    position: absolute
    left: 50%
    right: 25%
    bottom: 30px
    margin-left: -50px

.creator
    font-size: 2.5vh
    color: white
    text-align: center
    display: table-caption
    padding: 1vh
    position: absolute
    top: 95%

.creator a
    text-decoration: none
    margin: 0
    padding: 0
    color: #8445fa

.creator a:hover
    color: #8445fa50

.them
    width: auto
    height: 16vh
    margin-left: -20px

.floating
    animation-name: floating
    animation-duration: 3s
    animation-iteration-count: infinite
    animation-timing-function: ease-in-out

@keyframes floating
    from
        transform: translate(0,  0px)
    65%
        transform: translate(0, 10px)
    to
        transform: translate(0, -0px)