replaced custom CSS with liquid condition

_includes/masthead.html

@@ -37,7 +37,7 @@
     {% if site.social_media %}
       <div class="d-flex flex-wrap flex-items-start {% if site.layout == 'stacked' %}flex-justify-center mt-1 mt-md-3{% endif %}">
         {% for account in site.social_media %}
-          <div class="mr-3 mb-3 smedia-icon">
+          <div class="{% unless forloop.last == true %}mr-3{% endunless %} mb-3">
             {% assign service_shortname = account[0] %}
             {% assign service = site.data.social_media[service_shortname] %}
             <a href="{{ service.profile_url_prefix }}{{ account[1] }}" title="{{ service.name }}: {{ account[1] }}" class="tooltipped tooltipped-s" aria-label="{{ service.name }}: {{ account[1] }}">

assets/styles.scss

@@ -37,10 +37,3 @@
     padding-left: 16px;
   }
 }
-
-// fixes issue with last social media icon pushing the entire flex off-center on masthead.html page
-.d-flex {
-  .smedia-icon:last-child {
-    margin-right: 0 !important;
-  }
-}