body{
    max-width: 1060px;
    margin: 0 auto;
    font-family: sans-serif;
    font-size: 16px;
}

a, a:hover, a:visited {
    font-size: inherit;
    color: inherit;
    text-decoration: dotted underline;
}

@keyframes mouse-pitch {
    0%, 40%{
        transform: translateY(0px);
    }
    100%{
        transform: translateY(-5px);
    }
}

@keyframes wave-stretch{
    0%{
        transform: scaleY(0.6);
    }
    100%{
        transform: scaleY(1.2)
    }
}


@keyframes rotation-360 {
    0%{
        transform: rotate(0deg);
    }
    100%
    {
        transform: rotate(360deg);
    }
}

@keyframes speed-stretch {
    0%{
        transform: scaleX(0.1);
    }
    100%{
        transform: scaleX(1);
    }
}

@keyframes volant{
    0%{
        transform: rotate(70deg) scale(0.6) translate(50px, -50px);
    }
    100%{
        transform: rotate(0deg) scale(1) translate(0px, 0px);
    }
}


#souris path:nth-of-type(2){
    animation: mouse-pitch 0.5s ease-out infinite alternate;
}

#vagues path:first-of-type{
    transform-origin: bottom;
    animation: wave-stretch 1s ease-in-out infinite alternate;
}

#voleyball svg{
    animation: rotation-360 1.5s linear infinite;
}

#baseball line{
    transform-origin: 37%;
    animation: speed-stretch 1s ease-out infinite alternate;
}

#baseball line:nth-of-type(2){
    animation-delay: 0.3s
}

#baseball line:nth-of-type(3){
    animation-delay: 0.6s
}

#badminton svg{
    transform-origin: bottom left;
    animation: volant 1.5s linear infinite;
}

#cogs svg{
    height: 128px;
    width: 128px;
}

#cog1, #cog2, #cog3{
    animation: rotation-360 3s linear infinite;
}

#cog1{
    transform-origin: 23.5% 63.2%;

}
#cog2{
    /* transform-origin: 45.31% 36.72%; */
    transform-origin: 44% 37%;
    animation-direction: reverse;

}
#cog3{
    transform-origin: 77.7% 53.8%;
    
}

#cogs{
    position: relative;
}