diff --git a/docs/_includes/gallery.html b/docs/_includes/gallery.html
index 68bed2a..9143e95 100644
--- a/docs/_includes/gallery.html
+++ b/docs/_includes/gallery.html
@@ -198,13 +198,13 @@
             document.writeln("</div>");
             document.writeln("<div id='galleryArrows' style='position: absolute; width: "
                 + frameWidth + "px; height: " + frameHeight
-                + "px; left: 0px; top: 0px; opacity: 0.0; padding-left: 12px; padding-right: 8px"
+                + "px; left: 0px; top: 0px; opacity: 0.0; "
                 + " display: flex; flex-flow: row nowrap; justify-content: space-between;align-items: end; padding:20; opacity: 0.8;'>");
             {
-                document.writeln("<div style='width: 32px; height: 32px; border-radius: 10px; background: #FFFFFF80;cursor: default;font-size: 52px;color: #444; display: flex; flex-flow: row nowrap; justify-content: center;align-items: center; ' >");
+                document.writeln("<div style='margin-left: 12px; margin-bottom: 8px;width: 32px; height: 32px; border-radius: 16px; overflow: hidden; background: #FFFFFF40;cursor: default;font-size: 52px;color: #444; display: flex; flex-flow: row nowrap; justify-content: center;align-items: center; ' >");
                 document.writeln("<img src='img/arrow_back.svg'/></div>");
 
-                document.writeln("<div style='width: 32px; height: 32px; border-radius: 10px; background: #FFFFFF80;cursor: default;font-size: 52px;color: #444; display: flex; flex-flow: row nowrap; justify-content: center;align-items: center; ' >");
+                document.writeln("<div style='margin-right: 12px; margin-bottom: 8px;width: 32px; height: 32px; border-radius: 16px; overflow: hidden; background: #FFFFFF40;cursor: default;font-size: 52px;color: #444; display: flex; flex-flow: row nowrap; justify-content: center;align-items: center; ' >");
                 document.writeln("<img src='img/arrow_forward.svg'/></span></div>");
             }