.page {
  background: radial-gradient(#FFF, #FFE96D, #FDD215);
}

.mandala-educacao-infantil {
  position: absolute;
  z-index: 100;

  display: flex;
  align-items: center;
  width: 630px;
  height: 675px;

  opacity: 0;

  margin-top: 20px;
}

/**
 * Círculo central
 */
.mandala-educacao-infantil .circulo-central {
  position: absolute;
  top: 250px;
  left: 210px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  opacity: 0;
  transition: opacity 0.5s ease-in-out;
}

.mandala-educacao-infantil .circulo-central .title {
  top: 50px;
  left: 68px;

  margin: 13px 0;

  font-weight: 900;
  font-size: 20px;
  text-align: center;
  white-space: nowrap;
  color: #D38413;
}

.mandala-educacao-infantil .circulo-central .content {
  width: 150px;
  top: 143px;
  left: 52px;
}

.mandala-educacao-infantil .barra-circulo {
  position: absolute;
  top: 121px;
  left: 70px;
}

.mandala-educacao-infantil .petala-curricular .title-petala {
  color: #09693A;
}

.mandala-educacao-infantil .petala-cognitiva .title-petala {
  color: #878787;
}

.mandala-educacao-infantil .petala-cultural-content .title-petala {
  color: #9F9F9F;
}

.mandala-educacao-infantil .petala-emocional-content .title-petala {
  color: #7B729E;
}

.mandala-educacao-infantil .petala-social-content .title-petala {
  color: #856AAC;
}

.mandala-educacao-infantil .petala-fisica-content .title-petala {
  color: #DD8243;
}

.mandala-educacao-infantil .petala-espiritual-content .title-petala {
  color: #CE7A41;
}