diff --git a/plugins/atem/styles.css b/plugins/atem/styles.css
index e8ac929..6564099 100644
--- a/plugins/atem/styles.css
+++ b/plugins/atem/styles.css
@@ -1,10 +1,17 @@
 h3 {
-  color: #6d6d6d;
+  color: #6d6d6d !important;
+  margin: 0;
+  font-size: medium;
+}
+
+.me-label {
+  margin-top: 0;
+  margin-bottom: 2px;
 }
 
 .atem-input {
-  width: 50px;
-  height: 50px;
+  width: 35px;
+  height: 35px;
   background: white;
   border: 4px solid;
   border-color: #8c8c8c;
@@ -46,6 +53,8 @@ h3 {
   align-items: center;
   justify-content: center;
   height: 100%;
+  font-size: 11px;
+  font-weight: bold;
 }
 
 .transition-container {
@@ -108,6 +117,11 @@ h3 {
 .fade-to-black h3 {
   text-align: center;
 }
+.rate-heading {
+  text-align: center;
+  font-size: small;
+  margin-bottom: 4px;
+}
 
 .dsk-rate,
 .ftb-rate,
@@ -117,11 +131,6 @@ h3 {
   flex-direction: column;
 }
 
-.ftb-rate,
-.transition-rate {
-  width: 50px;
-}
-
 .dsk-rate-label,
 .ftb-rate-label,
 .transition-rate-label {
diff --git a/plugins/atem/template.ejs b/plugins/atem/template.ejs
index d6d804d..a80cde6 100644
--- a/plugins/atem/template.ejs
+++ b/plugins/atem/template.ejs
@@ -5,7 +5,7 @@
 <% if (data.video.mixEffects) { %>
 <% Object.entries(data.video.mixEffects).forEach(([meIndex, state])=>{ %>
     <div class="mixeffect_wrapper" id="me-<%= meIndex %>">
-        <h1 class="atem-gray">ME<%= Number(meIndex) + 1 %></h1>
+        <h1 class="atem-gray me-label">ME<%= Number(meIndex) + 1 %></h1>
         <div class="program">
             <h3 class="atem-gray">Program</h3>
             <div class="source-wrapper">
@@ -132,7 +132,7 @@
                                 <div class="source-label">AUTO</div>
                             </div>
                             <div class="transition-rate atem-input clear">
-                                <div class="atem-gray" style="text-align: center">Rate</div>
+                                <div class="atem-gray rate-heading">Rate</div>
                                 <div id="me-<%= meIndex %>-transition-rate" class="transition-rate-label">00</div>
                             </div>
                         </div>
@@ -152,7 +152,7 @@
                                     <div class="source-label">TIE</div>
                                 </div>
                                 <div class="dsk-rate atem-input clear">
-                                    <div class="atem-gray" style="text-align: center">Rate</div>
+                                    <div class="atem-gray rate-heading">Rate</div>
                                     <div id="dsk-<%= dskIndex %>-rate" class="dsk-rate-label">00</div>
                                 </div>
                                 <div id="dsk-<%= dskIndex %>-onair" class="atem-input">
@@ -171,7 +171,7 @@
                     <h3 class="atem-gray">Fade to Black</h3>
                     <div class="source-wrapper">
                         <div class="ftb-rate atem-input clear">
-                            <div class="atem-gray" style="text-align: center">Rate</div>
+                            <div class="atem-gray rate-heading">Rate</div>
                             <div id="me-<%= meIndex %>-ftb-rate" class="ftb-rate-label">00</div>
                         </div>
                         <div id="me-<%= meIndex %>-ftb" class="atem-input">