body {
    padding: 0;
    margin: 0;
    height: 100vh;
    overflow: hidden;
    background: rgba(0, 0, 0, 1);
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 1) 30%, rgba(68, 255, 252, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(30%, rgba(0, 0, 0, 1)), color-stop(100%, rgba(68, 255, 252, 1)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 30%, rgba(68, 255, 252, 1) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 1) 30%, rgba(68, 255, 252, 1) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 1) 30%, rgba(68, 255, 252, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 30%, rgba(68, 255, 252, 1) 100%);
}

h1 {
    font-family: 'Droid Serif', serif;
    text-align: center;
    font-size: 30em;
    color: rgb(68, 255, 252);
    transition: color 1.8s;
    text-decoration: line-through;
    line-height: 0.1em;
    letter-spacing: -0.05em;
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
    user-select: none;
    /* Likely future */
}

h1:hover {
    color: #000000;
}

.center {
    color: white;
    padding: 1em;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

@media only screen and (max-width: 1024px) {
    body {
        background: rgba(0, 0, 0, 1);
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 1) 35%, rgba(68, 255, 252, 1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(30%, rgba(0, 0, 0, 1)), color-stop(100%, rgba(68, 255, 252, 1)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 35%, rgba(68, 255, 252, 1) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 1) 35%, rgba(68, 255, 252, 1) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 1) 35%, rgba(68, 255, 252, 1) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 35%, rgba(68, 255, 252, 1) 100%);
    }
    h1 {
        font-size: 27em;
    }
}

@media only screen and (max-width: 768px) {
    h1 {
        font-size: 23em;
    }
}

@media only screen and (max-width: 667px) {
    h1 {
        font-size: 20em;
    }
}

@media only screen and (max-width: 560px) {
    body {
        background: rgba(0, 0, 0, 1);
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 1) 40%, rgba(68, 255, 252, 1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(30%, rgba(0, 0, 0, 1)), color-stop(100%, rgba(68, 255, 252, 1)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 1) 40%, rgba(68, 255, 252, 1) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 1) 40%, rgba(68, 255, 252, 1) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 1) 40%, rgba(68, 255, 252, 1) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 40%, rgba(68, 255, 252, 1) 100%);
    }
    h1 {
        font-size: 14em;
    }
}
