diff --git a/api/src/models/project-update.ts b/api/src/models/project-update.ts
index 7bbf2451f3..b8efb82c24 100644
--- a/api/src/models/project-update.ts
+++ b/api/src/models/project-update.ts
@@ -3,6 +3,25 @@ import { getLogger } from '../utils/logger';
 
 const defaultLog = getLogger('models/project-update');
 
+export class PutIUCNData {
+  classificationDetails: IGetPutIUCN[];
+
+  constructor(obj?: any) {
+    defaultLog.debug({ label: 'PutIUCNData', message: 'params', obj });
+
+    this.classificationDetails =
+      (obj?.classificationDetails?.length &&
+        obj.classificationDetails.map((item: any) => {
+          return {
+            classification: item.classification,
+            subClassification1: item.subClassification1,
+            subClassification2: item.subClassification2
+          };
+        })) ||
+      [];
+  }
+}
+
 export class PutProjectData {
   name: string;
   type: number;
@@ -114,7 +133,7 @@ export class GetPartnershipsData {
   }
 }
 
-interface IGetIUCN {
+interface IGetPutIUCN {
   classification: number;
   subClassification1: number;
   subClassification2: number;
@@ -127,7 +146,7 @@ interface IGetIUCN {
  * @class GetIUCNClassificationData
  */
 export class GetIUCNClassificationData {
-  classificationDetails: IGetIUCN[];
+  classificationDetails: IGetPutIUCN[];
 
   constructor(iucnClassificationData?: any[]) {
     defaultLog.debug({
diff --git a/api/src/paths/project/{projectId}/update.ts b/api/src/paths/project/{projectId}/update.ts
index e1923ba935..abbeaa59d9 100644
--- a/api/src/paths/project/{projectId}/update.ts
+++ b/api/src/paths/project/{projectId}/update.ts
@@ -10,7 +10,8 @@ import {
   PutCoordinatorData,
   PutLocationData,
   PutObjectivesData,
-  PutProjectData
+  PutProjectData,
+  PutIUCNData
 } from '../../../models/project-update';
 import { GetSpeciesData } from '../../../models/project-view-update';
 import {
@@ -24,6 +25,7 @@ import {
   getIndigenousPartnershipsByProjectSQL,
   getIUCNActionClassificationByProjectSQL
 } from '../../../queries/project/project-update-queries';
+import { deleteIUCNSQL } from '../../../queries/project/project-delete-queries';
 import {
   getStakeholderPartnershipsByProjectSQL,
   getFocalSpeciesByProjectSQL,
@@ -31,6 +33,7 @@ import {
 } from '../../../queries/project/project-view-update-queries';
 import { getLogger } from '../../../utils/logger';
 import { logRequest } from '../../../utils/path-utils';
+import { postProjectIUCNSQL } from '../../../queries/project/project-create-queries';
 
 const defaultLog = getLogger('paths/project/{projectId}');
 
@@ -386,6 +389,10 @@ function updateProject(): RequestHandler {
         promises.push(updateProjectData(projectId, entities, connection));
       }
 
+      if (entities?.iucn) {
+        promises.push(updateProjectIUCNData(projectId, entities, connection));
+      }
+
       await Promise.all(promises);
 
       await connection.commit();
@@ -400,6 +407,40 @@ function updateProject(): RequestHandler {
   };
 }
 
+export const updateProjectIUCNData = async (
+  projectId: number,
+  entities: IUpdateProject,
+  connection: IDBConnection
+): Promise<void> => {
+  const putIUCNData = (entities?.iucn && new PutIUCNData(entities.iucn)) || null;
+
+  const sqlDeleteStatement = deleteIUCNSQL(projectId);
+
+  if (!sqlDeleteStatement) {
+    throw new HTTP400('Failed to build SQL statement');
+  }
+
+  const deleteResult = await connection.query(sqlDeleteStatement.text, sqlDeleteStatement.values);
+
+  if (!deleteResult || !deleteResult.rowCount) {
+    throw new HTTP409('Failed to delete project IUCN data');
+  }
+
+  putIUCNData?.classificationDetails.forEach(async (iucnClassification) => {
+    const sqlInsertStatement = postProjectIUCNSQL(iucnClassification.subClassification2, projectId);
+
+    if (!sqlInsertStatement) {
+      throw new HTTP400('Failed to build SQL statement');
+    }
+
+    const insertResult = await connection.query(sqlInsertStatement.text, sqlInsertStatement.values);
+
+    if (!insertResult || !insertResult.rowCount) {
+      throw new HTTP409('Failed to insert project IUCN data');
+    }
+  });
+};
+
 export const updateProjectData = async (
   projectId: number,
   entities: IUpdateProject,
diff --git a/api/src/queries/project/project-delete-queries.test.ts b/api/src/queries/project/project-delete-queries.test.ts
new file mode 100644
index 0000000000..06eb98eac1
--- /dev/null
+++ b/api/src/queries/project/project-delete-queries.test.ts
@@ -0,0 +1,17 @@
+import { expect } from 'chai';
+import { describe } from 'mocha';
+import { deleteIUCNSQL } from './project-delete-queries';
+
+describe('deleteIUCNSQL', () => {
+  it('returns null response when null projectId provided', () => {
+    const response = deleteIUCNSQL((null as unknown) as number);
+
+    expect(response).to.be.null;
+  });
+
+  it('returns non null response when valid projectId provided', () => {
+    const response = deleteIUCNSQL(1);
+
+    expect(response).to.not.be.null;
+  });
+});
diff --git a/api/src/queries/project/project-delete-queries.ts b/api/src/queries/project/project-delete-queries.ts
new file mode 100644
index 0000000000..1d3ad38f48
--- /dev/null
+++ b/api/src/queries/project/project-delete-queries.ts
@@ -0,0 +1,40 @@
+import { SQL, SQLStatement } from 'sql-template-strings';
+import { getLogger } from '../../utils/logger';
+
+const defaultLog = getLogger('queries/project/project-delete-queries');
+
+/**
+ * SQL query to delete project IUCN rows.
+ *
+ * @param {projectId} projectId
+ * @returns {SQLStatement} sql query object
+ */
+export const deleteIUCNSQL = (projectId: number): SQLStatement | null => {
+  defaultLog.debug({
+    label: 'deleteIUCNSQL',
+    message: 'params',
+    projectId
+  });
+
+  if (!projectId) {
+    return null;
+  }
+
+  const sqlStatement: SQLStatement = SQL`
+    DELETE
+      from project_iucn_action_classification
+    WHERE
+      p_id = ${projectId}
+    RETURNING
+      *;
+  `;
+
+  defaultLog.debug({
+    label: 'deleteProjectSQL',
+    message: 'sql',
+    'sqlStatement.text': sqlStatement.text,
+    'sqlStatement.values': sqlStatement.values
+  });
+
+  return sqlStatement;
+};
diff --git a/app/src/features/projects/components/ProjectIUCNForm.tsx b/app/src/features/projects/components/ProjectIUCNForm.tsx
index 3511121e88..6d5cc16343 100644
--- a/app/src/features/projects/components/ProjectIUCNForm.tsx
+++ b/app/src/features/projects/components/ProjectIUCNForm.tsx
@@ -23,9 +23,8 @@ const useStyles = makeStyles((theme) => ({
     overflowX: 'hidden'
   },
   iucnInput: {
-    flex: '1 0 200px',
-    width: '33.333%',
-    maxWidth: '200px'
+    flex: '0 0 auto',
+    width: '33.333%'
   }
 }));
 
@@ -98,8 +97,8 @@ const ProjectIUCNForm: React.FC<IProjectIUCNFormProps> = (props) => {
                 return (
                   <Grid item xs={12} key={index}>
                     <Box display="flex" alignItems="center" mt={-2}>
-                      <Box display="flex" className={classes.iucnInputContainer} flexWrap="wrap">
-                        <Box className={classes.iucnInput} my={2} mr={2}>
+                      <Box display="flex" className={classes.iucnInputContainer}>
+                        <Box className={classes.iucnInput} my={2} pr={2}>
                           <FormControl variant="outlined" fullWidth>
                             <InputLabel id="classification">Classification</InputLabel>
                             <Select
@@ -124,7 +123,7 @@ const ProjectIUCNForm: React.FC<IProjectIUCNFormProps> = (props) => {
                             <FormHelperText>{classificationMeta.error}</FormHelperText>
                           </FormControl>
                         </Box>
-                        <Box className={classes.iucnInput} my={2} mr={2}>
+                        <Box className={classes.iucnInput} my={2} pr={2}>
                           <FormControl variant="outlined" fullWidth>
                             <InputLabel id="subClassification1">Sub-classification</InputLabel>
                             <Select
@@ -152,7 +151,7 @@ const ProjectIUCNForm: React.FC<IProjectIUCNFormProps> = (props) => {
                             <FormHelperText>{subClassification1Meta.error}</FormHelperText>
                           </FormControl>
                         </Box>
-                        <Box my={2} mr={2} className={classes.iucnInput}>
+                        <Box my={2} pr={2} className={classes.iucnInput}>
                           <FormControl variant="outlined" fullWidth>
                             <InputLabel id="subClassification2">Sub-classification</InputLabel>
                             <Select
diff --git a/app/src/features/projects/view/ProjectDetails.test.tsx b/app/src/features/projects/view/ProjectDetails.test.tsx
index 8af59f2cf8..eaff064ffd 100644
--- a/app/src/features/projects/view/ProjectDetails.test.tsx
+++ b/app/src/features/projects/view/ProjectDetails.test.tsx
@@ -24,7 +24,7 @@ describe('ProjectDetails', () => {
 
     const { asFragment } = render(
       <Router history={history}>
-        <ProjectDetails projectForViewData={getProjectForViewResponse} codes={codes} />
+        <ProjectDetails projectForViewData={getProjectForViewResponse} codes={codes} refresh={jest.fn()} />
       </Router>
     );
 
diff --git a/app/src/features/projects/view/ProjectDetails.tsx b/app/src/features/projects/view/ProjectDetails.tsx
index 298207c8b8..e1413b0ce2 100644
--- a/app/src/features/projects/view/ProjectDetails.tsx
+++ b/app/src/features/projects/view/ProjectDetails.tsx
@@ -71,7 +71,7 @@ const ProjectDetails: React.FC<IProjectDetailsProps> = (props) => {
       <Box mb={4}>
         <Paper>
           <Box m={3}>
-            <IUCNClassification projectForViewData={projectForViewData} codes={codes} />
+            <IUCNClassification projectForViewData={projectForViewData} codes={codes} refresh={props.refresh} />
           </Box>
         </Paper>
       </Box>
diff --git a/app/src/features/projects/view/components/IUCNClassification.test.tsx b/app/src/features/projects/view/components/IUCNClassification.test.tsx
index 788c0d289d..0eec7d606a 100644
--- a/app/src/features/projects/view/components/IUCNClassification.test.tsx
+++ b/app/src/features/projects/view/components/IUCNClassification.test.tsx
@@ -2,17 +2,15 @@ import { render, cleanup, waitFor, fireEvent } from '@testing-library/react';
 import { getProjectForViewResponse } from 'test-helpers/project-helpers';
 import React from 'react';
 import IUCNClassification from './IUCNClassification';
-import { createMemoryHistory } from 'history';
-import { Router } from 'react-router-dom';
 import { codes } from 'test-helpers/code-helpers';
 import { useBiohubApi } from 'hooks/useBioHubApi';
-
-const history = createMemoryHistory();
+import { UPDATE_GET_ENTITIES } from 'interfaces/useProjectApi.interface';
 
 jest.mock('../../../../hooks/useBioHubApi');
 const mockUseBiohubApi = {
   project: {
-    getProjectForUpdate: jest.fn<Promise<object>, []>()
+    getProjectForUpdate: jest.fn<Promise<object>, []>(),
+    updateProject: jest.fn()
   }
 };
 
@@ -20,10 +18,19 @@ const mockBiohubApi = ((useBiohubApi as unknown) as jest.Mock<typeof mockUseBioh
   mockUseBiohubApi
 );
 
+const mockRefresh = jest.fn();
+
+const renderContainer = () => {
+  return render(
+    <IUCNClassification projectForViewData={getProjectForViewResponse} codes={codes} refresh={mockRefresh} />
+  );
+};
+
 describe('IUCNClassification', () => {
   beforeEach(() => {
     // clear mocks before each test
     mockBiohubApi().project.getProjectForUpdate.mockClear();
+    mockBiohubApi().project.updateProject.mockClear();
   });
 
   afterEach(() => {
@@ -31,11 +38,7 @@ describe('IUCNClassification', () => {
   });
 
   it('renders correctly', () => {
-    const { asFragment } = render(
-      <Router history={history}>
-        <IUCNClassification projectForViewData={getProjectForViewResponse} codes={codes} />
-      </Router>
-    );
+    const { asFragment } = renderContainer();
 
     expect(asFragment()).toMatchSnapshot();
   });
@@ -53,11 +56,7 @@ describe('IUCNClassification', () => {
       }
     });
 
-    const { getByText } = render(
-      <Router history={history}>
-        <IUCNClassification projectForViewData={getProjectForViewResponse} codes={codes} />
-      </Router>
-    );
+    const { getByText } = renderContainer();
 
     await waitFor(() => {
       expect(getByText('IUCN Classification')).toBeVisible();
@@ -65,6 +64,12 @@ describe('IUCNClassification', () => {
 
     fireEvent.click(getByText('EDIT'));
 
+    await waitFor(() => {
+      expect(mockBiohubApi().project.getProjectForUpdate).toBeCalledWith(getProjectForViewResponse.id, [
+        UPDATE_GET_ENTITIES.iucn
+      ]);
+    });
+
     await waitFor(() => {
       expect(getByText('Edit IUCN Classification')).toBeVisible();
     });
@@ -84,7 +89,20 @@ describe('IUCNClassification', () => {
     fireEvent.click(getByText('Save Changes'));
 
     await waitFor(() => {
-      expect(history.location.pathname).toEqual(`/projects/${getProjectForViewResponse.id}/details`);
+      expect(mockBiohubApi().project.updateProject).toHaveBeenCalledTimes(1);
+      expect(mockBiohubApi().project.updateProject).toBeCalledWith(getProjectForViewResponse.id, {
+        iucn: {
+          classificationDetails: [
+            {
+              classification: 1,
+              subClassification1: 1,
+              subClassification2: 1
+            }
+          ]
+        }
+      });
+
+      expect(mockRefresh).toBeCalledTimes(1);
     });
   });
 
@@ -93,11 +111,7 @@ describe('IUCNClassification', () => {
       iucn: null
     });
 
-    const { getByText } = render(
-      <Router history={history}>
-        <IUCNClassification projectForViewData={getProjectForViewResponse} codes={codes} />
-      </Router>
-    );
+    const { getByText } = renderContainer();
 
     await waitFor(() => {
       expect(getByText('IUCN Classification')).toBeVisible();
diff --git a/app/src/features/projects/view/components/IUCNClassification.tsx b/app/src/features/projects/view/components/IUCNClassification.tsx
index 51f8172f55..cd791123eb 100644
--- a/app/src/features/projects/view/components/IUCNClassification.tsx
+++ b/app/src/features/projects/view/components/IUCNClassification.tsx
@@ -26,7 +26,6 @@ import { ErrorDialog, IErrorDialogProps } from 'components/dialog/ErrorDialog';
 import { useBiohubApi } from 'hooks/useBioHubApi';
 import { Edit } from '@material-ui/icons';
 import { APIError } from 'hooks/api/useAxios';
-import { useHistory } from 'react-router';
 
 const useStyles = makeStyles({
   table: {
@@ -49,6 +48,7 @@ const useStyles = makeStyles({
 export interface IIUCNClassificationProps {
   projectForViewData: IGetProjectForViewResponse;
   codes: IGetAllCodeSetsResponse;
+  refresh: () => void;
 }
 
 /**
@@ -63,7 +63,6 @@ const IUCNClassification: React.FC<IIUCNClassificationProps> = (props) => {
   } = props;
 
   const classes = useStyles();
-  const history = useHistory();
   const biohubApi = useBiohubApi();
 
   const [errorDialogProps, setErrorDialogProps] = useState<IErrorDialogProps>({
@@ -112,9 +111,19 @@ const IUCNClassification: React.FC<IIUCNClassificationProps> = (props) => {
   };
 
   const handleDialogEditSave = async (values: IProjectIUCNForm) => {
-    // make put request from here using values and projectId
-    setOpenEditDialog(false);
-    history.push(`/projects/${id}/details`);
+    const projectData = { iucn: values };
+
+    try {
+      await biohubApi.project.updateProject(id, projectData);
+    } catch (error) {
+      const apiError = new APIError(error);
+      showErrorDialog({ dialogText: apiError.message, open: true });
+      return;
+    } finally {
+      setOpenEditDialog(false);
+    }
+
+    props.refresh();
   };
 
   return (
diff --git a/app/src/features/projects/view/components/ProjectCoordinator.test.tsx b/app/src/features/projects/view/components/ProjectCoordinator.test.tsx
index e1b0ea3678..69151cb504 100644
--- a/app/src/features/projects/view/components/ProjectCoordinator.test.tsx
+++ b/app/src/features/projects/view/components/ProjectCoordinator.test.tsx
@@ -103,4 +103,28 @@ describe('ProjectCoordinator', () => {
       expect(mockRefresh).toBeCalledTimes(1);
     });
   });
+
+  it('displays an error dialog when fetching the update data fails', async () => {
+    mockBiohubApi().project.getProjectForUpdate.mockResolvedValue({
+      coordinator: undefined
+    });
+
+    const { getByText } = renderContainer();
+
+    await waitFor(() => {
+      expect(getByText('Project Coordinator')).toBeVisible();
+    });
+
+    fireEvent.click(getByText('EDIT'));
+
+    await waitFor(() => {
+      expect(getByText('Error Editing Project Coordinator')).toBeVisible();
+    });
+
+    fireEvent.click(getByText('Ok'));
+
+    await waitFor(() => {
+      expect(getByText('Error Editing Project Coordinator')).not.toBeVisible();
+    });
+  });
 });
diff --git a/app/src/themes/appTheme.ts b/app/src/themes/appTheme.ts
index 92fa0e7fda..7ef33bb9e4 100644
--- a/app/src/themes/appTheme.ts
+++ b/app/src/themes/appTheme.ts
@@ -73,8 +73,7 @@ const appTheme = createMuiTheme({
     },
     MuiDialog: {
       paperWidthXl: {
-        maxWidth: '1000px',
-        flexBasis: '41%'
+        maxWidth: '800px'
       }
     },
     MuiDialogTitle: {