* {
    box-sizing: border-box;
}

body {
    display: grid;
    place-items: center;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 2rem;
}

img {
    width: 25%;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes scale-once {
    to {
        transform: scale(1.5);
    }
}

@keyframes scale-infinite {
    50% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes border {
    50% {
        border-width: 10px;
        border-color: red;
    }
    100% {
        border-width: 1px;
        border-color: black;
    }
}

@keyframes border {
    50% {
        border-width: 10px;
        border-color: red;
    }
    100% {
        border-width: 1px;
        border-color: black;
    }
}

@keyframes font {
    50% {
        color: white;
        border-color: yellow;
        background-color: black;
        font-size: 3rem;
    }
    100% {
        border-color: transparent;
        background-color: white;
        color: black;
        font-size: 1.5rem;
    }
}

#minion1 {
    animation: spin 10s linear infinite;
}

#minion2 {
    animation: spin 0.5s linear infinite;
}

#minion3 {
    animation: scale-once 0.5s linear infinite;
}

#minion4 {
    animation: scale-infinite 0.5s linear infinite;
}

#minion5 {
    border: 10px solid black;
    animation: border 0.5s linear infinite,
    scale-infinite 0.5s linear infinite,
    spin 3s linear infinite;
}

#minion13 {
    border: 10px solid transparent;
    font-size: 1.5rem;
    animation: font 0.5s linear infinite;
}