diff --git a/Mausritter/Mausritter.css b/Mausritter/Mausritter.css
index d5c1609d44..9c8c73899c 100644
--- a/Mausritter/Mausritter.css
+++ b/Mausritter/Mausritter.css
@@ -248,38 +248,55 @@ button[type=roll].sheet-attack-button {
 
 
 /* Roll Templates */
-.sheet-rolltemplate-ito-save table {
-    width: 100%;
-    background: #FFFFFF;
+.sheet-rolltemplate-ito-save .sheet-template-container {
+    border: 2px solid #000;
+    border-radius: 5px;
+    padding: 10px;
+    margin: 5px 0;
+    font-family: "Nunito Sans", sans-serif;
+    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
+    background-color: #f9f9f9;
 }
-.sheet-rolltemplate-ito-save caption {
-    text-align: center;
-    background: black;
-    color: white;
+
+.sheet-rolltemplate-ito-save .sheet-template-header {
+    background-color: #000;
+    color: #fff;
     font-weight: bold;
-    line-height: 1em;
-}
-.sheet-rolltemplate-ito-save td {
-  border-bottom: 1px solid black;
-  padding: 0 4px !important;
-}
-.sheet-rolltemplate-ito-save td.sheet-template_label {
-    font-weight: bold;
-}
-.sheet-rolltemplate-ito-save td.sheet-template_value {
     text-align: center;
+    padding: 10px;
+    border-radius: 3px;
+    margin-bottom: 10px;
 }
-.sheet-rolltemplate-ito-save .inlinerollresult  {
-  display: inline-block;
-  min-width: 1.5em;
-  text-align: center;
-  border: 2px solid black;
-  background: #BEBEBE;
+
+.sheet-rolltemplate-ito-save .sheet-template-row {
+    display: flex;
+    justify-content: space-between;
+    padding: 5px 0;
 }
-/* Erase the default highlighting of crits/fails */
-.sheet-rolltemplate-ito-save .inlinerollresult.fullcrit,
-.sheet-rolltemplate-ito-save .inlinerollresult.fullfail,
-.sheet-rolltemplate-ito-save .inlinerollresult.importantroll {
-  border: 2px solid black;
-  background: #BEBEBE;
+
+.sheet-rolltemplate-ito-save .template_label {
+    font-weight: bold;
+    width: 50%;
+}
+
+.sheet-rolltemplate-ito-save .template_value {
+    width: 50%;
+}
+
+.sheet-rolltemplate-ito-save .sheet-template-success, 
+.sheet-rolltemplate-ito-save .sheet-template-failure {
+    text-align: center;
+    padding: 10px;
+    margin-top: 10px;
+    border-radius: 3px;
+}
+
+.sheet-rolltemplate-ito-save .sheet-template-success {
+    background-color: #DFF0D8;
+    color: #3C763D;
+}
+
+.sheet-rolltemplate-ito-save .sheet-template-failure {
+    background-color: #F2DEDE;
+    color: #A94442;
 }
\ No newline at end of file
diff --git a/Mausritter/Mausritter.html b/Mausritter/Mausritter.html
index f741960c37..22f491dc16 100644
--- a/Mausritter/Mausritter.html
+++ b/Mausritter/Mausritter.html
@@ -260,27 +260,26 @@ on('change:repeating_equipment remove:repeating_equipment', () => {
 <!--
 &{template:ito-save} {{name=Test}} {{success=[[50]]}} {{roll1=[[1d100]]}}
 -->
-
 <rolltemplate class="sheet-rolltemplate-ito-save">
-    <table>
-        <caption>{{name}}</caption>
-        <tr>
-            <td class="template_label">Target:</td>
-            <td class="template_value">{{success}}</td>
-        </tr>
-        <tr>
-            <td class="template_label">Rolled:</td>
-            <td class="template_value">{{roll1}}</td>
-        </tr>
-        <tr style="background:#DFF0D8;">
-            {{#rollBetween() roll1 1 success}}
-			  <td class="template_value" colspan="2">Success</td>
-			{{/rollBetween() roll1 1 success}}
-		</tr>
-		<tr style="background:#F2DEDE;">
-			{{#rollGreater() roll1 success}}
-			  <td class="template_value" colspan="2">Failure</td>
-			{{/rollGreater() roll1 success}}
-        </tr>
-    </table>
+    <div class="sheet-template-container">
+        <div class="sheet-template-header">{{name}}</div>
+        <div class="sheet-template-row">
+            <span class="template_label">Target:</span>
+            <span class="template_value">{{success}}</span>
+        </div>
+        <div class="sheet-template-row">
+            <span class="template_label">Rolled:</span>
+            <span class="template_value">{{roll1}}</span>
+        </div>
+        {{#rollBetween() roll1 1 success}}
+        <div class="sheet-template-success">
+            <span>Success</span>
+        </div>
+        {{/rollBetween() roll1 1 success}}
+        {{#rollGreater() roll1 success}}
+        <div class="sheet-template-failure">
+            <span>Failure</span>
+        </div>
+        {{/rollGreater() roll1 success}}
+    </div>
 </rolltemplate>
\ No newline at end of file