:root {
  --facebook-color: #4862a3;
  --facebook-hover: #5f78b6;
  --linkedin-color: #2a77b5;
  --linkedin-hover: #3c8bce;
  --twitter-color: #00acee;
  --twitter-hover: #2ac0fb;
  --instagram-color: #6a453c;
  --instagram-hover: #87645b;
  --pinterest-color: #e60023;
  --pinterest-hover: #e9334c;
  --icon-size: 36px;
  --icon-padding: 10px;
}

#rnsociallinks h4 {
  font-size: 1rem;
  line-height: 1.5;
  text-transform: uppercase;
  color: #232323;
}

#rnsociallinks .social-icons {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
}

#rnsociallinks .social-icons li {
  margin-right: var(--icon-padding);
  margin-bottom: var(--icon-padding);
}

#rnsociallinks .social-icons li a {
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  text-align: center;
  display: block;
  border-radius: 3px;
  height: var(--icon-size);
  line-height: var(--icon-size);
  width: var(--icon-size);
}

#rnsociallinks .social-icons li.facebook-f a {
  background-color: var(--facebook-color);
}

#rnsociallinks .social-icons li.facebook-f a:hover {
  color: #fff;
  background-color: var(--facebook-hover);
}
#rnsociallinks .social-icons li.instagram a {
  background-color: var(--instagram-color);
}

#rnsociallinks .social-icons li.instagram a:hover {
  color: #fff;
  background-color: var(--instagram-hover);
}
#rnsociallinks .social-icons li.twitter a {
  background-color: var(--twitter-color);
}

#rnsociallinks .social-icons li.twitter a:hover {
  color: #fff;
  background-color: var(--twitter-hover);
}

#rnsociallinks .social-icons li.linkedin a {
  background-color: var(--linkedin-color);
}

#rnsociallinks .social-icons li.linkedin a:hover {
  color: #fff;
  background-color: var(--linkedin-hover);
}
#rnsociallinks .social-icons li.pinterest a {
  background-color: var(--pinterest-color);
}

#rnsociallinks .social-icons li.pinterest a:hover {
  color: #fff;
  background-color: var(--pinterest-hover);
}