Add checkerboard functionality

docs/assets/css/style.css

@@ -3,10 +3,14 @@
 @import url(https://fonts.googleapis.com/css?family=Lato:300,400,700);
 @import url(https://fonts.googleapis.com/css?family=Damion);
 :root {
+  /* color */
   --primaryColor: #60be86;
   --primaryColorDark: #2D804E;
   --primaryColorLight: #65d693;
   --grey: #4c6857;
+
+  /* sizing */
+  --listItemPadding: 0.4rem;
 }
 
 html {
@@ -248,20 +252,24 @@ header {
   header .icons-list {
     margin: 1rem 0;
     padding: 0;
-    list-style: none; }
+    list-style: none;
+    position: relative; }
     header .icons-list > div {
       display: inline; }
+
     header .icons-list li {
       position: relative;
       display: inline-block;
       width: 6.5rem;
       margin: .5rem .3rem;
-      padding: .4rem;
+      padding: var(--listItemPadding);
       cursor: pointer;
       border: 5px solid var(--primaryColor); }
+
       header .icons-list li:hover {
         border: 5px solid var(--primaryColorLight);
         border-radius: 5px; }
+
         header .icons-list li:hover::before {
           content: ' ';
           position: absolute;
@@ -273,9 +281,11 @@ header {
           border-left: 15px solid transparent;
           border-right: 15px solid transparent;
           border-top: 15px solid var(--primaryColorLight); }
+
       header .icons-list li.selected-version {
         border: 5px solid var(--primaryColorLight);
         border-radius: 5px; }
+
       header .icons-list li.selected-version::before {
         position: absolute;
         bottom: -19px;
@@ -287,8 +297,19 @@ header {
         border-right: 15px solid transparent;
         border-left: 15px solid transparent;
         content: ' '; }
+
+      .standinDiv {
+        height: 5rem;
+      }
+
     header .icons-list i {
-      font-size: 5rem; }
+      font-size: 5rem; 
+      position: absolute;
+      left: 0;
+      top: 0;
+      margin: var(--listItemPadding); 
+    }
+
     header .icons-list img {
       max-width: 100%; }