body{
    background-color: antiquewhite;
    display: flex;
    justify-content: center;
    padding: 250px; }

.title{
    position: relative;
    color: rgb(0, 0, 0); }

.rotate-words{
    display: inline;
    margin-left: 10px; }
    
.rotate-words span{
    width: max-content;
    position: absolute;
    background-color: rgb(181, 121, 255);
    border-radius: 20px;
    padding-inline: 10px;
    opacity: 0;
    transform-origin: 10% 75%;
    animation: rotate 12s var(--d) linear infinite; }   

@keyframes rotate {
    5% {
        opacity: 1; }

    10%,
    20%{
        opacity: 1;
        transform: rotate(3deg); }
    15%{
        transform: rotate(-1deg); }
    25%{
        opacity: 0;
        transform: translateY(90px);
        rotate: (10deg); }  }