tituss.css

@font-face {
    font-family: RSE;
    src: url(RSEHandwritingPixel.ttf);
}

body {
    background-color: #000;
    background: linear-gradient( rgba(0, 2, 21, 0.7), rgba(0, 2, 21, 0.7)), url(rainbow_leopard_print.jpg);
    background-repeat: repeat;
    background-attachment: fixed;
    font-family: RSE;
    font-weight: 100;
    font-size: 1.2em;
    color: rgb(130, 134, 150);
}

a {
    text-decoration: none;
    color: #ff00e3;
    font-size: 55px;
}

.html-rainbow-text span {
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    display: inline-block;
    font-weight: bold;
    font-size: 70px;
    text-shadow: #A3A3A3 1px 1px 1px;
}

.rnOuter {
    height: 100vh;
}

.rnInnerLeft {
    width: 50%;
    position: fixed;
    top: -10%;
    bottom: 0;
    left: 0;
    margin: auto;
    transform-style: preserve-3d;
    transition: transform 6s ease;
    transform-origin: -120% top;
}

.rnInnerRight {
    width: 50%;
    position: fixed;
    top: -10%;
    bottom: 0;
    right: 0;
    margin: auto;
    transform-style: preserve-3d;
    transition: transform 6s ease;
    transform-origin: -120% top;
}

.rnUnit {
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(to left, #610018 4vw, #000000 8vw, #c70032 10vw);
    background-size: 100% 100%;
    display: inline-block;
    transform-origin: 0 0%;
}

@keyframes rnUnit {
    50% {
        transform: rotate(-3deg);
    }
}

.rnUnit:nth-child(1) {
    animation-delay: -0.1s;
}

.rnUnit:nth-child(2) {
    animation-delay: -0.2s;
}

.rnUnit:nth-child(3) {
    animation-delay: -0.3s;
}

.rnUnit:nth-child(4) {
    animation-delay: -0.4s;
}

.rnUnit:nth-child(5) {
    animation-delay: -0.5s;
}

.rnOuter:hover .rnInnerLeft {
    transform-origin: -120% top;
    transform: scaleX(0);
}

.rnOuter:hover .rnInnerRight {
    transform-origin: -120% top;
    transform: scaleX(3);
}

.rnOuter:hover .aoTableCell {
    color: white;
}

.spotlights {
    position: fixed;
    z-index: 1;
    top: -200px;
    width: 75%;
    pointer-events: none;
    transform: translateX(-50%);
}

.bodylicious {
    padding: 50px;
    position: relative;
}

.rxWorld {
    text-align: center;
}