diff --git a/ekko-lightbox.js b/ekko-lightbox.js
index fa759b3..25e220f 100644
--- a/ekko-lightbox.js
+++ b/ekko-lightbox.js
@@ -83,9 +83,9 @@ const Lightbox = (($) => {
 			let h4 = `<h4 class="modal-title">${this._config.title || "&nbsp;"}</h4>`;
 			let btn = `<button type="button" class="close" data-dismiss="modal" aria-label="${this._config.strings.close}"><span aria-hidden="true">&times;</span></button>`;
 
-			let header = `<div class="modal-header${this._config.title || this._config.alwaysShowClose ? '' : ' hide'}">`+(this._isBootstrap3 ? btn+h4 : h4+btn)+`</div>`;
+			let header = `<div class="modal-header${this._config.title || this._config.alwaysShowClose ? '' : ' hide'}">`+(this._isBootstrap3 ? btn+h4 : h4)+`</div>`;
 			let footer = `<div class="modal-footer${this._config.footer ? '' : ' hide'}">${this._config.footer || "&nbsp;"}</div>`;
-			let body = '<div class="modal-body"><div class="ekko-lightbox-container"><div class="ekko-lightbox-item fade in show"></div><div class="ekko-lightbox-item fade"></div></div></div>'
+			let body = btn + '<div class="modal-body"><div class="ekko-lightbox-container"><div class="ekko-lightbox-item fade in show"></div><div class="ekko-lightbox-item fade"></div></div></div>'
 			let dialog = `<div class="modal-dialog" role="document"><div class="modal-content">${header}${body}${footer}</div></div>`
 			$(this._config.doc.body).append(`<div id="${this._modalId}" class="ekko-lightbox modal fade" tabindex="-1" tabindex="-1" role="dialog" aria-hidden="true">${dialog}</div>`)
 
diff --git a/ekko-lightbox.less b/ekko-lightbox.less
index e6dae94..4171709 100644
--- a/ekko-lightbox.less
+++ b/ekko-lightbox.less
@@ -76,6 +76,18 @@
   .modal-footer {
     text-align: left;
   }
+  
+  button.close {
+    position:fixed;
+    right: 10px;
+    top: 10px;
+    background: #fff;
+    border-radius: 50%;
+    width: 2rem;
+    height: 2rem;
+    opacity: 1;
+    z-index: 999;
+  }
 
   // http://tobiasahlin.com/spinkit/
   &-loader {