Прошу посмотреть код и сделать замечания либо дать совет! Спасибо!

Курсы §35. Флексбокс, часть 1
1

.palette-small{
display:flex;
flex-direction:row;
}

.exam .palette-box:first-child .palette-small{
flex-direction:column-reverse;
justify-content:center;
}

.palette-box:first-child .palette-small .color-3{
order:1;
align-self:center;
}

.palette-box:first-child .palette-small .color-4{
order:-1;
align-self:center;
}

.exam .palette-box:nth-child(2) .palette-small{
flex-direction:column-reverse;
justify-content:space-between;
}

.exam .palette-box:nth-child(2) .palette-small .color-4,
.exam .palette-box:nth-child(2) .palette-small .color-1{
align-self:flex-start;
}

.exam .palette-box:nth-child(2) .palette-small .color-2,
.exam .palette-box:nth-child(2) .palette-small .color-6{
align-self:flex-end;
}

.part {
display:flex;
flex-direction:column;
justify-content:space-between;
}

.exam .palette-box:nth-child(3) .palette-small .part:nth-child(2){
margin-left:70px;
}

.exam .palette-box:nth-child(4) .palette-small .part:first-child{
flex-direction:row;
}

.exam .palette-box:nth-child(4) .palette-small .part:nth-child(2){
flex-direction:column-reverse;
margin-left:40px;
}

2

Такие маневры не используйте. Старайтесь пользоваться только flex-свойствами в этом задании.

3

Подскажите, пожалуйста, как будет правильно.