Overhaul of theme

web/modules/custom/dc_components/components/ping-pong/ping-pong.css

@@ -20,6 +20,16 @@
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
+  color: var(--site-platinum, #fff);
+  font-size: 1.5rem;
+}
+
+.ping-pong__info-text p {
+  margin-bottom: 0;
+}
+
+.ping-pong__info-text {
+  margin-bottom: 2rem;
 }
 
 .ping-pong__info-inner {
@@ -35,7 +45,10 @@
 }
 
 .ping-pong__info h2 {
+  font-size: 3rem;
+  color: var(--site-white, #fff);
   margin: 0;
+  margin-bottom: 1rem;
 }
 
 .ping-pong.right {
@@ -55,7 +68,7 @@
 }
 
 .field--name-field-ping-pong-cta a {
-  background: rgba(255, 255, 255, 0.66);
+  background: var(--site-secondary, #fff);
   padding: 10px 20px;
   border-radius: 10px;
   transition: background .5s ease;

web/modules/custom/dc_components/components/ping-pong/ping-pong.twig

@@ -31,7 +31,7 @@
       <div class="ping-pong__info-text">
         {% block body %}{% endblock %}
       </div>
-      <div class="ping-pong__info-cta">
+      <div class="ping-pong__info-cta btn-primary">
         {% block cta %}{% endblock %}
       </div>
     </div>