body {
    background: linear-gradient(-20deg,#ff0000, #000000, #ff0000);
    background-size: 400% 400%;
    animation: gradient 1s ease infinite;
    height: 100vh;
    text-align: center;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: white;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@import url('https://fonts.googleapis.com/css?family=Titillium+Web:400,700');
html {
    height: 100%;
}

h1 {
    margin-bottom: 3rem;
    letter-spacing: 0.1rem;
    text-transform: uppercase;
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    font-size: 90px;
}

main {
    max-width: 75rem;
    margin: 0 auto;
}

.onlythis {
    padding: 50px;
    transition: transform .2s;
}

.onlythis:hover {
    transform: rotate(28deg);
    cursor: pointer;
}

.onlythis2 {
    padding: 50px;
    transition: transform .2s;
}

.onlythis2:hover {
    transform: rotate(28deg);
    cursor: pointer;
}

.no1seplay {
    padding: 70px;
    width: 800px;
    transition: transform .2s;
    margin: 0 auto;
}

.no1seplay:hover {
    transform: scale(1.2);
}


