#wavyText span{
    display: inline-block;
    animation: wavy 2s ease-in-out infinite;
    animation-delay: calc(0.1s * var(--i));
}

#subWavy1 span{
    display: inline-block;
    animation: wavy1 2s ease-in-out infinite;
    animation-delay: calc(0.1s * var(--i));
    text-shadow: 0 0 10px #91b5df;
    z-index: 999;
}

.card a{
    display: inline-block;
    animation: wavy1 2s ease-in-out infinite;
    animation-delay: calc(.3s * var(--i));
    z-index: 999;
}

.card {
    width: 100%
    overflow: hidden;
}

.cardImg{
    perspective: 100px;
    margin: 10px
}

.cardImg img{
    box-shadow: 0px 0px 20px #D1EDFF;
    border-radius: 25px;
    transition: box-shadow .5s, transform .5s;
}

.cardImg img:hover {
    transform: translateZ(15px);
    z-index: 999;
    box-shadow: 0px 0px 20px #FFEA00;
}

@media (min-width: 768px) {

    @keyframes wavy1{
        0%{
            transform: translateY(0px);
        }
        50%{
            transform: translateY(-15px);
        }
        100%{
            transform: translateY(0px);
        }
    }
    @keyframes wavy{
        0%{
            transform: translateY(0px);
        }
        50%{
            transform: translateY(-30px);
        }
        100%{
            transform: translateY(0px);
        }
    }
}

@keyframes wavy1{
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-10px);
    }
    100%{
        transform: translateY(0px);
    }
}
@keyframes wavy{
    0%{
        transform: translateY(0px);
    }
    50%{
        transform: translateY(-20px);
    }
    100%{
        transform: translateY(0px);
    }
}


#myLogo, #headlineAU, #myLogo2{
    animation: animateLogo 5s linear infinite;
}   

@keyframes animateLogo {
    0% {
        transform: translateY(0px);   
    }
    25%{
        transform: translateY(-20px);
    }
    50%{
        transform: translateY(0px);
    }
    75%{
        transform: translateY(-20px);
    }
    100% {
        transform: translateY(0px);
    }
}
