@import url('https://fonts.googleapis.com/css2?family=Orbitron&display=swap');

*
    margin: 0
    padding: 0

body
    font-family: 'Orbitron', sans-serif;
    background-color: black
    background-size: cover
    background-attachment: fixed
    background-position: center
    background-repeat: no-repeat
    text-transform: uppercase
    font-style: italic
    text-shadow: 0.06rem 0 0.06rem #ea36af, -0.125rem 0 0.06rem #75fa69;
    animation-duration: 0.2s;
    animation-name: textflicker;
    animation-iteration-count: infinite;
    animation-direction: alternate;

.name
    color: white
    font-size: 8vh

.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: #ffe66b

.links
    display: inline-block

a
    display: flex
    justify-content: space-between

.logo
    width: auto
    height: 10vh



.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: white

.creator a:hover
    color: #ef486f

@keyframes textflicker
  from
    text-shadow: 1px 0 0 #3642ea, -2px 0 0 #fa6969;
  to
    text-shadow: 2px 0.5px 2px #3642ea, -1px -0.5px 2px #fa6969;