.social-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f2f2f2;
  box-shadow: 0px 0px 15px #00000027;
  padding: 15px 10px;
  border-radius: 5em;
}

.social-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  margin: 0 10px;
  background-color: #fff;
  box-shadow: 0px 0px 4px #00000027;
  transition: 0.3s;
}

.social-button:hover {
  background-color: #f2f2f2;
  box-shadow: 0px 0px 6px 3px #00000027;
}

.social-buttons img {
  transition: 0.3s;
  height: 20px;
}

.facebook {
  background-color: #3b5998;
}

.facebook img {
  fill: #f2f2f2;
}

.facebook:hover img {
  fill: #3b5998;
}

.github {
  background-color: #333;
}

.github img {
  width: 25px;
  height: 25px;
  fill: #f2f2f2;
}

.github:hover img {
  fill: #333;
}

.linkedin {
  background-color: #0077b5;
}

.linkedin img {
  fill: #f2f2f2;
}

.linkedin:hover img {
  fill: #0077b5;
}

.instagram {
  background-color: #c13584;
}

.instagram img {
  fill: #f2f2f2;
}

.instagram:hover img {
  fill: #c13584;
}

.twitter {
  background-color: #1DA1F2;
}

.twitter img {
  fill: #f2f2f2;
}

.twitter:hover img {
  fill: #1DA1F2;
}

.gmail {
  background-color: #D44638;
}

.gmail img {
  fill: #f2f2f2;
}

.gmail:hover img {
  fill: #D44638;
}

.tiktok {
  background-color: #000000;
}

.tiktok img {
  fill: #f2f2f2;
}

.tiktok:hover img {
  fill: #000000;
}