Sim realmente um ótimo curso sobre Layouts Responsivos. Vai um ótimo exemplo do que foi abordado no curso. Esse exemplo foi de um outro curso que fiz.

index.html

TESTANDO MEDIA QUERY

Mude o tamanho do seu navegador para ver as mudanças.

Sua área de visão atual é: menor que 600px entre 600 - 900px maior que 900px

Alura - Cursos online de tecnologia Grid CSS .

</body>

pagina.css

body {
padding: 15px;
background:#eee;
font-family: Arial, Helvetica, sans-serif
}
.caixa {
border: solid 1px #333;
padding: 5px 10px; margin: 40px;
}
.area-visivel span {
color: #666;
display: none;
}
/* max-width /
@media screen and (max-width: 600px) {
.um {
background: #F9C;
}
span.lt600 {
display: inline-block;
}
}
/ min-width /
@media screen and (min-width: 900px) {
.dois {
background: #F90;
}
span.gt900 {
display: inline-block;
}
}
/ min-width & max-width */
@media screen and (min-width: 600px) and (max-width: 900px) {
.tres {
background: #9CF;
}
span.bt600-900 {
display: inline-block;
}
}
.grid-container {
display: grid;
grid-template-columns: auto auto auto;
background-color: #212ff3;
padding: 10px;
}
.grid-item {
background-color: rgba(255, 255, 255, 0.8);
border: 1px solid rgba(0, 0, 0, 0.8);
padding: 20px;
font-size: 30px;
text-align: center;
}
p{
font-family: Arial;
font-size: 12pt;
letter-spacing: 0.5em;
text-align: justify;
color: red;
}