@import "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,900|Montserrat:100";@import "fontawesome-all.min.css";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;

    font: inherit;
    vertical-align: baseline
}
@font-face {
    font-family: 'Ubuntu'; /*a name to be used later*/
    src: url('https://neptunium.ddns.net/assets/font/ubuntu.ttf'); /*URL to font*/
}
@font-face {
    font-family: 'Minecraft'; /*a name to be used later*/
    src: url('https://neptunium.ddns.net/assets/font/enchantment.ttf'); /*URL to font*/
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block
}

body {
    line-height: 1
}

ol,ul {
    list-style: none
}

blockquote,q {
    quotes: none
}

blockquote:before,blockquote:after,q:before,q:after {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

body {
    -webkit-text-size-adjust: none
}

mark {
    background-color: transparent;
    color: inherit
}

input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input,select,textarea {
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none
}

html {
    box-sizing: border-box
}

*,*:before,*:after {
    box-sizing: inherit
}

body {
    background: #fff;
    overflow: hidden
}

body.is-preload *,body.is-preload *:before,body.is-preload *:after {
    -moz-animation: none!important;
    -webkit-animation: none!important;
    -ms-animation: none!important;
    animation: none!important;
    -moz-transition: none!important;
    -webkit-transition: none!important;
    -ms-transition: none!important;
    transition: none!important
}

body,input,select,textarea {
    color: #fff;
    font-family: ubuntu,sans-serif;
    font-size: 15pt;
    font-weight: 300!important;
    letter-spacing: -.025em;
    line-height: 1.75em
}

a {
    -moz-transition: border-color .2s ease-in-out;
    -webkit-transition: border-color .2s ease-in-out;
    -ms-transition: border-color .2s ease-in-out;
    transition: border-color .2s ease-in-out;
    border-bottom: dotted 1px;
    color: inherit;
    outline: 0;
    text-decoration: none;
}

a:hover {
    border-color: transparent
}

.icon {
    text-decoration: none;
    position: relative
}

.icon:before {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    text-transform: none!important;
    font-family: 'font awesome 5 free';
    font-weight: 400
}

.icon>.label {
    display: none
}

.icon.solid:before {
    font-weight: 900
}

.icon.brands:before {
    font-family: 'font awesome 5 brands'
}

@-moz-keyframes wrapper {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes wrapper {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-ms-keyframes wrapper {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes wrapper {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

#wrapper {
    -moz-animation: wrapper 3s forwards;
    -webkit-animation: wrapper 3s forwards;
    -ms-animation: wrapper 3s forwards;
    animation: wrapper 3s forwards;
    height: 100%;
    left: 0;
    opacity: 0;
    position: fixed;
    top: 0;
    width: 100%
}

#bg {
    -moz-animation: bg 60s linear infinite;
    -webkit-animation: bg 60s linear infinite;
    -ms-animation: bg 60s linear infinite;
    animation: bg 60s linear infinite;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    background: #348cb2 url(images/bg.jpg) bottom left;
    background-repeat: repeat-x;
    height: 100%;
    left: 0;
    opacity: 1;
    position: fixed;
    top: 0
}

@-moz-keyframes bg {
    0% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        -moz-transform: translate3d(-2250px,0,0);
        -webkit-transform: translate3d(-2250px,0,0);
        -ms-transform: translate3d(-2250px,0,0);
        transform: translate3d(-2250px,0,0)
    }
}

@-webkit-keyframes bg {
    0% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        -moz-transform: translate3d(-2250px,0,0);
        -webkit-transform: translate3d(-2250px,0,0);
        -ms-transform: translate3d(-2250px,0,0);
        transform: translate3d(-2250px,0,0)
    }
}

@-ms-keyframes bg {
    0% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        -moz-transform: translate3d(-2250px,0,0);
        -webkit-transform: translate3d(-2250px,0,0);
        -ms-transform: translate3d(-2250px,0,0);
        transform: translate3d(-2250px,0,0)
    }
}

@keyframes bg {
    0% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }

    100% {
        -moz-transform: translate3d(-2250px,0,0);
        -webkit-transform: translate3d(-2250px,0,0);
        -ms-transform: translate3d(-2250px,0,0);
        transform: translate3d(-2250px,0,0)
    }
}

#bg {
    background-size: 2250px auto;
    width: 6750px
}

@-moz-keyframes overlay {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes overlay {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-ms-keyframes overlay {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes overlay {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

#overlay {
    -moz-animation: overlay 1.5s 1.5s forwards;
    -webkit-animation: overlay 1.5s 1.5s forwards;
    -ms-animation: overlay 1.5s 1.5s forwards;
    animation: overlay 1.5s 1.5s forwards;
    background-attachment: fixed,fixed;
    background-image: url(images/overlay-pattern.png),url(images/overlay.svg);
    background-position: top left,center center;
    background-repeat: repeat,no-repeat;
    background-size: auto,cover;
    height: 100%;
    left: 0;
    opacity: 0;
    position: fixed;
    top: 0;
    width: 100%;
}

#main {
    height: 100%;
    left: 0;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    backdrop-filter: blur(.75px);
}

#main:before {
    content: '';
    display: inline-block;
    height: 100%;
    margin-right: 0;
    vertical-align: middle;
    width: 1px;
}

@-moz-keyframes header {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@-webkit-keyframes header {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@-ms-keyframes header {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@keyframes header {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@-moz-keyframes nav-icons {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@-webkit-keyframes nav-icons {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@-ms-keyframes nav-icons {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

@keyframes nav-icons {
    0% {
        -moz-transform: translate3d(0,1em,0);
        -webkit-transform: translate3d(0,1em,0);
        -ms-transform: translate3d(0,1em,0);
        transform: translate3d(0,1em,0);
        opacity: 0
    }

    100% {
        -moz-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        opacity: 1
    }
}

#header {
    -moz-animation: header 1s 2.25s forwards;
    -webkit-animation: header 1s 2.25s forwards;
    -ms-animation: header 1s 2.25s forwards;
    animation: header 1s 2.25s forwards;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    cursor: default;
    display: inline-block;
    opacity: 0;
    position: relative;
    text-align: center;
    top: -1em;
    vertical-align: middle;
    width: 90%
}

#header h1 {
    font-family: montserrat,sans-serif;
    font-size: 4.35em;
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1em
}

#header p {
    font-size: 1.25em;
    margin: .75em 0 .25em;
    opacity: .75
}

#header nav {
    margin: 1.5em 0 0
}

#header nav li {
    -moz-animation: nav-icons .5s ease-in-out forwards;
    -webkit-animation: nav-icons .5s ease-in-out forwards;
    -ms-animation: nav-icons .5s ease-in-out forwards;
    animation: nav-icons .5s ease-in-out forwards;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    display: inline-block;
    height: 5.35em;
    line-height: 5.885em;
    opacity: 0;
    position: relative;
    top: 0;
    width: 5.35em
}

#header nav li:nth-child(1) {
    -moz-animation-delay: 2.5s;
    -webkit-animation-delay: 2.5s;
    -ms-animation-delay: 2.5s;
    animation-delay: 2.5s
}

#header nav li:nth-child(2) {
    -moz-animation-delay: 2.75s;
    -webkit-animation-delay: 2.75s;
    -ms-animation-delay: 2.75s;
    animation-delay: 2.75s
}

#header nav li:nth-child(3) {
    -moz-animation-delay: 3s;
    -webkit-animation-delay: 3s;
    -ms-animation-delay: 3s;
    animation-delay: 3s
}

#header nav li:nth-child(4) {
    -moz-animation-delay: 3.25s;
    -webkit-animation-delay: 3.25s;
    -ms-animation-delay: 3.25s;
    animation-delay: 3.25s
}

#header nav li:nth-child(5) {
    -moz-animation-delay: 3.5s;
    -webkit-animation-delay: 3.5s;
    -ms-animation-delay: 3.5s;
    animation-delay: 3.5s
}

#header nav li:nth-child(6) {
    -moz-animation-delay: 3.75s;
    -webkit-animation-delay: 3.75s;
    -ms-animation-delay: 3.75s;
    animation-delay: 3.75s
}

#header nav li:nth-child(7) {
    -moz-animation-delay: 4s;
    -webkit-animation-delay: 4s;
    -ms-animation-delay: 4s;
    animation-delay: 4s
}

#header nav li:nth-child(8) {
    -moz-animation-delay: 4.25s;
    -webkit-animation-delay: 4.25s;
    -ms-animation-delay: 4.25s;
    animation-delay: 4.25s
}

#header nav li:nth-child(9) {
    -moz-animation-delay: 4.5s;
    -webkit-animation-delay: 4.5s;
    -ms-animation-delay: 4.5s;
    animation-delay: 4.5s
}

#header nav li:nth-child(10) {
    -moz-animation-delay: 4.75s;
    -webkit-animation-delay: 4.75s;
    -ms-animation-delay: 4.75s;
    animation-delay: 4.75s
}

#header nav a {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    border: 0;
    display: inline-block
}

#header nav a:before {
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    border-radius: 100%;
    border: solid 1px #fff;
    display: block;
    font-size: 1.75em;
    height: 2.5em;
    line-height: 2.5em;
    position: relative;
    text-align: center;
    top: 0;
    width: 2.5em
}

#header nav a:hover {
    font-size: 1.1em
}

#header nav a:hover:before {
    background-color: rgba(255,255,255,.175);
    color: #fff
}

#header nav a:active {
    font-size: .95em;
    background: 0 0
}

#header nav a:active:before {
    background-color: rgba(255,255,255,.35);
    color: #fff
}

#header nav a span {
    display: none
}

#footer {
    background-image: -moz-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.5) 75%);
    background-image: -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.5) 75%);
    background-image: -ms-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.5) 75%);
    background-image: linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.5) 75%);
    bottom: 0;
    cursor: default;
    height: 5em;
    left: -5;
    line-height: 8em;
    position: absolute;
    text-align: right;
    font-size: 5pt;
    color: #FF25FF;
    width: 100%
}

@media screen and (max-width: 1680px) {
    body,input,select,textarea {
        font-size:13pt
    }

    @-moz-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-1500px,0,0);
            -webkit-transform: translate3d(-1500px,0,0);
            -ms-transform: translate3d(-1500px,0,0);
            transform: translate3d(-1500px,0,0)
        }
    }

    @-webkit-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-1500px,0,0);
            -webkit-transform: translate3d(-1500px,0,0);
            -ms-transform: translate3d(-1500px,0,0);
            transform: translate3d(-1500px,0,0)
        }
    }

    @-ms-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-1500px,0,0);
            -webkit-transform: translate3d(-1500px,0,0);
            -ms-transform: translate3d(-1500px,0,0);
            transform: translate3d(-1500px,0,0)
        }
    }

    @keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-1500px,0,0);
            -webkit-transform: translate3d(-1500px,0,0);
            -ms-transform: translate3d(-1500px,0,0);
            transform: translate3d(-1500px,0,0)
        }
    }

    #bg {
        background-size: 1500px auto;
        width: 4500px
    }
}

@media screen and (max-width: 1280px) {
    body,input,select,textarea {
        font-size:12pt
    }

    @-moz-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-750px,0,0);
            -webkit-transform: translate3d(-750px,0,0);
            -ms-transform: translate3d(-750px,0,0);
            transform: translate3d(-750px,0,0)
        }
    }

    @-webkit-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-750px,0,0);
            -webkit-transform: translate3d(-750px,0,0);
            -ms-transform: translate3d(-750px,0,0);
            transform: translate3d(-750px,0,0)
        }
    }

    @-ms-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-750px,0,0);
            -webkit-transform: translate3d(-750px,0,0);
            -ms-transform: translate3d(-750px,0,0);
            transform: translate3d(-750px,0,0)
        }
    }

    @keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-750px,0,0);
            -webkit-transform: translate3d(-750px,0,0);
            -ms-transform: translate3d(-750px,0,0);
            transform: translate3d(-750px,0,0)
        }
    }

    #bg {
        background-size: 750px auto;
        width: 2250px
    }
}

@media screen and (max-width: 736px) {
    body {
        min-width:320px
    }

    body,input,select,textarea {
        font-size: 11pt
    }

    @-moz-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-300px,0,0);
            -webkit-transform: translate3d(-300px,0,0);
            -ms-transform: translate3d(-300px,0,0);
            transform: translate3d(-300px,0,0)
        }
    }

    @-webkit-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-300px,0,0);
            -webkit-transform: translate3d(-300px,0,0);
            -ms-transform: translate3d(-300px,0,0);
            transform: translate3d(-300px,0,0)
        }
    }

    @-ms-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-300px,0,0);
            -webkit-transform: translate3d(-300px,0,0);
            -ms-transform: translate3d(-300px,0,0);
            transform: translate3d(-300px,0,0)
        }
    }

    @keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-300px,0,0);
            -webkit-transform: translate3d(-300px,0,0);
            -ms-transform: translate3d(-300px,0,0);
            transform: translate3d(-300px,0,0)
        }
    }

    #bg {
        background-size: 300px auto;
        width: 900px
    }

    #header h1 {
        font-size: 2.5em
    }

    #header p {
        font-size: 1em
    }

    #header nav {
        font-size: 1em
    }

    #header nav a:hover {
        font-size: 1em
    }

    #header nav a:active {
        font-size: 1em
    }
}

@media screen and (max-width: 480px) {
    @-moz-keyframes bg {
        0% {
            -moz-transform:translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-412.5px,0,0);
            -webkit-transform: translate3d(-412.5px,0,0);
            -ms-transform: translate3d(-412.5px,0,0);
            transform: translate3d(-412.5px,0,0)
        }
    }

    @-webkit-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-412.5px,0,0);
            -webkit-transform: translate3d(-412.5px,0,0);
            -ms-transform: translate3d(-412.5px,0,0);
            transform: translate3d(-412.5px,0,0)
        }
    }

    @-ms-keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-412.5px,0,0);
            -webkit-transform: translate3d(-412.5px,0,0);
            -ms-transform: translate3d(-412.5px,0,0);
            transform: translate3d(-412.5px,0,0)
        }
    }

    @keyframes bg {
        0% {
            -moz-transform: translate3d(0,0,0);
            -webkit-transform: translate3d(0,0,0);
            -ms-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0)
        }

        100% {
            -moz-transform: translate3d(-412.5px,0,0);
            -webkit-transform: translate3d(-412.5px,0,0);
            -ms-transform: translate3d(-412.5px,0,0);
            transform: translate3d(-412.5px,0,0)
        }
    }

    #bg {
        background-size: 412.5px auto;
        width: 1237.5px
    }

    #header nav {
        padding: 0 1em
    }
}

.glitch {
    position: relative;
    color: #fff;
    font-size: 4em;
    letter-spacing: .5em;
    animation: glitch-skew 1s infinite linear alternate-reverse
}

.glitch::before {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    left: 2px;
    text-shadow: -2px 0 #FF25FF;
    clip: rect(44px,450px,56px,0);
    animation: glitch-anim 5s infinite linear alternate-reverse
}

.glitch::after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    left: -2px;
    text-shadow: -2px 0 #25FF25,2px 2px #FF25FF;
    animation: glitch-anim2 1s infinite linear alternate-reverse
}

@keyframes glitch-anim {
    0% {
        clip: rect(11px,9999px,21px,0);
        transform: skew(0.98deg)
    }

    5% {
        clip: rect(50px,9999px,59px,0);
        transform: skew(0.91deg)
    }

    10% {
        clip: rect(100px,9999px,1px,0);
        transform: skew(0.95deg)
    }

    15% {
        clip: rect(37px,9999px,11px,0);
        transform: skew(0.25deg)
    }

    20% {
        clip: rect(34px,9999px,28px,0);
        transform: skew(0.46deg)
    }

    25% {
        clip: rect(68px,9999px,63px,0);
        transform: skew(0.77deg)
    }

    30% {
        clip: rect(91px,9999px,86px,0);
        transform: skew(0.09deg)
    }

    35% {
        clip: rect(51px,9999px,29px,0);
        transform: skew(0.28deg)
    }

    40% {
        clip: rect(87px,9999px,15px,0);
        transform: skew(0.1deg)
    }

    45% {
        clip: rect(24px,9999px,98px,0);
        transform: skew(0.7deg)
    }

    50% {
        clip: rect(98px,9999px,23px,0);
        transform: skew(0.52deg)
    }

    55% {
        clip: rect(71px,9999px,30px,0);
        transform: skew(0.94deg)
    }

    60% {
        clip: rect(24px,9999px,46px,0);
        transform: skew(0.38deg)
    }

    65% {
        clip: rect(1px,9999px,63px,0);
        transform: skew(0.83deg)
    }

    70% {
        clip: rect(77px,9999px,19px,0);
        transform: skew(0.81deg)
    }

    75% {
        clip: rect(73px,9999px,45px,0);
        transform: skew(0.58deg)
    }

    80% {
        clip: rect(63px,9999px,20px,0);
        transform: skew(0.42deg)
    }

    85% {
        clip: rect(26px,9999px,21px,0);
        transform: skew(0.68deg)
    }

    90% {
        clip: rect(13px,9999px,13px,0);
        transform: skew(0.57deg)
    }

    95% {
        clip: rect(75px,9999px,81px,0);
        transform: skew(0.47deg)
    }

    100% {
        clip: rect(19px,9999px,19px,0);
        transform: skew(0.05deg)
    }
}

@keyframes glitch-anim2 {
    0% {
        clip: rect(16px,9999px,24px,0);
        transform: skew(0.83deg)
    }

    5% {
        clip: rect(92px,9999px,52px,0);
        transform: skew(0.09deg)
    }

    10% {
        clip: rect(43px,9999px,89px,0);
        transform: skew(0.11deg)
    }

    15% {
        clip: rect(65px,9999px,2px,0);
        transform: skew(0.69deg)
    }

    20% {
        clip: rect(25px,9999px,35px,0);
        transform: skew(0.56deg)
    }

    25% {
        clip: rect(53px,9999px,75px,0);
        transform: skew(0.91deg)
    }

    30% {
        clip: rect(5px,9999px,60px,0);
        transform: skew(0.23deg)
    }

    35% {
        clip: rect(46px,9999px,72px,0);
        transform: skew(0.67deg)
    }

    40% {
        clip: rect(46px,9999px,1px,0);
        transform: skew(0.7deg)
    }

    45% {
        clip: rect(60px,9999px,8px,0);
        transform: skew(0.47deg)
    }

    50% {
        clip: rect(31px,9999px,67px,0);
        transform: skew(0.46deg)
    }

    55% {
        clip: rect(1px,9999px,14px,0);
        transform: skew(0.01deg)
    }

    60% {
        clip: rect(80px,9999px,96px,0);
        transform: skew(0.18deg)
    }

    65% {
        clip: rect(67px,9999px,57px,0);
        transform: skew(0.6deg)
    }

    70% {
        clip: rect(24px,9999px,2px,0);
        transform: skew(0.22deg)
    }

    75% {
        clip: rect(85px,9999px,86px,0);
        transform: skew(0.5deg)
    }

    80% {
        clip: rect(39px,9999px,8px,0);
        transform: skew(0.32deg)
    }

    85% {
        clip: rect(33px,9999px,32px,0);
        transform: skew(0.3deg)
    }

    90% {
        clip: rect(47px,9999px,73px,0);
        transform: skew(0.49deg)
    }

    95% {
        clip: rect(66px,9999px,20px,0);
        transform: skew(0.51deg)
    }

    100% {
        clip: rect(71px,9999px,32px,0);
        transform: skew(0.32deg)
    }
}

@keyframes glitch-skew {
    0% {
        transform: skew(-1deg)
    }

    10% {
        transform: skew(0deg)
    }

    20% {
        transform: skew(2deg)
    }

    30% {
        transform: skew(0deg)
    }

    40% {
        transform: skew(-1deg)
    }

    50% {
        transform: skew(0deg)
    }

    60% {
        transform: skew(0deg)
    }

    70% {
        transform: skew(5deg)
    }

    80% {
        transform: skew(-4deg)
    }

    90% {
        transform: skew(-2deg)
    }

    100% {
        transform: skew(-2deg)
    }
}

.sm-link {
    --uismLinkDisplay: var(--smLinkDisplay, inline-flex);
    --uismLinkTextColor: var(--smLinkTextColor);
    --uismLinkTextColorHover: var(--smLinkTextColorHover);
    display: var(--uismLinkDisplay);
    color: var(--uismLinkTextColor);
    position: relative;
    overflow: hidden
}

a.sm-link {
    text-decoration: none
}

.sm-link__label {
    display: block
}

.sm-link_padding-all {
    --uismLinkLineWeight: var(--smLinkLineWeight, 2px);
    --uismLinkLineColor: var(--smLinkLineColor, #000);
    --uismLinkPadding: var(--smLinkPadding, 5px);
    padding: var(--uismLinkPadding)
}

.sm-link_padding-all::before,.sm-link_padding-all::after {
    width: 100%;
    height: var(--uismLinkLineWeight);
    left: 0
}

.sm-link_padding-all::before {
    top: 0
}

.sm-link_padding-all::after {
    bottom: 0
}

.sm-link_padding-all .sm-link__label::before,.sm-link_padding-all .sm-link__label::after {
    width: var(--uismLinkLineWeight);
    height: 100%;
    top: 0
}

.sm-link_padding-all .sm-link__label::before {
    left: 0
}

.sm-link_padding-all .sm-link__label::after {
    right: 0
}

.sm-link_padding-all::before,.sm-link_padding-all::after,.sm-link_padding-all .sm-link__label::before,.sm-link_padding-all .sm-link__label::after {
    content: "";
    background-color: var(--uismLinkLineColor);
    position: absolute;
    opacity: 0;
    will-change: transform,opacity;
    transition-property: transform,opacity
}

.sm-link_padding-all:hover::before,.sm-link_padding-all:hover::after,.sm-link_padding-all:hover .sm-link__label::before,.sm-link_padding-all:hover .sm-link__label::after {
    opacity: 1
}

.sm-link_padding-bottom {
    --uismLinkLineWeight: var(--smLinkLineWeight, 2px);
    --uismLinkLineColor: var(--smLinkLineColor, #000);
    padding-bottom: var(--uismLinkLineWeight);
    position: relative
}

.sm-link_padding-bottom::after {
    content: "";
    width: 100%;
    height: var(--uismLinkLineWeight);
    background-color: var(--uismLinkLineColor);
    position: absolute;
    left: 0;
    bottom: 0
}

.sm-link_bg {
    --uismLinkLineColor: var(--smLinkLineColor, #000);
    --uismLinkTextColorHover: var(--smLinkTextColorHover, #fff);
    --uismLinkPadding: var(--smLinkPadding, 5px);
    padding: var(--uismLinkPadding);
    transition: color .3s ease-out
}

.sm-link_bg::before,.sm-link_bg::after {
    content: "";
    background-color: var(--uismLinkLineColor);
    opacity: 0;
    position: absolute;
    transition: transform .2s ease-out,opacity .2s ease-out .03s
}

.sm-link_bg .sm-link__label {
    position: relative;
    z-index: 2
}

.sm-link_bg:hover::before,.sm-link_bg:hover::after {
    opacity: 1;
    transition-duration: .35s,.35s;
    transition-delay: 0s,0s
}

.sm-link_bg:hover {
    color: var(--uismLinkTextColorHover)
}

.sm-link_text::before {
    content: attr(data-sm-link-text);
    color: var(--uismLinkTextColorHover);
    position: absolute
}

.sm-link_text::before,.sm-link_text .sm-link__label {
    transition-property: transform;
    transition-timing-function: cubic-bezier(.86,.6,.08,1.01);
    transition-duration: .3s
}

.sm-link_text:hover::before,.sm-link_text:hover .sm-link__label {
    transition-duration: .4s
}

.sm-link12::before,.sm-link12::after {
    width: 51%;
    height: 100%;
    top: 0
}

.sm-link12::before {
    left: 0;
    transform: translate3d(-100%,0,0) rotate(-45deg)
}

.sm-link12::after {
    right: 0;
    transform: translate3d(100%,0,0) rotate(-45deg)
}

.sm-link12:hover::before,.sm-link12:hover::after {
    transform: translate3d(0,0,0)
}

.sm-link {
    --smLinkPadding: 10px 15px;
    --smLinkLineWeight: 5px;
    --smLinkLineColor: #8c188c;
    --smLinkTextColor: #fdfdfd;
    --smLinkTextColorHover: #1b255a
}

.sm-link_bg {
    --smLinkTextColorHover: #fff
}

