.header {
  display: flex;
  /* position: sticky; */
  /* top: 20; */
  flex-direction: row;
  justify-content: center;
  align-items: center;
  justify-items: center;
  /* z-index: 999; */
}

.header .avatar {
  width: 140px;
  /* border-radius: 45px; */
  transition: transform 0.1s ease;
}

.header .avatar:active {
  transform: translateY(2px);
}

@media screen and (max-width: 480px) {
  .header {
    flex-direction: column;
    gap: 2rem;
  }
}