diff --git a/concordia/static/js/src/asset-reservation.js b/concordia/static/js/src/asset-reservation.js
index cacecbed7..fedef977a 100644
--- a/concordia/static/js/src/asset-reservation.js
+++ b/concordia/static/js/src/asset-reservation.js
@@ -33,7 +33,7 @@ function attemptToReserveAsset(reservationURL, findANewPageURL, actionType) {
                     $transcriptionEditor
                         .data('hasReservation', false)
                         .trigger('update-ui-state');
-                    jQuery('#asset-reservation-failure-modal').modal();
+                    jQuery('#asset-reservation-failure-modal').show();
                 } else {
                     displayHtmlMessage(
                         'warning',
@@ -54,7 +54,7 @@ function attemptToReserveAsset(reservationURL, findANewPageURL, actionType) {
                 $transcriptionEditor
                     .data('hasReservation', false)
                     .trigger('update-ui-state');
-                jQuery('#asset-reservation-failure-modal').modal();
+                jQuery('#asset-reservation-failure-modal').show();
                 Sentry.captureException(errorThrown, function (scope) {
                     scope.setTransactionName(
                         '408 error when attempting to reserve asset at ' +
diff --git a/concordia/static/js/src/base.js b/concordia/static/js/src/base.js
index 1c5eb57b0..c1d4a0e88 100644
--- a/concordia/static/js/src/base.js
+++ b/concordia/static/js/src/base.js
@@ -63,6 +63,10 @@ function displayHtmlMessage(level, message, uniqueId) {
         .removeAttr('id');
 
     $newMessage.addClass('alert-' + level);
+    if (level == 'error') {
+        /* class for red background */
+        $newMessage.addClass('alert-danger');
+    }
 
     if (uniqueId) {
         $('#' + uniqueId).remove();
diff --git a/concordia/static/js/src/contribute.js b/concordia/static/js/src/contribute.js
index 3461030be..046b796c9 100644
--- a/concordia/static/js/src/contribute.js
+++ b/concordia/static/js/src/contribute.js
@@ -354,7 +354,7 @@ function setupPage() {
                     .find('#message-contributors-num')
                     .html(data.asset.contributors);
                 $('#successful-submission-modal')
-                    .modal()
+                    .show()
                     .on('hidden.bs.modal', function () {
                         window.location.reload(true);
                     });
diff --git a/concordia/static/scss/base.scss b/concordia/static/scss/base.scss
index 810c1472c..440bed2ef 100644
--- a/concordia/static/scss/base.scss
+++ b/concordia/static/scss/base.scss
@@ -208,6 +208,20 @@ header.border-bottom {
 .alert {
     color: #fff;
 
+    &.alert-danger {
+        background-color: $red;
+        color: #fff;
+    }
+
+    &.alert-dismissible {
+        padding: 9px 1rem;
+    }
+
+    &.alert-info {
+        background-color: $blue;
+        color: #fff;
+    }
+
     .alert-link {
         color: #fff;
         text-decoration: underline;
diff --git a/concordia/templates/base.html b/concordia/templates/base.html
index c7e4dc528..3cc67b72c 100644
--- a/concordia/templates/base.html
+++ b/concordia/templates/base.html
@@ -167,12 +167,12 @@ <h1 class="logo-by-the-people m-0 -d-flex -align-items-center">
                         <div hidden id="message-template">
                             {% comment %} This is a hidden <div> rather than <template>
 because it's not worth dealing with IE11 compatibility {% endcomment %}
-                            <div class="alert alert-dismissible mx-3 my-2" role="alert">
-                                <button type="button" class="btn-close" data-bs-dismiss="alert"
-                                        aria-label="Close">
+                            <div class="alert alert-dismissible mx-3 my-2 d-flex justify-content-between" role="alert">
+                                <a type="button" data-bs-dismiss="alert"
+                                   aria-label="Close">
                                     <!--span aria-hidden="true">&times;</span-->
                                     <span aria-hidden="true" class="fas fa-times"></span>
-                                </button>
+                                </a>
                             </div>
                         </div>
                     </div>