.profile-picture {
  text-align: center;
  margin-bottom: 20px;
}

.profile-picture img {
  width: 120px; /* Adjust the size of the profile picture */
  height: 120px;
  border-radius: 50%; /* Creates a circular shape */
  transition: all 0.2s; /* Add transition for smooth hover effect */
  border: 1px solid;
  border-color: #50c750;
  box-shadow: 0 4px 10px rgba(66, 216, 32, 0.2);
}

.profile-picture img:hover {
  animation: scaleEffect 0.3s forwards;
}

@keyframes scaleProfileEffect {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1.05);
  }
}
.profile-picture a:hover img{
  animation: scaleEffect 0.4s forwards;
}

.profile-text {
  font-size: 18px;
  color: #aaa;
  text-align: center;
}

.sociallinks {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.sociallinks-button {
  width: 100%;
  max-width: 580px;
  margin: 10px 0;
}

.sociallinks-button a {
  max-height: 63px;
  display: flex;
  align-items: center;
  padding: 15px 20px;
  background-color: #fff;
  color: #0f0f0f;
  text-decoration: none;
  border-radius: 35px;
  font-size: 16px;
  transition: all 0.1s;
  border: 1px solid;
  border-color: #50c750;
  box-shadow: 0 4px 10px rgba(66, 216, 32, 0.2);
}

.sociallinks-button a:hover {
  animation: scaleEffect 0.4s forwards;
  background-color: #50c750;
  color: #fff;
  font-size: 18px;
  box-shadow: 0 4px 10px rgb(66, 216, 32, 0.5);
}

@keyframes scaleEffect {
  0% {
    transform: scale(1);
    font-size: 16px;
  }
  50% {
    transform: scale(1.08);
    font-size: 18px;
  }
  100% {
    transform: scale(1.05);
    font-size: 18x;
  }
}

.sociallinks-image {
  width: 25px;
  max-height: 25px;
  margin-right: 10px;
}

.sociallinks-button a span {
  flex: 1;
  text-align: center;
}