diff --git a/src/sass/_common/common.scss b/src/sass/_common/common.scss
index 948aa4e7d9bdb..f7cb84f23c856 100755
--- a/src/sass/_common/common.scss
+++ b/src/sass/_common/common.scss
@@ -777,6 +777,9 @@ li strong.margin-right {
         font-weight: 400;
         padding-left: 1rem;
     }
+    .text-capitalize {
+        text-transform: capitalize !important;
+    }
 
     @media screen and (max-width: 650px) {
         width: 150px;
diff --git a/src/templates/_common/components/elements.jsx b/src/templates/_common/components/elements.jsx
index 864bbbfb1eba0..59a3954897557 100644
--- a/src/templates/_common/components/elements.jsx
+++ b/src/templates/_common/components/elements.jsx
@@ -267,6 +267,6 @@ export const Button = ({
 
 export const SocialButton = ({ provider }) => (
     <a id={`button_${provider}`} href='javascript:;' className='button-social'>
-        <span className='name'>{provider}</span>
+        <span className='name text-capitalize'>{provider}</span>
     </a>
 );