/* FILE:  index.css */


#content {
  text-align: center;
}

main{
  /*
  height: calc(100vh - 162px);
  background-color: #ffffff;
  background-image: linear-gradient(30deg, #e0e0e8 12%, transparent 12.5%, transparent 87%, #e0e0e8 87.5%, #e0e0e8), linear-gradient(150deg, #e0e0e8 12%, transparent 12.5%, transparent 87%, #e0e0e8 87.5%, #e0e0e8), linear-gradient(30deg, #e0e0e8 12%, transparent 12.5%, transparent 87%, #e0e0e8 87.5%, #e0e0e8), linear-gradient(150deg, #e0e0e8 12%, transparent 12.5%, transparent 87%, #e0e0e8 87.5%, #e0e0e8), linear-gradient(60deg, #e0e0e877 25%, transparent 25.5%, transparent 75%, #e0e0e877 75%, #e0e0e877), linear-gradient(60deg, #e0e0e877 25%, transparent 25.5%, transparent 75%, #e0e0e877 75%, #e0e0e877);
  background-position: 0 0, 0 0, 10px 18px, 10px 18px, 0 0, 10px 18px;
  */
}
.dark-mode main {
  /*
  background-color: #181A1B;
  background-image:  linear-gradient(30deg, #25282A 12%, transparent 12.5%, transparent 87%, #25282A 87.5%, #25282A), linear-gradient(150deg, #25282A 12%, transparent 12.5%, transparent 87%, #25282A 87.5%, #25282A), linear-gradient(30deg, #25282A 12%, transparent 12.5%, transparent 87%, #25282A 87.5%, #25282A), linear-gradient(150deg, #25282A 12%, transparent 12.5%, transparent 87%, #25282A 87.5%, #25282A), linear-gradient(60deg, #25282A77 25%, transparent 25.5%, transparent 75%, #25282A77 75%, #25282A77), linear-gradient(60deg, #25282A77 25%, transparent 25.5%, transparent 75%, #25282A77 75%, #25282A77);
  background-position: 0 0, 0 0, 10px 18px, 10px 18px, 0 0, 10px 18px;
  */
}

.avatar {
  width: 120px;
  border-radius: 50%;
  border: 4px solid #999;
}
.dark-mode .avatar {
  border: 4px solid #444;
}

.welcome {
  font-size: 20px;
}

.name {
  font-size: 30px;
}

.description {
  line-height: 30px;
  text-align: justify;
  margin: 0 150px 20px;
}

@media screen and (max-width: 767px) {
  .description {
    margin: 0 0 20px;
  }
}