diff --git a/styles/components/_empty_state.scss b/styles/components/_empty_state.scss
index 74514278..853b5060 100644
--- a/styles/components/_empty_state.scss
+++ b/styles/components/_empty_state.scss
@@ -10,7 +10,7 @@
     padding: 8rem ($gap * 4) 0;
   }
 
-  .icon {
+  > .icon {
     @include icon-size(50);
     @include icon-color($color-gray-light);
   }
diff --git a/templates/fragments/applications/add_new_application_member.html b/templates/fragments/applications/add_new_application_member.html
index 3294b21c..b47ff87c 100644
--- a/templates/fragments/applications/add_new_application_member.html
+++ b/templates/fragments/applications/add_new_application_member.html
@@ -1,136 +1,15 @@
-{% from "components/icon.html" import Icon %}
-{% from "components/text_input.html" import TextInput %}
-{% from "components/checkbox_input.html" import CheckboxInput %}
 {% from "components/multi_step_modal_form.html" import MultiStepModalForm %}
 
-{% set step_one %}
-  <div class="modal__form--header">
-    <h1>Invite new member</h1>
-  </div>
-  <div class='form-row'>
-    <div class='form-col form-col--half'>
-      {{ TextInput(new_member_form.user_data.first_name, validation='requiredField') }}
-    </div>
-    <div class='form-col form-col--half'>
-      {{ TextInput(new_member_form.user_data.last_name, validation='requiredField') }}
-    </div>
-  </div>
-  <div class='form-row'>
-    <div class='form-col form-col--half'>
-      {{ TextInput(new_member_form.user_data.email, validation='email') }}
-    </div>
-    <div class='form-col form-col--half'>
-      {{ TextInput(new_member_form.user_data.phone_number, validation='usPhone', optional=True) }}
-    </div>
-  </div>
-  <div class='form-row'>
-    <div class='form-col form-col--half'>
-      {{ TextInput(new_member_form.user_data.dod_id, validation='dodId') }}
-    </div>
-    <div class='form-col form-col--half'>
-    </div>
-  </div>
-  <div class='action-group'>
-    <input
-        type='button'
-        v-on:click="next()"
-        v-bind:disabled="invalid"
-        class='action-group__action usa-button'
-        value='Next'>
-    <a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">{{ "common.cancel" | translate }}</a>
-  </div>
-{% endset %}
-{% set step_two %}
-  <div class="modal__form">
-    <div class="modal__form--header">
-      <h1>{{ "portfolios.applications.members.new.assign_roles" | translate }}</h1>
-      <a class='icon-link'>
-        {{ Icon('info') }}
-        {{ "portfolios.applications.members.new.learn_more" | translate }}
-      </a>
-      <div class="environment-roles-new">
-        <div class="form-row">
-          <div class="form-col form-col--quarter">
-            <span class="environment-roles-new__head">
-              {{ "common.resource_names.environments" | translate }}:
-            </span>
-          </div>
-          <div class="form-col form-col--three-quarters">
-            <span class="environment-roles-new__head">
-              {{ "common.choose_role" | translate }}:
-            </span>
-          </div>
-        </div>
-        {% for environment_data in new_member_form.environment_roles %}
-          <optionsinput inline-template
-            v-bind:initial-value="'{{ environment_data.role.data | string }}'"
-          >
-            <div class="usa-input">
-              <fieldset data-ally-disabled="true" class="usa-input__choices">
-                <div class="form-row">
-                  <div class="form-col form-col--quarter">
-                    <legend>
-                      <div v-bind:class='["usa-input__title-inline", {"environment-name--gray": value === "None" }]'>
-                        {{ environment_data.environment_name.data }}
-                      </div>
-                    </legend>
-                  </div>
-                  <div class="form-col form-col--three-quarters">
-                    {{ environment_data.role(**{"v-model": "value"}) }}
-                  </div>
-                </div>
-              </fieldset>
-            </div>
-          </optionsinput>
-          {{ environment_data.environment_id() }}
-        {% endfor %}
-      </div>
-      <h1>{{ "portfolios.applications.members.new.manage_perms" | translate({"application_name": application.name}) }}</h1>
-      {{ CheckboxInput(new_member_form.permission_sets.perms_team_mgmt, classes="input__inline-fields") }}
-      {% call CheckboxInput(new_member_form.permission_sets.perms_env_mgmt, classes="input__inline-fields") %}
-        {% set field=new_member_form.permission_sets.perms_del_env %}
-        <nestedcheckboxinput
-          name='{{ field.name }}'
-          inline-template
-          key='{{ field.name }}'
-          v-bind:is-parent-checked="isChecked"
-          >
-          <div class="usa-input input__inline-fields input__inline-fields--indented">
-            <fieldset data-ally-disabled="true" class="usa-input__choices usa-input__choices--inline">
-              <legend>
-                <input
-                  id="permission_sets-perms_del_env"
-                  name="permission_sets-perms_del_env"
-                  type="checkbox"
-                  v-model="isChecked"
-                  v-bind:disabled="!$parent.isChecked">
-                {{ field.label | safe }}
-              </legend>
-            </fieldset>
-          </div>
-        </checkboxinput>
-      {% endcall %}
-    </div>
-    <div class='action-group'>
-      <input
-        type="submit"
-        class='action-group__action usa-button'
-        form="add-app-mem"
-        value='Invite member'>
-      <a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">{{ "common.cancel" | translate }}</a>
-      <input
-          type='button'
-          v-on:click="previous()"
-          class='action-group__action usa-button action-group__action--left'
-          value='Previous step'>
-    </div>
-  </div>
-{% endset %}
+{% import "fragments/applications/new_member_modal_content.html" as member_steps %}
+
 {{ MultiStepModalForm(
-    'add-app-mem',
-    new_member_form,
-    url_for("applications.create_member", application_id=application.id),
-    [step_one, step_two],
+    name='add-app-mem',
+    form=new_member_form,
+    form_action=url_for("applications.create_member", application_id=application.id),
+    steps=[
+      member_steps.MemberStepOne(new_member_form),
+      member_steps.MemberStepTwo(new_member_form, application)
+    ],
     button_text=("portfolios.admin.add_new_member" | translate),
     button_icon="plus",
   ) }}
diff --git a/templates/fragments/applications/new_member_modal_content.html b/templates/fragments/applications/new_member_modal_content.html
new file mode 100644
index 00000000..e31c92fe
--- /dev/null
+++ b/templates/fragments/applications/new_member_modal_content.html
@@ -0,0 +1,127 @@
+{% from "components/icon.html" import Icon %}
+{% from "components/text_input.html" import TextInput %}
+{% from "components/checkbox_input.html" import CheckboxInput %}
+
+{% macro MemberStepOne(new_member_form) %}
+  <div class="modal__form--header">
+    <h1>Invite new member</h1>
+  </div>
+  <div class='form-row'>
+    <div class='form-col form-col--half'>
+      {{ TextInput(new_member_form.user_data.first_name, validation='requiredField') }}
+    </div>
+    <div class='form-col form-col--half'>
+      {{ TextInput(new_member_form.user_data.last_name, validation='requiredField') }}
+    </div>
+  </div>
+  <div class='form-row'>
+    <div class='form-col form-col--half'>
+      {{ TextInput(new_member_form.user_data.email, validation='email') }}
+    </div>
+    <div class='form-col form-col--half'>
+      {{ TextInput(new_member_form.user_data.phone_number, validation='usPhone', optional=True) }}
+    </div>
+  </div>
+  <div class='form-row'>
+    <div class='form-col form-col--half'>
+      {{ TextInput(new_member_form.user_data.dod_id, validation='dodId') }}
+    </div>
+    <div class='form-col form-col--half'>
+    </div>
+  </div>
+  <div class='action-group'>
+    <input
+        type='button'
+        v-on:click="next()"
+        v-bind:disabled="invalid"
+        class='action-group__action usa-button'
+        value='Next'>
+    <a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">{{ "common.cancel" | translate }}</a>
+  </div>
+{% endmacro %}
+{% macro MemberStepTwo(new_member_form, application) %}
+  <div class="modal__form">
+    <div class="modal__form--header">
+      <h1>{{ "portfolios.applications.members.new.assign_roles" | translate }}</h1>
+      <a class='icon-link'>
+        {{ Icon('info') }}
+        {{ "portfolios.applications.members.new.learn_more" | translate }}
+      </a>
+      <div class="environment-roles-new">
+        <div class="form-row">
+          <div class="form-col form-col--quarter">
+            <span class="environment-roles-new__head">
+              {{ "common.resource_names.environments" | translate }}:
+            </span>
+          </div>
+          <div class="form-col form-col--three-quarters">
+            <span class="environment-roles-new__head">
+              {{ "common.choose_role" | translate }}:
+            </span>
+          </div>
+        </div>
+        {% for environment_data in new_member_form.environment_roles %}
+          <optionsinput inline-template
+            v-bind:initial-value="'{{ environment_data.role.data | string }}'"
+          >
+            <div class="usa-input">
+              <fieldset data-ally-disabled="true" class="usa-input__choices">
+                <div class="form-row">
+                  <div class="form-col form-col--quarter">
+                    <legend>
+                      <div v-bind:class='["usa-input__title-inline", {"environment-name--gray": value === "None" }]'>
+                        {{ environment_data.environment_name.data }}
+                      </div>
+                    </legend>
+                  </div>
+                  <div class="form-col form-col--three-quarters">
+                    {{ environment_data.role(**{"v-model": "value"}) }}
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </optionsinput>
+          {{ environment_data.environment_id() }}
+        {% endfor %}
+      </div>
+      <h1>{{ "portfolios.applications.members.new.manage_perms" | translate({"application_name": application.name}) }}</h1>
+      {{ CheckboxInput(new_member_form.permission_sets.perms_team_mgmt, classes="input__inline-fields") }}
+      {% call CheckboxInput(new_member_form.permission_sets.perms_env_mgmt, classes="input__inline-fields") %}
+        {% set field=new_member_form.permission_sets.perms_del_env %}
+        <nestedcheckboxinput
+          name='{{ field.name }}'
+          inline-template
+          key='{{ field.name }}'
+          v-bind:is-parent-checked="isChecked"
+          >
+          <div class="usa-input input__inline-fields input__inline-fields--indented">
+            <fieldset data-ally-disabled="true" class="usa-input__choices usa-input__choices--inline">
+              <legend>
+                <input
+                  id="permission_sets-perms_del_env"
+                  name="permission_sets-perms_del_env"
+                  type="checkbox"
+                  v-model="isChecked"
+                  v-bind:disabled="!$parent.isChecked">
+                {{ field.label | safe }}
+              </legend>
+            </fieldset>
+          </div>
+        </checkboxinput>
+      {% endcall %}
+    </div>
+    <div class='action-group'>
+      <input
+        type="submit"
+        class='action-group__action usa-button'
+        form="add-app-mem"
+        value='Invite member'>
+      <a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">{{ "common.cancel" | translate }}</a>
+      <input
+          type='button'
+          v-on:click="previous()"
+          class='action-group__action usa-button action-group__action--left'
+          value='Previous step'>
+    </div>
+  </div>
+{% endmacro %}
diff --git a/templates/portfolios/applications/team.html b/templates/portfolios/applications/team.html
index ed79d259..a9d22924 100644
--- a/templates/portfolios/applications/team.html
+++ b/templates/portfolios/applications/team.html
@@ -4,6 +4,8 @@
 {% from "components/icon.html" import Icon %}
 {% from 'components/save_button.html' import SaveButton %}
 {% from "components/toggle_list.html" import ToggleButton, ToggleSection %}
+{% from "components/multi_step_modal_form.html" import MultiStepModalForm %}
+{% import "fragments/applications/new_member_modal_content.html" as member_steps %}
 
 {% set secondary_breadcrumb = 'portfolios.applications.team_settings.title' | translate({ "application_name": application.name }) %}
 
@@ -11,13 +13,29 @@
   {% if not application.members %}
     {% set user_can_invite = user_can(permissions.CREATE_APPLICATION_MEMBER) %}
 
-    {{ EmptyState(
-      ("portfolios.applications.team_settings.blank_slate.title" | translate),
-      action_label=("portfolios.applications.team_settings.blank_slate.action_label" | translate),
-      action_href='#' if user_can_invite else None,
-      sub_message=None if user_can_invite else ("portfolios.applications.team_settings.blank_slate.sub_message" | translate),
-      icon='avatar'
-    ) }}
+    <div class='empty-state'>
+      <p class='empty-state__message'>{{ ("portfolios.applications.team_settings.blank_slate.title" | translate) }}</p>
+
+      {{ Icon('avatar') }}
+
+      {% if not user_can_invite %}
+        <p class='empty-state__sub-message'>{{ ("portfolios.applications.team_settings.blank_slate.sub_message" | translate) }}</p>
+      {% endif %}
+
+      {% if user_can_invite %}
+        {{ MultiStepModalForm(
+            name='add-app-mem',
+            form=new_member_form,
+            form_action=url_for("applications.create_member", application_id=application.id),
+            steps=[
+              member_steps.MemberStepOne(new_member_form),
+              member_steps.MemberStepTwo(new_member_form, application)
+            ],
+            button_text=("portfolios.applications.team_settings.blank_slate.action_label" | translate),
+            link_classes="usa-button usa-button-big"
+          ) }}
+      {% endif %}
+    </div>
 
   {% else %}
     <div class='subheading'>