diff --git a/system/admin/editor/css/editor.css b/system/admin/editor/css/editor.css
index f07edba..1c40fff 100644
--- a/system/admin/editor/css/editor.css
+++ b/system/admin/editor/css/editor.css
@@ -190,17 +190,49 @@ pre code {
 /* drag and drop uploading */
 /*btn blue #007bff, hover darker #0069d9*/
 .vs-dropzone {
-  border: 2px dashed #007bff;
-  border-radius: .5rem;
-  padding: 2rem;
-  text-align: center;
-  color: #6c757d;
-  cursor: pointer;
-  transition: background .2s ease-in-out;
-  margin-bottom: 1rem;
+    border: 2px dashed #007bff;
+    border-radius: .5rem;
+    padding: 2rem;
+    text-align: center;
+    color: #6c757d;
+    cursor: pointer;
+    transition: background .2s ease-in-out;
+    margin-bottom: 1rem;
 }
 .vs-dropzone.dragover {
-  background: #e9f5ff;
-  border-color: #0069d9;
-  color: #0069d9;
+    background: #e9f5ff;
+    border-color: #0069d9;
+    color: #0069d9;
+}
+/* image uploader modal gallery */
+.cover-container {
+    display: grid;
+    grid-gap: 8px;
+    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
+    grid-auto-rows: 140px;
+    grid-auto-flow: row dense;
+    max-height: 65vh;
+    overflow: auto;
+}
+.cover-item {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    background: #e0e0e0;
+    background: #eee url('data:image/svg+xml,\ <svg xmlns="http://www.w3.org/2000/svg" width="400" height="400"         fill-opacity=".125" >\ <rect x="200" width="200" height="200" />\ <rect y="200" width="200" height="200" />\ </svg>');
+    background-size: 16px 16px;
+    grid-column-start: auto;
+    grid-row-start: auto;
+    border-top-right-radius: 2px;
+    border: 1px solid #bbb;
+}
+.img-thumbnail{
+    max-height: 100%;
+    /* unset other things from adminlte.min.css */
+    background-color: unset;
+    border: unset;
+    border-radius: unset;
+    box-shadow: unset;
 }
diff --git a/system/admin/views/add-content.html.php b/system/admin/views/add-content.html.php
index c9984b2..3b21787 100644
--- a/system/admin/views/add-content.html.php
+++ b/system/admin/views/add-content.html.php
@@ -253,24 +253,6 @@ $( function() {
 <style>
 .wmd-prompt-background {z-index:10!important;}
 #wmd-preview img {max-width:100%;}
-.cover-container {
-    overflow: auto;
-    max-height: 65vh;
-    width: 100%;
-    white-space: nowrap;
-}
-.cover-item {
-    position: relative;
-    margin: 2px 2px;
-    border-top-right-radius: 2px;
-    width: 190px;
-    height: 140px;
-    vertical-align: top;
-    background-position: top left;
-    background-repeat: no-repeat;
-    background-size: cover;
-    float:left;
-}
 </style>
 
     <div class="modal fade" id="insertImageDialog" tabindex="-1" role="dialog" aria-labelledby="insertImageDialogTitle" aria-hidden="true">
diff --git a/system/admin/views/add-page.html.php b/system/admin/views/add-page.html.php
index 18f745d..0ab6cfb 100644
--- a/system/admin/views/add-page.html.php
+++ b/system/admin/views/add-page.html.php
@@ -119,24 +119,6 @@ if ($type == 'is_page') {
 <style>
 .wmd-prompt-background {z-index:10!important;}
 #wmd-preview img {max-width:100%;}
-.cover-container {
-    overflow: auto;
-    max-height: 65vh;
-    width: 100%;
-    white-space: nowrap;
-}
-.cover-item {
-    position: relative;
-    margin: 2px 2px;
-    border-top-right-radius: 2px;
-    width: 190px;
-    height: 140px;
-    vertical-align: top;
-    background-position: top left;
-    background-repeat: no-repeat;
-    background-size: cover;
-    float:left;
-}
 </style>
 
     <div class="modal fade" id="insertImageDialog" tabindex="-1" role="dialog" aria-labelledby="insertImageDialogTitle" aria-hidden="true">
diff --git a/system/admin/views/edit-content.html.php b/system/admin/views/edit-content.html.php
index b5c9214..b55b84e 100644
--- a/system/admin/views/edit-content.html.php
+++ b/system/admin/views/edit-content.html.php
@@ -307,24 +307,7 @@ $( function() {
 <style>
 .wmd-prompt-background {z-index:10!important;}
 #wmd-preview img {max-width:100%;}
-.cover-container {
-    overflow: auto;
-    max-height: 65vh;
-    width: 100%;
-    white-space: nowrap;
-}
-.cover-item {
-    position: relative;
-    margin: 2px 2px;
-    border-top-right-radius: 2px;
-    width: 190px;
-    height: 140px;
-    vertical-align: top;
-    background-position: top left;
-    background-repeat: no-repeat;
-    background-size: cover;
-    float:left;
-}
+
 </style>
 
     <div class="modal fade" id="insertImageDialog" tabindex="-1" role="dialog" aria-labelledby="insertImageDialogTitle" aria-hidden="true">
diff --git a/system/admin/views/edit-page.html.php b/system/admin/views/edit-page.html.php
index 3ecf201..ff9a7dd 100644
--- a/system/admin/views/edit-page.html.php
+++ b/system/admin/views/edit-page.html.php
@@ -240,24 +240,6 @@ if ($type == 'is_page' || $type == 'is_frontpage') {
 <style>
 .wmd-prompt-background {z-index:10!important;}
 #wmd-preview img {max-width:100%;}
-.cover-container {
-    overflow: auto;
-    max-height: 65vh;
-    width: 100%;
-    white-space: nowrap;
-}
-.cover-item {
-    position: relative;
-    margin: 2px 2px;
-    border-top-right-radius: 2px;
-    width: 190px;
-    height: 140px;
-    vertical-align: top;
-    background-position: top left;
-    background-repeat: no-repeat;
-    background-size: cover;
-    float:left;
-}
 </style>
 
     <div class="modal fade" id="insertImageDialog" tabindex="-1" role="dialog" aria-labelledby="insertImageDialogTitle" aria-hidden="true">