diff --git a/skins/elastic/styles/global.less b/skins/elastic/styles/global.less
index 30e62c3ca..e4cfdc0d9 100644
--- a/skins/elastic/styles/global.less
+++ b/skins/elastic/styles/global.less
@@ -66,30 +66,6 @@
        url('../fonts/roboto-v18-greek-ext_cyrillic-ext_cyrillic_greek_latin-ext_latin-700italic.woff') format('woff'); // Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+
 }
 
-/* E.g. for animated 'loading' icon */
-
-@-webkit-keyframes fa-spin {
-  0% {
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-  100% {
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}
-@keyframes fa-spin {
-  0% {
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-  100% {
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}
-
-
 /* Reset some Bootstrap style */
 
 body, button, input, optgroup, select, textarea, .popover {
diff --git a/skins/elastic/styles/mixins.less b/skins/elastic/styles/mixins.less
index cb7372094..0a124dd64 100644
--- a/skins/elastic/styles/mixins.less
+++ b/skins/elastic/styles/mixins.less
@@ -32,9 +32,9 @@
 }
 
 .animated-icon-class {
-    // fa-spin is defined in styles.less
-    -webkit-animation: fa-spin 2s infinite linear;
-    animation: fa-spin 2s infinite linear;
+    // spinner-border is defined in Bootstrap
+    -webkit-animation: spinner-border 1.5s infinite linear;
+    animation: spinner-border 1.5s infinite linear;
 }
 
 .font-icon-solid(@icon) {
diff --git a/skins/elastic/styles/widgets/common.less b/skins/elastic/styles/widgets/common.less
index 12ca9dded..988486f36 100644
--- a/skins/elastic/styles/widgets/common.less
+++ b/skins/elastic/styles/widgets/common.less
@@ -224,19 +224,12 @@ fieldset.image-attachment {
     justify-content: center;
     z-index: 3;
 
-    .spinner {
-        position: relative;
-        display: inline-block;
+    .spinner-border {
         width: 7rem;
         height: 7rem;
-        overflow: hidden;
-        text-indent: -999em;
         color: @color-spinner-circle;
         border: 1rem solid;
         border-color: currentColor @color-spinner-item currentColor currentColor;
-        border-radius: 50%;
-        -webkit-animation: fa-spin 1s infinite linear;
-        animation: fa-spin 1s infinite linear;
     }
 }
 
diff --git a/skins/elastic/ui.js b/skins/elastic/ui.js
index 88a125ffc..3d901b13a 100644
--- a/skins/elastic/ui.js
+++ b/skins/elastic/ui.js
@@ -3278,8 +3278,9 @@ function rcube_elastic_ui()
         frame = $(frame);
 
         if (frame.length) {
-            var loader = $('<div>').attr('class', 'iframe-loader')
-                .append($('<div>').attr('class', 'spinner').text(rcmail.gettext('loading')));
+            var loader = $('<div class="iframe-loader">')
+                .append($('<div class="spinner spinner-border" role="status">')
+                    .append($('<span class="sr-only">').text(rcmail.gettext('loading'))));
 
             // custom 'loaded' event is expected to be triggered by plugins
             // when using the loader not on an iframe