@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@300..700&display=swap');

*{
  font-family: "Fredoka", sans-serif;
  font-weight: 450;
}
body {
  background-color: #2f793e;
  color: #e5f9fe;
  padding-bottom: 100px;
}

section.about-me {
  margin-top: 74px;
  margin-left: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid black;
  animation: start 0.7s ease;
}
section.about-me div.dov {
  border-bottom: 2px solid black;
}
section.about-me div.container-text {
  width: 100%;
  height: calc(100% + 10px);
}
section.about-me div.description-div {
  background-color: #367230;
  font-size: 19px;
  width: calc(100% - 40px);
  height: 55px;
  display: flex;
  align-items: center;
  margin-top: 20px;
  border: 1px solid black;
  border-radius: 4px;
}
section.about-me div.description-div p {
  margin: 0 0 0 10px;
}
/*=====================================*/
section.about-ducks {
  margin-left: 20px;
  animation: start 0.7s ease;
}
section.about-ducks div.title-ducks {
  border-bottom: 2px solid black;
}
section.about-ducks article {
  background-color: #367230;
  width: 40vh;
  padding: 10px 10px 10px 10px;
  border-radius: 7px;
  border: 1px solid black;
  font-size: 18px;
  animation: article linear;
  animation-timeline: view();
  animation-range: entry 1% cover 30%
}
section.about-ducks div.container .TD {
  width: 40vh;
  height: 20vh;
}
section.about-ducks div.container article p {
  font-size: 23px;
}



@keyframes start {
  from {
    opacity: 0;
    transform: scale(0.6) translateY(50vh);
  } to {
    opacity: 1;
    transform: scale(1) translateY(0)
  }
}

@keyframes article {
  from {
    opacity: 0;
    transform: scale(0.9) translateY(1vh);
  } to {
    opacity: 1;
    transform: scale(1) translateY(0vh)
  }
}

/*========================*/
@media (max-width: 600px) {
  section.about-me div.description-div {
    font-size: 14px;
  }
  section.about-ducks article {
    width: calc(100% - 20px);
  }
}