Анимации при загрузке страницы CSS

я не особо разбираюсь в CSS, но на днях делал себе сайт где при загрузке с низу должна выходить аватарка, остановится на середину и с права должен выйти весь текст, а автарка должна уйти не много в лево, помогите пожалуйста осуществить это.

Есть блок header где содержится вся информация, текст и аватарка

.header {
  z-index: 1;
  text-align: center;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0 auto;
  transform: translate(-50%, -50%);
  float: left;
  animation: animation 1s;
}