1 files changed, 5 insertions, 5 deletions
diff --git a/uploader/templates/phenotypes/macro-display-resumable-elements.html b/uploader/templates/phenotypes/macro-display-resumable-elements.html
index b0bf1b5..7cf3a87 100644
--- a/uploader/templates/phenotypes/macro-display-resumable-elements.html
+++ b/uploader/templates/phenotypes/macro-display-resumable-elements.html
@@ -1,6 +1,6 @@
 {%macro display_resumable_elements(id, title, help)%}
 <div id="{{id}}"
-     class="resumable-elements hidden"
+     class="resumable-elements visually-hidden"
      style="background:#D4D4EE;border-radius: 5px;;padding: 1em;border-left: solid #B2B2CC 1px;border-bottom: solid #B2B2CC 2px;margin-top:0.3em;">
   <strong style="line-height: 1.2em;">{{title | title}}</strong>
 
@@ -9,7 +9,7 @@
   <div id="{{id}}-selected-files"
        class="resumable-selected-files"
        style="display:flex;flex-direction:row;flex-wrap: wrap;justify-content:space-around;gap:10px 20px;">
-    <div class="panel panel-info file-display-template hidden">
+    <div class="panel panel-info file-display-template visually-hidden">
       <div class="panel-heading filename">The Filename Goes Here!</div>
       <div class="panel-body">
         <ul>
@@ -36,7 +36,7 @@
      href="#"
      style="margin-left: 80%;">Browse</a>
 
-  <div id="{{id}}-progress-bar" class="progress hidden">
+  <div id="{{id}}-progress-bar" class="progress visually-hidden">
     <div class="progress-bar"
          role="progress-bar"
          aria-valuenow="60"
@@ -49,11 +49,11 @@
 
   <div id="{{id}}-cancel-resume-buttons">
     <a id="{{id}}-resume-button"
-       class="resumable-resume-button btn btn-info hidden"
+       class="resumable-resume-button btn btn-info visually-hidden"
        href="#">resume upload</a>
 
     <a id="{{id}}-cancel-button"
-       class="resumable-cancel-button btn btn-danger hidden"
+       class="resumable-cancel-button btn btn-danger visually-hidden"
        href="#">cancel upload</a>
   </div>
 </div>