a {
    padding-bottom: 1em; 
}

/* Alternate colors using nth-child selectors */
.container .cheatExplanationBlock a:nth-child(4n+0) {
    color: rgb(204, 153, 205);
}
.container .cheatExplanationBlock a:nth-child(4n+1) {
    color: rgb(103, 205, 204);
}
.container .cheatExplanationBlock a:nth-child(4n+2) {
    color: rgb(240, 141, 73);
}
.container .cheatExplanationBlock a:nth-child(4n+3) {
    color: rgb(126, 198, 153);
}

/* Hover and active states — always white */
.container .cheatExplanationBlock a:hover,
.container .cheatExplanationBlock a:active {
    color: rgb(204, 204, 204);
}

.container .cheatExplanationBlock a {
    position: relative; /* must be positioned for z-index to work */
    z-index: 2; /* z-index 2 links go over z-index 1 cat */
}

/* To flex align the cat and the links in index.html*/
.collectionStyle {
    display: flex;
    justify-content: space-between;
}

.cheatExplanationBlock{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

img{
    width: 100%;
}

.catContainer {
    max-width: 400px;
    margin: 0 auto;
    position: relative; /* For z-index */
    z-index: 1; /* To keep below the links */
}

@media (max-width: 600px) {
    .catContainer {
        /* Force cat to that position in mobile.
        z-index takes care of the rest to lay the links on top of the cat*/
        max-width: 90%;
        position: absolute;
    }
}