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{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}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:none}table{border-collapse:collapse;border-spacing:0}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body, header {
    background-color: #111116;
}

body {
    position: absolute;
    display: table;
    width: 100%;
    height: 100%;
    padding: 32px 0;

    color: #fff;
    font-family: "VT323", monospace;
    font-size: 20px;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

.color-01 {
    color: #ff1461;
}

.color-02 {
    color: #ff7C72;
}

.color-03 {
    color: #fbf38c;
}

.color-04 {
    color: #a6ff8f;
}

.color-05 {
    color: #18ff92;
}

.color-06 {
    color: #1ce2b2;
}

.color-07 {
    color: #5ef3fb;
}

.color-08 {
    color: #61c3ff;
}

.color-09 {
    color: #5a87ff;
}

.color-10 {
    color: #8453e3;
}

.color-11 {
    color: #c26eff;
}

.color-12 {
    color: #fb89fb;
}

.bg-color-01 {
    background-color: #ff1461;
}

.bg-color-02 {
    background-color: #ff7C72;
}

.bg-color-03 {
    background-color: #fbf38c;
}

.bg-color-04 {
    background-color: #a6ff8f;
}

.bg-color-05 {
    background-color: #18ff92;
}

.bg-color-06 {
    background-color: #1ce2b2;
}

.bg-color-07 {
    background-color: #5ef3fb;
}

.bg-color-08 {
    background-color: #61c3ff;
}

.bg-color-09 {
    background-color: #5a87ff;
}

.bg-color-10 {
    background-color: #8453e3;
}

.bg-color-11 {
    background-color: #c26eff;
}

.bg-color-12 {
    background-color: #fb89fb;
}

.fireworks {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    z-index: 16;
}

.intro {
    position: relative;
    display: table-cell;
    padding: 0 15%;

    text-align: center;
    user-select: none;
    vertical-align: middle;
    z-index: 32;
}

.intro .title {
    font-size: 72px;
}

.intro .subtitle {
    font-size: 32px;
}

.intro .text {
    margin: 28px 0;

    font-family: "Caveat", cursive;
    font-size: 36px;
    line-height: 44px;
}

.intro .text .you {
    font-weight: bold;
}

.intro .text .signature {
    font-size: 24px;
    line-height: 28px;
    text-align: right;
}

.intro .info-text {
    margin: 24px 0;
}

.intro .icon-block .link, .intro .icon-block .lang {
    display: inline-block;
    margin: 8px;

    color: #fff;
    font-size: 64px;
}

@media (max-width: 1024px) {
    .intro {
        padding: 0 5%;
    }

    .intro .title {
        font-size: 64px;
    }

    .intro .subtitle {
        font-size: 28px;
    }

    .intro .text {
        font-size: 28px;
        line-height: 32px;
    }
}