diff --git a/src/routes/CreateNewTeam/components/EditRoleForm/index.jsx b/src/routes/CreateNewTeam/components/EditRoleForm/index.jsx
new file mode 100644
index 00000000..64d9a3de
--- /dev/null
+++ b/src/routes/CreateNewTeam/components/EditRoleForm/index.jsx
@@ -0,0 +1,153 @@
+/**
+ * Edit Role Form
+ * form for eidting details about current role
+ */
+import React, { useEffect, useState } from "react";
+import PT from "prop-types";
+import { Form, Field, useField } from "react-final-form";
+import FormField from "components/FormField";
+import BaseCreateModal from "../BaseCreateModal";
+import Button from "components/Button";
+import MonthPicker from "components/MonthPicker";
+import InformationTooltip from "components/InformationTooltip";
+import IconCrossLight from "../../../../assets/images/icon-cross-light.svg";
+import "./styles.module.scss";
+import NumberInput from "components/NumberInput";
+import {
+  validator,
+  validateExists,
+  validateMin,
+  composeValidators,
+} from "./utils/validator";
+
+const Error = ({ name }) => {
+  const {
+    meta: { dirty, error },
+  } = useField(name, { subscription: { dirty: true, error: true } });
+  return dirty && error ? <span styleName="error">{error}</span> : null;
+};
+
+function EditRoleForm({ submitForm, role }) {
+  const [startMonthVisible, setStartMonthVisible] = useState(false);
+
+  return (
+    <Form
+      onSubmit={submitForm}
+      mutators={{
+        clearField: ([fieldName], state, { changeValue }) => {
+          changeValue(state, fieldName, () => undefined);
+        },
+      }}
+      validate={validator}
+    >
+      {({
+        handleSubmit,
+        hasValidationErrors,
+        form: {
+          mutators: { clearField },
+          getState,
+        },
+      }) => {
+        return (
+          <div styleName="modal-body">
+            <table styleName="table">
+              <tr>
+                <th># of resources</th>
+                <th>Duration (weeks)</th>
+                <th>Start month</th>
+              </tr>
+              <tr styleName="role-row">
+                <td>
+                  <Field
+                    validate={composeValidators(validateExists, validateMin(1))}
+                    name="numberOfResources"
+                    initialValue={role.numberOfResources}
+                  >
+                    {({ input, meta }) => (
+                      <NumberInput
+                        name={input.name}
+                        value={input.value}
+                        onChange={input.onChange}
+                        onBlur={input.onBlur}
+                        onFocus={input.onFocus}
+                        min="1"
+                        error={meta.touched && meta.error}
+                      />
+                    )}
+                  </Field>
+                  <Error name="numberOfResources" />
+                </td>
+                <td>
+                  <Field
+                    validate={composeValidators(validateExists, validateMin(4))}
+                    name="durationWeeks"
+                    initialValue={role.durationWeeks}
+                  >
+                    {({ input, meta }) => (
+                      <NumberInput
+                        name={input.name}
+                        value={input.value}
+                        onChange={input.onChange}
+                        onBlur={input.onBlur}
+                        onFocus={input.onFocus}
+                        min="4"
+                        error={meta.touched && meta.error}
+                      />
+                    )}
+                  </Field>
+                  <Error name="durationWeeks" />
+                </td>
+                <td>
+                  {startMonthVisible ? (
+                    <>
+                      <Field name="startMonth" initialValue={Date.now()}>
+                        {(props) => (
+                          <MonthPicker
+                            name={props.input.name}
+                            value={props.input.value}
+                            onChange={props.input.onChange}
+                            onBlur={props.input.onBlur}
+                            onFocus={props.input.onFocus}
+                          />
+                        )}
+                      </Field>
+                      <Error name="startMonth" />
+                    </>
+                  ) : (
+                    <div styleName="flex-container">
+                      <button
+                        styleName="toggle-button"
+                        onClick={() => setStartMonthVisible(true)}
+                      >
+                        Add Start Month
+                      </button>
+                      <InformationTooltip
+                        iconSize="14px"
+                        text="Requested start month for this position."
+                      />
+                    </div>
+                  )}
+                </td>
+              </tr>
+            </table>
+            <Button
+              type="primary"
+              size="medium"
+              onClick={handleSubmit}
+              disabled={hasValidationErrors}
+            >
+              Save
+            </Button>
+          </div>
+        );
+      }}
+    </Form>
+  );
+}
+
+EditRoleForm.propTypes = {
+  submitForm: PT.func,
+  role: PT.object,
+};
+
+export default EditRoleForm;
diff --git a/src/routes/CreateNewTeam/components/EditRoleModal/styles.module.scss b/src/routes/CreateNewTeam/components/EditRoleForm/styles.module.scss
similarity index 97%
rename from src/routes/CreateNewTeam/components/EditRoleModal/styles.module.scss
rename to src/routes/CreateNewTeam/components/EditRoleForm/styles.module.scss
index 4d303148..1c47d84f 100644
--- a/src/routes/CreateNewTeam/components/EditRoleModal/styles.module.scss
+++ b/src/routes/CreateNewTeam/components/EditRoleForm/styles.module.scss
@@ -91,6 +91,9 @@
 }
 
 .modal-body {
+  > button {
+    margin: 0 auto;
+  }
   overflow-x: auto;
   textarea {
     height: 95px;
diff --git a/src/routes/CreateNewTeam/components/EditRoleModal/utils/validator.js b/src/routes/CreateNewTeam/components/EditRoleForm/utils/validator.js
similarity index 100%
rename from src/routes/CreateNewTeam/components/EditRoleModal/utils/validator.js
rename to src/routes/CreateNewTeam/components/EditRoleForm/utils/validator.js
diff --git a/src/routes/CreateNewTeam/components/EditRoleModal/index.jsx b/src/routes/CreateNewTeam/components/EditRoleModal/index.jsx
deleted file mode 100644
index fa8bdedb..00000000
--- a/src/routes/CreateNewTeam/components/EditRoleModal/index.jsx
+++ /dev/null
@@ -1,165 +0,0 @@
-/**
- * Edit Role Modal
- * Popup form to enter details about current role
- */
-import React, { useEffect, useState } from "react";
-import PT from "prop-types";
-import { Form, Field, useField } from "react-final-form";
-import FormField from "components/FormField";
-import BaseCreateModal from "../BaseCreateModal";
-import Button from "components/Button";
-import MonthPicker from "components/MonthPicker";
-import InformationTooltip from "components/InformationTooltip";
-import IconCrossLight from "../../../../assets/images/icon-cross-light.svg";
-import "./styles.module.scss";
-import NumberInput from "components/NumberInput";
-import { validator, validateExists, validateMin, composeValidators } from "./utils/validator";
-
-const Error = ({ name }) => {
-  const {
-    meta: { dirty, error },
-  } = useField(name, { subscription: { dirty: true, error: true } });
-  return dirty && error ? <span styleName="error">{error}</span> : null;
-};
-
-function EditRoleModal({ open, onClose, submitForm, role }) {
-  const [startMonthVisible, setStartMonthVisible] = useState(false);
-
-  return (
-    <Form
-      onSubmit={submitForm}
-      mutators={{
-        clearField: ([fieldName], state, { changeValue }) => {
-          changeValue(state, fieldName, () => undefined);
-        },
-      }}
-      validate={validator}
-    >
-      {({
-        handleSubmit,
-        hasValidationErrors,
-        form: {
-          mutators: { clearField },
-          getState,
-        },
-      }) => {
-        return (
-          <BaseCreateModal
-            open={open}
-            onClose={onClose}
-            title="Edit Role"
-            subtitle="Please provide your team details before submitting a request."
-            buttons={
-              <Button
-                type="primary"
-                size="medium"
-                onClick={handleSubmit}
-                disabled={hasValidationErrors}
-              >
-                Submit
-              </Button>
-            }
-            disableFocusTrap
-          >
-            <div styleName="modal-body">
-              <table styleName="table">
-                <tr>
-                  <th># of resources</th>
-                  <th>Duration (weeks)</th>
-                  <th>Start month</th>
-                </tr>
-                  <tr styleName="role-row">
-                    <td>
-                      <Field
-                        validate={composeValidators(validateExists, validateMin(1))}
-                        name="numberOfResources"
-                        initialValue={role.numberOfResources}
-                      >
-                        {({ input, meta }) => (
-                          <NumberInput
-                            name={input.name}
-                            value={input.value}
-                            onChange={input.onChange}
-                            onBlur={input.onBlur}
-                            onFocus={input.onFocus}
-                            min="1"
-                            error={meta.touched && meta.error}
-                          />
-                        )}
-                      </Field>
-                      <Error name="numberOfResources" />
-                    </td>
-                    <td>
-                      <Field
-                        validate={composeValidators(validateExists, validateMin(4))}
-                        name="durationWeeks"
-                        initialValue={role.durationWeeks}
-                      >
-                        {({ input, meta }) => (
-                          <NumberInput
-                            name={input.name}
-                            value={input.value}
-                            onChange={input.onChange}
-                            onBlur={input.onBlur}
-                            onFocus={input.onFocus}
-                            min="4"
-                            error={meta.touched && meta.error}
-                          />
-                        )}
-                      </Field>
-                      <Error name="durationWeeks" />
-                    </td>
-                    <td>
-                      {startMonthVisible ? (
-                        <>
-                          <Field
-                            name="startMonth"
-                            initialValue={Date.now()}
-                          >
-                            {(props) => (
-                              <MonthPicker
-                                name={props.input.name}
-                                value={props.input.value}
-                                onChange={props.input.onChange}
-                                onBlur={props.input.onBlur}
-                                onFocus={props.input.onFocus}
-                              />
-                            )}
-                          </Field>
-                          <Error name="startMonth" />
-                        </>
-                      ) : (
-                        <div styleName="flex-container">
-                          <button
-                            styleName="toggle-button"
-                            onClick={() =>
-                              setStartMonthVisible(true)
-                            }
-                          >
-                            Add Start Month
-                          </button>
-                          <InformationTooltip
-                            iconSize="14px"
-                            text="Requested start month for this position."
-                          />
-                        </div>
-                      )}
-                    </td>
-                  </tr>
-              </table>
-            </div>
-          </BaseCreateModal>
-        );
-      }}
-    </Form>
-  );
-}
-
-EditRoleModal.propTypes = {
-  open: PT.bool,
-  onClose: PT.func,
-  submitForm: PT.func,
-  role: PT.object,
-};
-
-export default EditRoleModal;
diff --git a/src/routes/CreateNewTeam/components/ResultCard/index.jsx b/src/routes/CreateNewTeam/components/ResultCard/index.jsx
index a7969eb4..38bd0690 100644
--- a/src/routes/CreateNewTeam/components/ResultCard/index.jsx
+++ b/src/routes/CreateNewTeam/components/ResultCard/index.jsx
@@ -12,6 +12,7 @@ import IconEarthCheck from "../../../../assets/images/icon-earth-check.svg";
 import IconMultipleUsers from "../../../../assets/images/icon-multiple-users.svg";
 import IconMultipleActionsCheck from "../../../../assets/images/icon-multiple-actions-check-2.svg";
 import IconTeamMeetingChat from "../../../../assets/images/icon-team-meeting-chat.svg";
+import EditRoleForm from "../EditRoleForm";
 import Curve from "../../../../assets/images/curve.svg";
 import CircularProgressBar from "../CircularProgressBar";
 import Button from "components/Button";
@@ -26,7 +27,7 @@ function formatPercent(value) {
   return `${Math.round(value * 100)}%`;
 }
 
-function ResultCard({ role }) {
+function ResultCard({ role, currentRole, onSubmitEditRole }) {
   const {
     numberOfMembersAvailable,
     isExternalMember,
@@ -267,7 +268,9 @@ function ResultCard({ role }) {
               <p>Members matched</p>
             </div>
           </div>
-          <div styleName="footer" />
+          {currentRole && (
+            <EditRoleForm role={currentRole} submitForm={onSubmitEditRole} />
+          )}
         </div>
       )}
     </div>
@@ -276,6 +279,8 @@ function ResultCard({ role }) {
 
 ResultCard.propTypes = {
   role: PT.object,
+  currentRole: PT.object,
+  onSubmitEditRole: PT.func,
 };
 
 export default ResultCard;
diff --git a/src/routes/CreateNewTeam/components/SearchContainer/index.jsx b/src/routes/CreateNewTeam/components/SearchContainer/index.jsx
index ee1cd6f0..4529b9c2 100644
--- a/src/routes/CreateNewTeam/components/SearchContainer/index.jsx
+++ b/src/routes/CreateNewTeam/components/SearchContainer/index.jsx
@@ -13,7 +13,6 @@ import AddedRolesAccordion from "../AddedRolesAccordion";
 import Completeness from "../Completeness";
 import SearchCard from "../SearchCard";
 import ResultCard from "../ResultCard";
-import EditRoleModal from '../EditRoleModal'
 import NoMatchingProfilesResultCard from "../NoMatchingProfilesResultCard";
 import { isCustomRole } from "utils/helpers";
 import AddAnotherModal from "../AddAnotherModal";
@@ -59,7 +58,10 @@ function SearchContainer({
 
   const renderLeftSide = () => {
     if (searchState === "searching") return <SearchCard />;
-    if (!isCustomRole(matchingRole)) return <ResultCard role={matchingRole} />;
+    if (!isCustomRole(matchingRole)) return <ResultCard 
+      role={matchingRole} 
+      onSubmitEditRole={onSubmitEditRole}
+      currentRole={currentRole}/>;
     return <NoMatchingProfilesResultCard role={matchingRole} />;
   };
 
@@ -86,12 +88,6 @@ function SearchContainer({
           percentage={getPercentage()}
         />
       </div>
-      {showEditModal && <EditRoleModal
-        role={currentRole}
-        open={showEditModal}
-        onClose={() => setShowEditModal(false)}
-        submitForm={onSubmitEditRole}
-      />}
       <AddAnotherModal
         open={addAnotherOpen}
         onClose={() => setAddAnotherOpen(false)}