diff --git a/styles/elements/_accordions.scss b/styles/elements/_accordions.scss
index 7c771583..a6e61692 100644
--- a/styles/elements/_accordions.scss
+++ b/styles/elements/_accordions.scss
@@ -2,13 +2,12 @@
   @include shadow-panel;
   margin: $gap * 3 0;
   max-width: $max-panel-width;
-  background-color: $color-white;
 
   &__header {
     padding: $gap * 2 $gap * 3;
+    background-color: $color-white;
 
-    h3,
-    p {
+    &-text {
       margin: 0;
     }
   }
diff --git a/templates/applications/index.html b/templates/applications/index.html
index 1fd526cf..81509be5 100644
--- a/templates/applications/index.html
+++ b/templates/applications/index.html
@@ -32,49 +32,51 @@
     ) }}
 
   {% else %}
-    {% for application in portfolio.applications|sort(attribute='name') %}
-      {% set section_name = "application-{}".format(application.id) %}
-      {% set title = "Environments ({})".format(application.environments|length) %}
-        <div class="accordion">
-          <div class="accordion__header">
-            <h3>
-              <a href='{{ url_for("applications.settings", application_id=application.id) }}'>
-                {{ application.name }} {{ Icon("caret_right", classes="icon--tiny icon--primary") }}
-              </a>
-            </h3>
-            <p>
-              {{ application.description }}
-            </p>
-          </div>
-          {% call Accordion(
-            title=title,
-            id=section_name,
-            heading_tag="h4"
-          ) %}
-          {% for environment in application.environments %}
-            {% set env_access = environment_access[environment.id] %}
-            <div class="accordion__content--list-item">
-              <div class="row">
-                <div class="col col--grow">
+    <div class="usa-accordion">
+      {% for application in portfolio.applications|sort(attribute='name') %}
+        {% set section_name = "application-{}".format(application.id) %}
+        {% set title = "Environments ({})".format(application.environments|length) %}
+          <div class="accordion">
+            <div class="accordion__header">
+              <h3 class="accordion__header-text">
+                <a href='{{ url_for("applications.settings", application_id=application.id) }}'>
+                  {{ application.name }} {{ Icon("caret_right", classes="icon--tiny icon--primary") }}
+                </a>
+              </h3>
+              <p class="accordion__header-text">
+                {{ application.description }}
+              </p>
+            </div>
+            {% call Accordion(
+              title=title,
+              id=section_name,
+              heading_tag="h4"
+            ) %}
+            {% for environment in application.environments %}
+              {% set env_access = environment_access[environment.id] %}
+              <div class="accordion__content--list-item">
+                <div class="row">
+                  <div class="col col--grow">
+                    {% if env_access %}
+                      <a href='{{ url_for("applications.access_environment", environment_id=environment.id)}}' target='_blank' rel='noopener noreferrer'>
+                        {{ environment.displayname }} {{ Icon('link', classes='icon--medium icon--primary') }}
+                      </a>
+                    {% else %}
+                      {{ environment.displayname }}
+                    {% endif %}
+                  </div>
                   {% if env_access %}
-                    <a href='{{ url_for("applications.access_environment", environment_id=environment.id)}}' target='_blank' rel='noopener noreferrer'>
-                      {{ environment.displayname }} {{ Icon('link', classes='icon--medium icon--primary') }}
-                    </a>
-                  {% else %}
-                    {{ environment.displayname }}
+                    <div class="col">
+                      {{ env_access }}
+                    </div>
                   {% endif %}
                 </div>
-                {% if env_access %}
-                  <div class="col">
-                    {{ env_access }}
-                  </div>
-                {% endif %}
               </div>
-            </div>
-          {% endfor %}
-        {% endcall %}
-      </div>
-    {% endfor %}
+            {% endfor %}
+          {% endcall %}
+        </div>
+      {% endfor %}
+    </div>
   {% endif %}
 
 </div>
diff --git a/templates/components/accordion.html b/templates/components/accordion.html
index 1cccb115..9ec92099 100644
--- a/templates/components/accordion.html
+++ b/templates/components/accordion.html
@@ -8,7 +8,7 @@
   content_tag="div",
   content_classes="") %}
   <accordion v-cloak inline-template>
-    <{{wrapper_tag}} class="usa-accordion {{ wrapper_classes }}">
+    <{{wrapper_tag}} class="{{ wrapper_classes }}">
       <{{heading_tag}} class="accordion__button {{ heading_classes }}">
         <button
           v-on:click="toggle($event)"
diff --git a/templates/task_orders/index.html b/templates/task_orders/index.html
index 98b17c3e..0c319403 100644
--- a/templates/task_orders/index.html
+++ b/templates/task_orders/index.html
@@ -14,7 +14,7 @@
 
 {% macro TaskOrderList(task_orders, status) %}
   {% set status = "All Task Orders" %}
-  <div class="accordion">
+  <div class="accordion usa-accordion">
     {% call Accordion(title=status, id=status, heading_tag="h4") %}
       {% for task_order in task_orders %}
         <div class="accordion__content--list-item">