Não sei o porquê disso. E gostaria que alguém comentasse o porquê isso aconteceu, sendo que na aula não ocorre. Mas dá esse problema de quando coloca a propriedade "max-width: 600px" no CSS no arquivo "destaques.css". Assim que aumento a tela do dispositivo no navegador, a imagem fica à esquerda e não no centro como deveria ficar igual na aula.
Mas, encontrei uma solução para isso usando o código abaixo no mesmo arquivo "destaques.css", fazendo assim a imagem ficar ao centro.
Descobri isso usando o inspecionar do navegador que constava que aquele espaço que havia a direita da imagem, fazendo com o que ela ficasse à esquerda, ao invés de ficar no centro; era dentro da tag "figure". Pois aí tive a ideia de colocar a propriedade text-align: center dentro dessa tag. Aí funcionou.
figure {
text-align: center;
}
