.contact-top-content {
   background-color: $body-bg-alt-light;
   border-radius: $border-radius-base;
   padding: 50px 0;

   .wpj-col-4 {
      &:first-of-type {
         .w-text:not(.uptitle) p {
            margin-bottom: 0;
         }
      }

      a {
         font-size: $font-size-h3;
         color: $text-dark;
         font-weight: $font-weight-bold;
         font-family: $font-family-heading;

         &[href*="mailto"] {
            font-weight: $font-weight-semibold;
         }
      }

      @media screen and (min-width: $lg) {
         max-width: 30%;
         flex: 0 0 30%;

         &:first-of-type {
            max-width: 40%;
            flex: 0 0 40%;
         }
      }
   }

   .text-small {
      font-size: $font-size-smaller;
   }

   .text-muted {
      color: $text-muted;
      margin-top: 10px;
   }
}

.html-page-about {
   h1 {
      margin-bottom: 10px;
   }
}


@media screen and (max-width: $xl - 1) {
   .contact-top-content {
      margin: 0 -20px;
      padding: 50px;
      border-radius: 0;
   }
}

@media screen and (max-width: $lg - 1) {
   .contact-top-content {
      padding: 40px 20px;

      .wpj-col-4 {
         a {
            font-size: $font-size-h5;
         }
      }
   }
}

@media screen and (max-width: $md - 1) {
   .contact-top-content {
      margin: 0 -10px;
      padding: 30px 20px;
      border-radius: 0;
   }

   .main-htmlpage {
      h1 {
         font-size: $font-size-h2;
      }

      h2,
      .h2 {
         font-size: $font-size-h3;
      }
   }
}
