.social-directory {
    margin-bottom: 4rem;
}
.social-directory-form {
    display: flex;
    gap: 6px;
    margin: 2.5rem 0;
}
.social-directory-filter {
    outline-offset: -2px;
    max-width: 380px;
    height: 42px;
    width: calc(100% - 80px);
}
.social-directory-form input[type="reset"] {
  text-transform: uppercase;
  padding: 0.533rem 1rem;
  background: var(--color-primary-base);
  color: #fff;
  font-weight: 700;
  font-size: .8125rem;
  line-height: 1.3;
  letter-spacing: 0.1em;
  border: none;
  outline: none;
  width: auto;
  height: 41px;
  transition: all 0.18s ease-in;
  cursor: pointer;
}
.social-directory-form input[type="reset"]:hover,
.social-directory-form input[type="reset"]:focus {
    background: #000;
}
.user_content h6.social-directory-category {
    padding-bottom: 4px;
    border-bottom: 1px solid #d9dcdd;
    margin-top: 3rem;
}
.social-directory-entry {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-content: center;
    border-bottom: 1px solid #d9dcdd;
}
.social-directory-entry:last-of-type {
    border-bottom: none;
}
.social-directory-entries .social-directory-entry:nth-child(2n) {
  background: var(--color-neutral-76);
}
/* add the bottom border on all results, we'll use js to figure out the last visible one and set the border to none inline */
.filtered .social-directory-entry:last-of-type {
    border-bottom: 1px solid #d9dcdd;
}
.filtered .social-directory-entries:last-of-type .social-directory-entry:last-of-type {
    border-bottom: none;
}
.social-directory-entry {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 10px 7px;
}
.social-directory-entry__name {
  margin-right: 11px;
  font-size: 1rem;
  text-size-adjust: 100%;
}
.social-directory-entry__icons {
  font-size: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 0 16px;
  justify-content: flex-start;
}
.social-directory-entry__icons a {
    color: var(--color-neutral-400);
    text-decoration: none;
    padding: 0;
}
.social-directory-entry__icons a:hover,
.social-directory-entry__icons a:focus {
    text-decoration: none;
}
.social-directory-entry__icons i {
    transition: color .18s ease;
}
.social-directory-entry__icons a:hover .fa-rss,
.social-directory-entry__icons a:focus .fa-rss {
  color: #f60;
}
.social-directory-entry__icons a:hover .fa-discord,
.social-directory-entry__icons a:focus .fa-discord {
  color: #5865F2;
}
.social-directory-entry__icons a:hover .fa-facebook,
.social-directory-entry__icons a:focus .fa-facebook {
  color: #1877f2;
}
.social-directory-entry__icons a:hover .fa-flickr,
.social-directory-entry__icons a:focus .fa-flickr {
    color:#ff0084;
}
.social-directory-entry__icons a:hover .fa-instagram,
.social-directory-entry__icons a:focus .fa-instagram {
  color: #c32aa3;
}
.social-directory-entry__icons a:hover .fa-linkedin-in,
.social-directory-entry__icons a:focus .fa-linkedin-in {
  color: #007BB6;
}
.social-directory-entry__icons a:hover .fa-pinterest,
.social-directory-entry__icons a:focus .fa-pinterest {
  color: #cb2027;
}
.social-directory-entry__icons a:hover .fa-podcast,
.social-directory-entry__icons a:focus .fa-podcast {
  color: #872ec4;
}
.social-directory-entry__icons a:hover .fa-snapchat,
.social-directory-entry__icons a:focus .fa-snapchat {
  color: #000;
}
.social-directory-entry__icons a:hover .fa-tiktok,
.social-directory-entry__icons a:focus .fa-tiktok {
  color: #FE2C55;
}
.social-directory-entry__icons a:hover .fa-tumblr,
.social-directory-entry__icons a:focus .fa-tumblr {
  color: #35465c;
}
.social-directory-entry__icons a:hover .fa-twitch,
.social-directory-entry__icons a:focus .fa-twitch {
  color: #9146FF;
}
.social-directory-entry__icons a:hover .fa-twitter,
.social-directory-entry__icons a:focus .fa-twitter {
  color: #1da1f2;
}
.social-directory-entry__icons a:hover .fa-vimeo,
.social-directory-entry__icons a:focus .fa-vimeo {
  color: #1ab7ea;
}
.social-directory-entry__icons a:hover .fa-youtube,
.social-directory-entry__icons a:focus .fa-youtube {
  color: #f00;
}

@media (min-width:700px) {
    .social-directory-entry {
        flex-direction: row;
        align-items: center;
        padding: 5px 7px;
    }
    .social-directory-entry__icons {
      justify-content: flex-end;
    }
}
