Solução margem

O projeto disponibilizado para download possui alguns erros de margem que podem ser solucionados com o seguinte passo-a-passo:

1) Comente as seguintes linhas no style.css, na @media de 769px:

.conteudoPrincipal-cursos-link:nth-child(3n) {
        margin-right: 0;
    }

    .conteudoPrincipal-cursos-link:nth-child(3n+1) {
        margin-left: 0;
    } 

Essas 2 estavam tirando a margin de certos elementos para quando a tela estivesse com mais de 769px. Lembre-se que para Desktop o nosso objetivo é margin de 1% em tudo, com exceção da esquerda de elementos 4n + 1 e da direita de elementos 4n.

2) Comente as seguintes linhas no style.css, na @media de 1000px:

.conteudoPrincipal-cursos-link:nth-child(3n) {
        margin-right: 1.33%;
    }


.conteudoPrincipal-cursos-link:nth-child(3n+1) {
        margin-left: 1.333%;
    }

Essas 2 estavam colocando uma margin adicional em certos elementos para quando a tela estivesse com mais de 1000px. Lembre-se que para Desktop o nosso objetivo é margin de 1% em tudo, com exceção da esquerda de elementos 4n + 1 e da direita de elementos 4n.

3) Adicione a propriedade margin com as especificações abaixo no seguinte seletor dentro da @media do flexbox.css:

.conteudoPrincipal-cursos-link {
        width: 100%;
        margin:1% 0;
    }

Aqui, tirei a margin horizontal presente em alguns elementos, deixando apenas a margin na vertical. Para mobile, não faz sentido colocarmos margin horizontal em elementos 4n e 4n + 1, já que estão todos um embaixo do outro.

Quaisquer sugestões ou correções são bem-vindas.