*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.conteinerRoxo{

   display: flex;
   background-color: rgb(195, 150, 237);
   height: 20vh;
   justify-content: end;
   align-items:end;
   gap: 10px;

}
.roxo{
border-radius: 50%;
width: 150px;
height: 150px;
background-color:  purple;


}
.conteinerVerde{

    display: flex;
    background-color: rgb(164, 233, 164);
    height: 20vh;
    justify-content: end;
     align-items:center;
     gap: 10px;
 
 }
 .verde{
   border-radius: 50%;
width: 150px;
height: 150px;
background-color:  green;

 }
 .conteinerVermelho{
    display: flex;
    background-color: rgb(241, 141, 141);
    height: 20vh;
    justify-content: center;
    align-items:center;
    gap: 10px;

 }
 .vermelho{
   border-radius: 50%;
   width: 150px;
   height: 150px;
   background-color: red;

 }
 .conteinerAmarelo{
    display: flex;
    background-color: rgb(241, 236, 141);
    height: 20vh;
    justify-content: space-between;
    align-items:center;
    gap: 10px;


 }
 .amarelo{
   border-radius: 50%;
   width: 150px;
   height: 150px;
   background-color:  yellow;



 }
 .conteinerAzul{
     display: flex;
    background-color: rgb(141, 236, 241);
    height: 20vh;
    justify-content: space-around;
    align-items:center;
    gap: 10px;


 }
 .azul{
   border-radius: 50%;
   width: 150px;
   height: 150px;
   background-color:  blue;


 }