diff --git a/src/components/style.css b/src/components/style.css
index a71e2db..cd2ee2d 100644
--- a/src/components/style.css
+++ b/src/components/style.css
@@ -133,9 +133,10 @@ img.vue-lb-modal-image {
   bottom: 10px;
   height: 50px;
   padding: 0 50px;
-  position: absolute;
   text-align: center;
-  white-space: nowrap
+  white-space: nowrap;
+  display: inline-block;
+  position: relative;
 }
 
 .vue-lb-modal-thumbnail {
@@ -224,6 +225,17 @@ img.vue-lb-modal-image {
   overflow: hidden;
 }
 
+.vue-lb-thumbnail-wrapper {
+  bottom: 10px;
+  height: 50px;
+  left: 0;
+  margin: 0 auto;
+  position: absolute;
+  right: 0;
+  text-align: center;
+  top: auto;
+}
+
 @media (min-width: 500px) {
   .vue-lb-thumbnail-arrow {
     width: 40px;
@@ -236,7 +248,7 @@ img.vue-lb-modal-image {
   }
 }
 
-.fade-enter-active, 
+.fade-enter-active,
 .fade-leave-active {
   transition: opacity .2s ease;
 }
diff --git a/src/components/template.html b/src/components/template.html
index 0fc3202..a07ae77 100644
--- a/src/components/template.html
+++ b/src/components/template.html
@@ -52,7 +52,7 @@
 
       </div> 
     </div> <!-- .vue-lb-content -->
-
+    <div class="vue-lb-thumbnail-wrapper">
     <div v-if="showThumbs" class="vue-lb-thumbnail">
       <button 
         type="button" 
@@ -89,7 +89,7 @@
         </span>
       </button>
     </div> <!-- .vue-lb-thumbnail -->
-
+    </div>
     <button 
       type="button" 
       class="vue-lb-arrow vue-lb-left"