diff --git a/components/DiscoverFilterSection/DiscoverFilterSection.js b/components/DiscoverFilterSection/DiscoverFilterSection.js
index 5639b3f4d..eb55f4b4c 100644
--- a/components/DiscoverFilterSection/DiscoverFilterSection.js
+++ b/components/DiscoverFilterSection/DiscoverFilterSection.js
@@ -21,6 +21,8 @@ const DiscoverFilterSection = ({ contentId, title, filter }) => {
     variables: { id: contentId, first: 3 },
   });
 
+  console.log('contentItems', { contentItems });
+
   const content = useDiscoverFilterCategoriesPreview({
     variables: { id: contentId },
   }).contentItems.length;
diff --git a/components/JobForm/index.js b/components/JobForm/index.js
new file mode 100644
index 000000000..967b60a49
--- /dev/null
+++ b/components/JobForm/index.js
@@ -0,0 +1,133 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Box, Button, Checkbox, Icon, Loader, Select, TextInput } from 'ui-kit';
+
+const StyledTextInput = props => (
+  <Box mt="base" width="100%">
+    <TextInput
+      id={props?.id}
+      label={props?.name}
+      placeholder={props?.name}
+      onChange={props?.onChange}
+      value={props?.value}
+    />
+    {props?.errors ? (
+      <Box as="p" color="alert" fontSize="s" mt="s">
+        {props?.errors}
+      </Box>
+    ) : null}
+  </Box>
+);
+
+const StyledCheckBox = props => (
+  <Box display="flex">
+    <Checkbox id={props?.id} size={18} onChange={props?.onChange} mr="s" />
+    <Box as="p" mt="0.1rem">
+      {props?.text}
+    </Box>
+  </Box>
+);
+
+const JobForm = ({
+  handleChange,
+  handleSubmit,
+  isLoading,
+  values,
+  errors,
+  defaultUserCampus,
+  campuses,
+}) => {
+  return (
+    <Box
+      display="flex"
+      flexDirection="column"
+      alignItems="center"
+      mx={{ _: '', md: 'base' }}
+      p={{ _: 'base', md: '' }}
+    >
+      <Box as="h2">Apply for this Job</Box>
+
+      {errors?.generalError ? (
+        <Box as="p" color="alert" fontSize="s" mt="-1.8rem" mb="s">
+          {errors.generalError}
+        </Box>
+      ) : null}
+      {/* General Information */}
+
+      <StyledTextInput
+        id="firstName"
+        name="First Name"
+        onChange={handleChange}
+        value={values?.firstName}
+        errors={errors?.firstName}
+      />
+      <StyledTextInput
+        id="lastName"
+        label="Last Name"
+        name="Last Name"
+        onChange={handleChange}
+        value={values?.lastName}
+        errors={errors?.lastName}
+      />
+      <StyledTextInput
+        id="email"
+        name="Email"
+        onChange={handleChange}
+        value={values?.email}
+        errors={errors?.email}
+      />
+      <StyledTextInput
+        id="phoneNumber"
+        name="Phone"
+        onChange={handleChange}
+        value={values?.phoneNumber}
+        errors={errors?.phoneNumber}
+      />
+      {/* Campus Select */}
+      <Box width="100%" my="base">
+        <Box display="flex" mb="s">
+          <Box fontWeight="bold" fontSize="s" mr="s">
+            Location
+          </Box>
+          {!!isLoading && <Loader noLabel />}
+        </Box>
+        <Box display="flex" alignItems="center">
+          <Select
+            id="campusId"
+            name="campusId"
+            defaultValue={defaultUserCampus?.name}
+            onChange={handleChange}
+          >
+            <Select.Option value={null}>Select a Campus</Select.Option>
+            {campuses?.map(({ id, name }) => {
+              return (
+                <Select.Option key={id} value={name}>
+                  {name}
+                </Select.Option>
+              );
+            })}
+          </Select>
+        </Box>
+        {errors?.campus ? (
+          <Box as="p" color="alert" fontSize="s" mt="s">
+            {errors.campus}
+          </Box>
+        ) : null}
+      </Box>
+
+      {errors?.networkError && (
+        <Box display="flex" alignItems="center" color="alert" mb="s">
+          <Icon name="gear" />
+          Oops! Network error, please try again later.
+        </Box>
+      )}
+      <Button onClick={handleSubmit} borderRadius={50} size="s" px="l">
+        {isLoading ? 'Loading...' : 'SUBMIT'}
+      </Button>
+    </Box>
+  );
+};
+
+JobForm.propTypes = {};
+
+export default JobForm;
diff --git a/components/index.js b/components/index.js
index 41f68e53d..333a25bfd 100644
--- a/components/index.js
+++ b/components/index.js
@@ -42,6 +42,7 @@ import Header from './Header';
 import HeroListFeature from './HeroListFeature';
 import HomeFeed from './HomeFeed';
 import HorizontalCardListFeature from './HorizontalCardListFeature';
+import JobForm from './JobForm';
 import InfoCardList from './InfoCardList';
 import JsonLD from './JsonLD';
 import ContentBlockCollection from './ContentBlockCollection';
@@ -113,6 +114,7 @@ export {
   InfoCardList,
   HomeFeed,
   HorizontalCardListFeature,
+  JobForm,
   JsonLD,
   ContentBlockCollection,
   Layout,
diff --git a/config/careerTestData.js b/config/careerTestData.js
new file mode 100644
index 000000000..c40b15b10
--- /dev/null
+++ b/config/careerTestData.js
@@ -0,0 +1,1386 @@
+const jobData = {
+  absolute_url: 'https://boards.greenhouse.io/christfellowship/jobs/6368003002',
+  data_compliance: [
+    {
+      type: 'gdpr',
+      requires_consent: false,
+      retention_period: null,
+    },
+  ],
+  education: 'education_optional',
+  internal_job_id: 5376072002,
+  location: {
+    name: 'Palm Beach Gardens, Florida ',
+  },
+  metadata: [],
+  id: 6368003002,
+  updated_at: '2022-09-07T12:43:06-04:00',
+  requisition_id: '564',
+  title: 'Barista',
+  content:
+    '&lt;p&gt;&lt;strong&gt;JOB SUMMARY:&lt;/strong&gt;&lt;/p&gt;\n&lt;p&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;The&lt;/span&gt;&lt;strong&gt; Barista&lt;/strong&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt; gets to use food, beverage and people (team) to connect with our customers showing them the love of Christ.&amp;nbsp; Our full-service coffee bar serves top-notch drip coffee, quality espresso beverages and deliciously selected pastries and other treats from local vendors and bakers.&amp;nbsp; Responsibilities for this position include customer interaction at the point-of-sale, preparation of food and beverage items and supporting the development of our volunteer team&lt;/span&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;.&amp;nbsp;&amp;nbsp;&lt;/span&gt;&lt;/p&gt;\n&lt;p&gt;&lt;strong&gt;JOB DUTIES:&lt;/strong&gt;&lt;/p&gt;\n&lt;ul&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Maintaining quality standards for all products sold within the coffee bar (food and beverage)&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Providing exceptional customer service within the coffee bar environment (the experience)&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Supporting the growth and development of our volunteer team (steward 1-2 growth tracks per quarter)&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Ensuring that health and safety regulations regarding food handling and preparation are followed.&amp;nbsp; We will certify you in Food Safety Handling covered under the State of Florida.&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Accepting deliveries and completing delivery paperwork (if required).&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Using the point-of-sale system and enhancing your knowledge of POS with online tutorials.&amp;nbsp;&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Ensuring that all equipment is maintained, clean, and in proficient working condition.&lt;/span&gt;&lt;/li&gt;\n&lt;li style=&quot;font-weight: 400;&quot;&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Maintaining clean display cases and arranging café goods and products so that they are attractive. &lt;/span&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;&lt;br&gt;&lt;br&gt;&lt;/span&gt;&lt;/li&gt;\n&lt;/ul&gt;\n&lt;p&gt;&lt;strong&gt;CERTIFICATES&lt;/strong&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;,&lt;/span&gt;&lt;strong&gt; LICENSES and/or REQUIRED TECHNICAL SKILLS:&lt;/strong&gt;&lt;/p&gt;\n&lt;p&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;SafeServe Certification&lt;/span&gt;&lt;/p&gt;\n&lt;p&gt;&lt;strong&gt;RELEVANT WORK EXPERIENCE:&lt;/strong&gt;&lt;/p&gt;\n&lt;p&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;1-3 years&lt;/span&gt;&lt;/p&gt;\n&lt;p&gt;&lt;strong&gt;JOB SPECS:&lt;/strong&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/p&gt;\n&lt;p&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Classification: Part-time hourly, (non-exempt) - 10 hours per week&amp;nbsp;&lt;/span&gt;&lt;/p&gt;\n&lt;p&gt;&lt;span style=&quot;font-weight: 400;&quot;&gt;Reporting to: Retail Operations Manager&lt;/span&gt;&lt;/p&gt;',
+  departments: [
+    {
+      id: 4030171002,
+      name: 'Cafe',
+      child_ids: [],
+      parent_id: null,
+    },
+  ],
+  offices: [
+    {
+      id: 4015521002,
+      name: 'Palm Beach Gardens',
+      location: 'Palm Beach Gardens, Florida, United States',
+      child_ids: [],
+      parent_id: null,
+    },
+  ],
+};
+
+const departmentData = {
+  departments: [
+    {
+      id: 4030169002,
+      name: 'Bookstore',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030170002,
+      name: 'Business and Finance',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5686865002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5062193002,
+          location: {
+            name: 'Palm Beach Gardens, Florida ',
+          },
+          metadata: [],
+          id: 5686865002,
+          updated_at: '2022-07-18T12:53:04-04:00',
+          requisition_id: '416',
+          title: 'Associate Director of Finance',
+        },
+      ],
+    },
+    {
+      id: 4030171002,
+      name: 'Cafe',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6368003002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5376072002,
+          location: {
+            name: 'Palm Beach Gardens, Florida ',
+          },
+          metadata: [],
+          id: 6368003002,
+          updated_at: '2022-09-07T12:43:06-04:00',
+          requisition_id: '564',
+          title: 'Barista',
+        },
+      ],
+    },
+    {
+      id: 4030172002,
+      name: 'Campus Operations',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6324720002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5356274002,
+          location: {
+            name: 'Westlake, FL',
+          },
+          metadata: [],
+          id: 6324720002,
+          updated_at: '2022-12-01T15:27:32-05:00',
+          requisition_id: '556',
+          title: 'Administrative Assistant (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6268152002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5328627002,
+          location: {
+            name: 'Palm Beach Gardens, FL - Trinity Church Campus',
+          },
+          metadata: [],
+          id: 6268152002,
+          updated_at: '2022-09-29T10:17:26-04:00',
+          requisition_id: '540',
+          title: 'Campus Coordinator',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6493736002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5432712002,
+          location: {
+            name: 'Port St. Lucie, FL',
+          },
+          metadata: [],
+          id: 6493736002,
+          updated_at: '2022-11-16T12:17:46-05:00',
+          requisition_id: '601',
+          title: 'Campus Coordinator',
+        },
+      ],
+    },
+    {
+      id: 4030178002,
+      name: 'Communications',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4029808002,
+      name: 'Connections',
+      parent_id: null,
+      child_ids: [4029809002],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6200095002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5298509002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 6200095002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '516',
+          title: 'Connections Coordinator',
+        },
+      ],
+    },
+    {
+      id: 4030179002,
+      name: 'Creative Ministries',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6475401002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5424330002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6475401002,
+          updated_at: '2022-11-07T09:24:27-05:00',
+          requisition_id: '596',
+          title: 'Executive Project Coordinator',
+        },
+      ],
+    },
+    {
+      id: 4030174002,
+      name: 'Creative Services',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/4883665002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4659583002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 4883665002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '225',
+          title: 'Cinematographer / Editor',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6293212002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5341793002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6293212002,
+          updated_at: '2022-10-05T15:53:01-04:00',
+          requisition_id: '547',
+          title: 'Graphic Designer ',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6213293002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5304195002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 6213293002,
+          updated_at: '2022-08-03T16:11:41-04:00',
+          requisition_id: '519',
+          title: 'Lead Producer',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6334070002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5360818002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 6334070002,
+          updated_at: '2022-09-20T13:08:35-04:00',
+          requisition_id: '557',
+          title: 'Podcast Audio/Video Recording Engineer',
+        },
+      ],
+    },
+    {
+      id: 4029809002,
+      name: 'Dream Team',
+      parent_id: 4029808002,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030181002,
+      name: 'Environments',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4072828002,
+      name: 'Events',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6264865002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5327091002,
+          location: {
+            name: 'Palm Beach Gardens, Florida ',
+          },
+          metadata: [],
+          id: 6264865002,
+          updated_at: '2022-08-31T16:59:34-04:00',
+          requisition_id: '538',
+          title: 'Administrative Associate',
+        },
+      ],
+    },
+    {
+      id: 4030182002,
+      name: 'Facilities',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6407072002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5392745002,
+          location: {
+            name: 'Westlake, Florida',
+          },
+          metadata: [],
+          id: 6407072002,
+          updated_at: '2022-09-30T14:53:00-04:00',
+          requisition_id: '574',
+          title: 'Facilities Coordinator (Part-Time)',
+        },
+      ],
+    },
+    {
+      id: 4030183002,
+      name: 'Family Ministries',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030184002,
+      name: 'Finance',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030185002,
+      name: 'Founding Pastor',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030173002,
+      name: 'Freedom & Care',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030180002,
+      name: 'Groups',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6469213002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5421498002,
+          location: {
+            name: 'Port St. Lucie',
+          },
+          metadata: [],
+          id: 6469213002,
+          updated_at: '2022-11-01T08:50:05-04:00',
+          requisition_id: '592',
+          title: 'Groups Coordinator (Part-Time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6377577002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5380200002,
+          location: {
+            name: 'Royal Palm Beach',
+          },
+          metadata: [],
+          id: 6377577002,
+          updated_at: '2022-10-13T12:44:46-04:00',
+          requisition_id: '566',
+          title: 'Groups Logistics Coordinator',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6437074002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5406188002,
+          location: {
+            name: 'Christ Fellowship Español (CFE)',
+          },
+          metadata: [],
+          id: 6437074002,
+          updated_at: '2022-11-17T10:02:14-05:00',
+          requisition_id: '579',
+          title: 'Groups Logistics Coordinator (Part-Time)',
+        },
+      ],
+    },
+    {
+      id: 4030236002,
+      name: 'Human Resources',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6476177002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5424684002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 6476177002,
+          updated_at: '2022-11-10T13:48:15-05:00',
+          requisition_id: '599',
+          title: 'Human Resources Associate',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6483616002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5427960002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 6483616002,
+          updated_at: '2022-11-10T13:59:05-05:00',
+          requisition_id: '600',
+          title: 'Talent Acquisition Specialist',
+        },
+      ],
+    },
+    {
+      id: 4030237002,
+      name: 'Internship & Resident Program',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030238002,
+      name: 'IT',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5621335002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5033447002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 5621335002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '402',
+          title: 'Senior Systems Engineer',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6213319002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5304208002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 6213319002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '520',
+          title: 'Technical Support Specialist',
+        },
+      ],
+    },
+    {
+      id: 4030175002,
+      name: 'Kids',
+      parent_id: null,
+      child_ids: [4072902002],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6455469002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5414691002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6455469002,
+          updated_at: '2022-10-24T13:29:20-04:00',
+          requisition_id: '585',
+          title: 'Kids Buddy Team & Midweek Discipleship Coordinator',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6468753002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5421255002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6468753002,
+          updated_at: '2022-11-01T08:45:33-04:00',
+          requisition_id: '590',
+          title: 'Kids Care Coordinator',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6027204002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5217224002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6027204002,
+          updated_at: '2022-08-18T14:04:01-04:00',
+          requisition_id: '478',
+          title: 'Kids Coordinator ',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6321652002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5354851002,
+          location: {
+            name: 'Westlake, FL',
+          },
+          metadata: [],
+          id: 6321652002,
+          updated_at: '2022-08-15T10:17:44-04:00',
+          requisition_id: '555',
+          title: 'Kids Coordinator (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6455471002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5414692002,
+          location: {
+            name: 'Christ Fellowship Español (CFE)',
+          },
+          metadata: [],
+          id: 6455471002,
+          updated_at: '2022-11-17T08:07:10-05:00',
+          requisition_id: '586',
+          title: 'Kids Dream Team & Midweek Discipleship Coordinator',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6516338002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5443034002,
+          location: {
+            name: 'Port St. Lucie, FL',
+          },
+          metadata: [],
+          id: 6516338002,
+          updated_at: '2022-12-02T07:34:17-05:00',
+          requisition_id: '606',
+          title: 'Kids Midweek Discipleship Coordinator',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6151687002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5275933002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6151687002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '506',
+          title: 'Kids Welcome & Dream Team Coordinator',
+        },
+      ],
+    },
+    {
+      id: 4072902002,
+      name: 'Kids Care ',
+      parent_id: 4030175002,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5647340002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5044588002,
+          location: {
+            name: 'Boca Raton',
+          },
+          metadata: [],
+          id: 5647340002,
+          updated_at: '2022-08-25T09:08:15-04:00',
+          requisition_id: '410',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5378194002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4922098002,
+          location: {
+            name: 'Belle Glade',
+          },
+          metadata: [],
+          id: 5378194002,
+          updated_at: '2022-07-14T13:24:10-04:00',
+          requisition_id: '355',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6405728002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5392124002,
+          location: {
+            name: 'Christ Fellowship Español (CFE)',
+          },
+          metadata: [],
+          id: 6405728002,
+          updated_at: '2022-11-17T08:08:02-05:00',
+          requisition_id: '571',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5376893002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4921599002,
+          location: {
+            name: 'Boynton Beach',
+          },
+          metadata: [],
+          id: 5376893002,
+          updated_at: '2022-07-14T13:17:01-04:00',
+          requisition_id: '350',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5374806002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4920659002,
+          location: {
+            name: 'Royal Palm Beach',
+          },
+          metadata: [],
+          id: 5374806002,
+          updated_at: '2022-10-26T09:12:23-04:00',
+          requisition_id: '348',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5377473002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4921756002,
+          location: {
+            name: 'Okeechobee',
+          },
+          metadata: [],
+          id: 5377473002,
+          updated_at: '2022-07-14T13:23:45-04:00',
+          requisition_id: '354',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5378225002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4922112002,
+          location: {
+            name: 'Riviera Beach',
+          },
+          metadata: [],
+          id: 5378225002,
+          updated_at: '2022-07-14T13:26:14-04:00',
+          requisition_id: '356',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5376937002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4921609002,
+          location: {
+            name: 'Stuart',
+          },
+          metadata: [],
+          id: 5376937002,
+          updated_at: '2022-08-10T09:17:00-04:00',
+          requisition_id: '351',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5377172002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4921692002,
+          location: {
+            name: 'Vero Beach',
+          },
+          metadata: [],
+          id: 5377172002,
+          updated_at: '2022-07-14T13:23:27-04:00',
+          requisition_id: '352',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5367646002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4917184002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 5367646002,
+          updated_at: '2022-09-28T13:42:44-04:00',
+          requisition_id: '344',
+          title: 'Kids Care Provider (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6405776002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5392147002,
+          location: {
+            name: 'Westlake',
+          },
+          metadata: [],
+          id: 6405776002,
+          updated_at: '2022-09-28T13:41:35-04:00',
+          requisition_id: '572',
+          title: 'Kids Care Provider (Part-time)',
+        },
+      ],
+    },
+    {
+      id: 4030243002,
+      name: 'Leadership College',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4035553002,
+      name: 'Leadership Development',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4075350002,
+      name: 'Married People',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4072065002,
+      name: 'Ministries',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030240002,
+      name: 'Missions',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5133722002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4803458002,
+          location: {
+            name: 'Palm Beach Gardens, Florida ',
+          },
+          metadata: [],
+          id: 5133722002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '278',
+          title: 'Associate Director of Missions',
+        },
+      ],
+    },
+    {
+      id: 4030241002,
+      name: 'Multisite Ministries',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030242002,
+      name: 'Multisite & Weekend Planning',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4069210002,
+      name: 'Online Ministries',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5345703002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4906632002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 5345703002,
+          updated_at: '2022-07-27T09:28:53-04:00',
+          requisition_id: '340',
+          title: 'Online Programming Producer',
+        },
+      ],
+    },
+    {
+      id: 4030239002,
+      name: 'Production',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6460370002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5416915002,
+          location: {
+            name: 'Palm Beach Gardens, Florida ',
+          },
+          metadata: [],
+          id: 6460370002,
+          updated_at: '2022-10-27T09:04:33-04:00',
+          requisition_id: '589',
+          title: 'Administrative Associate',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5304200002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4886613002,
+          location: {
+            name: 'South Florida',
+          },
+          metadata: [],
+          id: 5304200002,
+          updated_at: '2022-09-09T14:26:34-04:00',
+          requisition_id: '321',
+          title: 'Audio Engineer',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5768710002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5098087002,
+          location: {
+            name: 'Palm Beach Gardens ',
+          },
+          metadata: [],
+          id: 5768710002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '437',
+          title: 'Audio Visual Technician',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/4396671002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4329850002,
+          location: {
+            name: 'Palm Beach Gardens ',
+          },
+          metadata: [],
+          id: 4396671002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '91',
+          title: 'Audio Visual Technician (Part-time)',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6189171002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5293545002,
+          location: {
+            name: 'South Florida',
+          },
+          metadata: [],
+          id: 6189171002,
+          updated_at: '2022-09-12T09:34:23-04:00',
+          requisition_id: '511',
+          title: 'Production Assistant',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/4931689002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4688149002,
+          location: {
+            name: 'Palm Beach Gardens ',
+          },
+          metadata: [],
+          id: 4931689002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '233',
+          title: 'Production Graphics Specialist',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5015684002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 4738631002,
+          location: {
+            name: 'South Florida',
+          },
+          metadata: [],
+          id: 5015684002,
+          updated_at: '2022-07-21T12:22:22-04:00',
+          requisition_id: '240',
+          title: 'Production Manager',
+        },
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/5573782002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5012692002,
+          location: {
+            name: 'Palm Beach Gardens',
+          },
+          metadata: [],
+          id: 5573782002,
+          updated_at: '2022-07-12T12:23:17-04:00',
+          requisition_id: '391',
+          title: 'Production Systems Engineer',
+        },
+      ],
+    },
+    {
+      id: 4030244002,
+      name: 'Security',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030245002,
+      name: 'Senior Pastor - JM',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030246002,
+      name: 'Senior Pastor - TM',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030247002,
+      name: 'Sisterhood',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030248002,
+      name: 'Southeastern University - CF SEU',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030249002,
+      name: 'Special Needs',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030250002,
+      name: 'Stewardship',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030176002,
+      name: 'Students',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 4030251002,
+      name: 'Worship',
+      parent_id: null,
+      child_ids: [],
+      jobs: [
+        {
+          absolute_url:
+            'https://boards.greenhouse.io/christfellowship/jobs/6083127002',
+          data_compliance: [
+            {
+              type: 'gdpr',
+              requires_consent: false,
+              retention_period: null,
+            },
+          ],
+          education: 'education_optional',
+          internal_job_id: 5242757002,
+          location: {
+            name: 'Palm Beach Gardens, FL',
+          },
+          metadata: [],
+          id: 6083127002,
+          updated_at: '2022-08-16T11:28:45-04:00',
+          requisition_id: '490',
+          title: 'Worship Leader (Development)',
+        },
+      ],
+    },
+    {
+      id: 4030177002,
+      name: 'Young Adults',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+    {
+      id: 0,
+      name: 'No Department',
+      parent_id: null,
+      child_ids: [],
+      jobs: [],
+    },
+  ],
+};
+
+export { jobData, departmentData };
diff --git a/pages/api/greenhouse.js b/pages/api/greenhouse.js
new file mode 100644
index 000000000..00da863a7
--- /dev/null
+++ b/pages/api/greenhouse.js
@@ -0,0 +1,18 @@
+import fetch from 'node-fetch';
+
+//Grabs data from Greenhouse for our Career Pages
+
+export default async function handler(url) {
+  const baseUrl = 'https://boards-api.greenhouse.io/v1/boards/christfellowship';
+
+  try {
+    const res = await fetch(`${baseUrl}${url}`);
+    if (res.status !== 200) {
+      throw new Error(data.message);
+    }
+    const data = await res.json();
+    return data;
+  } catch {
+    return 'Failed to fetch data from Greenhouse.';
+  }
+}
diff --git a/pages/careers/Careers.styles.js b/pages/careers/Careers.styles.js
new file mode 100644
index 000000000..7e2ca0d7a
--- /dev/null
+++ b/pages/careers/Careers.styles.js
@@ -0,0 +1,31 @@
+// Styling for our CareerPages
+import styled from 'styled-components';
+import { themeGet } from '@styled-system/theme-get';
+import { system } from 'ui-kit';
+
+const CareerPages = styled.div``;
+
+const Hero = styled.div`
+  align-items: center;
+  background-image: linear-gradient(rgba(0, 0, 0, 0.33), rgba(71, 71, 71, 0.85)),
+    url(${props => props.src});
+  background-size: cover;
+  color: white;
+  display: flex;
+  flex-direction: column;
+  min-height: 350px;
+  justify-content: center;
+  margin-bottom: ${themeGet('space.l')};
+  text-align: center;
+  padding: ${themeGet('space.l')} ${themeGet('space.s')};
+
+  @media screen and (min-width: ${themeGet('breakpoints.lg')}) {
+    min-height: 596px;
+  }
+
+  ${system}
+`;
+
+CareerPages.Hero = Hero;
+
+export default CareerPages;
diff --git a/pages/careers/[title].js b/pages/careers/[title].js
new file mode 100644
index 000000000..bda4fdf7f
--- /dev/null
+++ b/pages/careers/[title].js
@@ -0,0 +1,188 @@
+/**
+ * Job Details Page
+ *
+ * This page retrieves and displays all the information for a specific Job from Greenhouse
+ */
+import React, { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import { isString, kebabCase, last, split } from 'lodash';
+import { Layout, NotFound } from 'components';
+import { useRouter } from 'next/router';
+
+import { Box, Button, Card, HtmlRenderer, Icon, Loader } from 'ui-kit';
+import { getCareerPhoto } from 'utils';
+
+import { parseHtmlContent } from 'ui-kit/HtmlRenderer/HtmlRenderer';
+import StyledCardDropdown from 'ui-kit/CardDropdown/CardDropdown.styles';
+import Styled from './Careers.styles';
+import greenhouseAPI from 'pages/api/greenhouse';
+
+const JobDetails = props => {
+  const [jobData, setJobData] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [similarPositions, setSimilarPositions] = useState([]);
+
+  const router = useRouter();
+
+  useEffect(() => {
+    // Fetches Data for Job Page
+    const fetchJob = async () => {
+      setLoading(true);
+      const jobId = last(split(router?.query?.title, '-'));
+      if (jobId !== '') {
+        const job = await greenhouseAPI(`/jobs/${await jobId}`);
+        setJobData(job);
+
+        // Looks for other jobs under same department
+        if (job?.departments?.length > 0) {
+          const department = await greenhouseAPI(
+            `/departments/${job?.departments?.[0]?.id}`
+          );
+          if (department?.jobs?.length > 1) {
+            setSimilarPositions(
+              //filters out current job being displayed
+              department?.jobs?.filter(n => n?.id !== job?.id)
+            );
+          }
+        }
+        setLoading(false);
+      }
+    };
+
+    fetchJob();
+  }, [router]);
+
+  return !loading && isString(jobData) ? (
+    <NotFound />
+  ) : (
+    <Layout>
+      {loading ? (
+        <Box p="xxl" display="flex" justifyContent="center">
+          <Loader />
+        </Box>
+      ) : (
+        <Styled.Hero src={getCareerPhoto(jobData?.departments?.[0]?.name)}>
+          <Box
+            display="flex"
+            flexDirection="column"
+            flex="1"
+            justifyContent="center"
+          >
+            <Box as="h1" fontSize={{ md: '70px' }}>
+              {jobData?.title}
+            </Box>
+            <Box
+              as="h2"
+              fontWeight="normal"
+              px={{ _: 's', sm: '80px', md: '140px', lg: '190px' }}
+              mb="s"
+            >
+              {jobData?.location?.name}
+            </Box>
+          </Box>
+        </Styled.Hero>
+      )}
+
+      <Box display="flex" flexDirection="column" alignItems="center">
+        <Box width="100%" maxWidth={1200}>
+          <Button onClick={() => router.back()} variant="link">
+            <Icon mb="0.15rem" name="angleLeft" color="primary" />
+            Go Back
+          </Button>
+        </Box>
+        <Box
+          display="flex"
+          flexDirection={{ _: 'column', md: 'row' }}
+          maxWidth={1200}
+          justifyContent="space-between"
+          width="100%"
+          p="l"
+          pt="s"
+        >
+          <Box maxWidth={600} my="l">
+            {/* We need to parse the HTML twice in order to render properly */}
+            <HtmlRenderer htmlContent={parseHtmlContent(jobData?.content)} />
+          </Box>
+          <Box maxWidth={400}>
+            <Card p="base" mb="base" width="100%" textAlign="center">
+              {loading ? (
+                <Loader noLabel />
+              ) : (
+                <>
+                  <Box as="h3" my="base">
+                    Do you like what you see?
+                  </Box>
+                  <Button
+                    as="a"
+                    href={`${jobData?.absolute_url}#app`}
+                    target="_blank"
+                  >
+                    Apply Now!
+                  </Button>
+                </>
+              )}
+            </Card>
+
+            <Card p="base" width="100%">
+              <Box as="h4" fontStyle="italic">
+                What's it like working for Christ Fellowship?
+              </Box>
+              <Button
+                as="a"
+                size="s"
+                href="/career-opportunities"
+                mb="base"
+                px="base"
+              >
+                Learn More
+              </Button>
+              <Box as="h4" fontStyle="italic">
+                Looking for something else?
+              </Box>
+              <Button as="a" href="/careers" size="s" px="base">
+                See All Jobs
+              </Button>
+            </Card>
+
+            {similarPositions.length > 0 && (
+              <Card mt="base" p="base" width="100%">
+                <Box as="h3" my="base">
+                  Similar Positions:
+                </Box>
+                <Box>
+                  {loading ? (
+                    <Loader noLabel />
+                  ) : (
+                    similarPositions?.map(job => (
+                      <StyledCardDropdown.CardMenuOption
+                        onClick={() =>
+                          router.push(`${kebabCase(job?.title)}-${job?.id}`)
+                        }
+                        key={job?.id}
+                      >
+                        <Box
+                          textDecoration="none"
+                          color="secondary"
+                          fontWeight="bold"
+                          fontSize="base"
+                          mb="0"
+                        >
+                          {job?.title}
+                        </Box>
+                        <Box>{job?.location?.name}</Box>
+                      </StyledCardDropdown.CardMenuOption>
+                    ))
+                  )}
+                </Box>
+              </Card>
+            )}
+          </Box>
+        </Box>
+      </Box>
+    </Layout>
+  );
+};
+
+JobDetails.propTypes = {};
+
+export default JobDetails;
diff --git a/pages/careers/department/[title].js b/pages/careers/department/[title].js
new file mode 100644
index 000000000..548861f08
--- /dev/null
+++ b/pages/careers/department/[title].js
@@ -0,0 +1,106 @@
+/**
+ * Job Department Page
+ *
+ * This page shows all job listings for a specific department and used for the department that have too many job listings for a dropdown.
+ */
+import React, { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import { isString, kebabCase, last, split } from 'lodash';
+import { CustomLink, Layout, NotFound } from 'components';
+import { useRouter } from 'next/router';
+
+import {
+  Box,
+  Button,
+  CardGrid,
+  Cell,
+  DefaultCard,
+  Icon,
+  Loader,
+  utils,
+} from 'ui-kit';
+import { getCareerPhoto } from 'utils';
+
+import Styled from '../Careers.styles';
+import greenhouseAPI from 'pages/api/greenhouse';
+
+const Department = props => {
+  const [departmentData, setDepartmentData] = useState('loading');
+  const [loading, setLoading] = useState(true);
+
+  const router = useRouter();
+
+  useEffect(() => {
+    const fetchDepartment = async () => {
+      setLoading(true);
+      const departmentId = last(split(router?.query?.title, '-'));
+      if (departmentId !== '') {
+        const department = await greenhouseAPI(
+          `/departments/${await departmentId}`
+        );
+        setDepartmentData(department);
+        setLoading(false);
+      }
+    };
+    fetchDepartment();
+  }, [router]);
+
+  return (
+    <Layout>
+      {loading ? (
+        <Box p="xxl" display="flex" justifyContent="center">
+          <Loader />
+        </Box>
+      ) : (
+        <Styled.Hero src={getCareerPhoto(departmentData?.name)}>
+          <Box
+            display="flex"
+            flexDirection="column"
+            flex="1"
+            justifyContent="center"
+          >
+            <Box as="h1" fontSize={{ md: '70px' }}>
+              {departmentData?.name}
+            </Box>
+          </Box>
+        </Styled.Hero>
+      )}
+
+      <Box width="100%" maxWidth={1200} mx="auto" mb="base">
+        <Button onClick={() => router.back()} variant="link">
+          <Icon mb="0.15rem" name="angleLeft" color="primary" />
+          Go Back
+        </Button>
+      </Box>
+      <Cell as="main" maxWidth={1200} px="base" py="s">
+        {loading ? (
+          <Loader />
+        ) : (
+          <CardGrid columns="3" mx="xs" my="xs" p="xs">
+            {!!isString(departmentData) ? (
+              <Box as="h1"> No Jobs Available</Box>
+            ) : (
+              departmentData?.jobs?.map((job, i) => {
+                return (
+                  <CustomLink
+                    key={i}
+                    Component={DefaultCard}
+                    as="a"
+                    title={job?.title}
+                    description={job?.location?.name}
+                    href={`/careers/${kebabCase(job?.title)}-${job?.id}`}
+                    scaleCard={true}
+                  />
+                );
+              })
+            )}
+          </CardGrid>
+        )}
+      </Cell>
+    </Layout>
+  );
+};
+
+Department.propTypes = {};
+
+export default Department;
diff --git a/pages/careers/index.js b/pages/careers/index.js
new file mode 100644
index 000000000..f370b4978
--- /dev/null
+++ b/pages/careers/index.js
@@ -0,0 +1,106 @@
+/**
+ * Career Menu
+ *
+ * This page retrieves and displays all the departments with Job openings from Greenhouse
+ */
+import React, { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import { Layout } from 'components';
+import {
+  Box,
+  Button,
+  CardGrid,
+  DefaultCard,
+  utils,
+  CardDropdown,
+  Loader,
+} from 'ui-kit';
+import Cell from 'ui-kit/Cell/Cell.styles';
+import { getCareerPhoto } from 'utils';
+import greenhouseAPI from 'pages/api/greenhouse';
+
+import Styled from './Careers.styles';
+import { isString } from 'lodash';
+
+function CareerMenu(props) {
+  const [departmentData, setDepartmentsData] = useState('loading');
+
+  useEffect(() => {
+    const fetchDepartments = async () => {
+      const departments = await greenhouseAPI('/departments');
+      setDepartmentsData(departments);
+    };
+
+    fetchDepartments();
+  }, []);
+
+  return (
+    <Layout>
+      <Styled.Hero src="/careers/careers.jpeg">
+        <Box
+          display="flex"
+          flexDirection="column"
+          flex="1"
+          justifyContent="center"
+        >
+          <Box as="h1" fontSize={{ md: '70px' }}>
+            All Careers
+          </Box>
+        </Box>
+      </Styled.Hero>
+      <Box
+        display="flex"
+        justifyContent="center"
+        alignItems="center"
+        color="secondary"
+      >
+        <Box as="h2" mb="base">
+          Find Your Area
+        </Box>
+      </Box>
+
+      <Cell
+        as="main"
+        maxWidth={utils.rem('1100px')}
+        px="base"
+        py={{ _: 's', lg: 'base' }}
+      >
+        {departmentData === 'loading' ? (
+          <Loader />
+        ) : (
+          <CardGrid columns="3" mx="xs" my="xs" p="xs">
+            {!!isString(departmentData) ? (
+              <Box as="h1"> No Jobs Available</Box>
+            ) : (
+              departmentData.departments.map((department, i) => {
+                return (
+                  department?.jobs?.length > 0 && (
+                    <DefaultCard
+                      key={i}
+                      coverImage={getCareerPhoto(department?.name)}
+                      description={
+                        <CardDropdown
+                          title={department?.name}
+                          items={department?.jobs}
+                          id={department?.id}
+                        />
+                      }
+                      lineLimit="false"
+                      scaleCard={true}
+                      scaleCoverImage={false}
+                      type="HIGHLIGHT_SMALL"
+                    />
+                  )
+                );
+              })
+            )}
+          </CardGrid>
+        )}
+      </Cell>
+    </Layout>
+  );
+}
+
+CareerMenu.propTypes = {};
+
+export default CareerMenu;
diff --git a/public/careers/campus-operations.jpg b/public/careers/campus-operations.jpg
new file mode 100644
index 000000000..d06d5cde5
Binary files /dev/null and b/public/careers/campus-operations.jpg differ
diff --git a/public/careers/careers.jpeg b/public/careers/careers.jpeg
new file mode 100644
index 000000000..13c1fccb9
Binary files /dev/null and b/public/careers/careers.jpeg differ
diff --git a/public/careers/central-operations.jpg b/public/careers/central-operations.jpg
new file mode 100644
index 000000000..a354126fd
Binary files /dev/null and b/public/careers/central-operations.jpg differ
diff --git a/public/careers/discipleship-ministries.jpg b/public/careers/discipleship-ministries.jpg
new file mode 100644
index 000000000..7617cae91
Binary files /dev/null and b/public/careers/discipleship-ministries.jpg differ
diff --git a/public/careers/family-ministries.jpg b/public/careers/family-ministries.jpg
new file mode 100644
index 000000000..665ad8d81
Binary files /dev/null and b/public/careers/family-ministries.jpg differ
diff --git a/public/careers/internship-and-resident-program.jpg b/public/careers/internship-and-resident-program.jpg
new file mode 100644
index 000000000..b40cfa4f5
Binary files /dev/null and b/public/careers/internship-and-resident-program.jpg differ
diff --git a/public/careers/marketing-and-communications .jpg b/public/careers/marketing-and-communications .jpg
new file mode 100644
index 000000000..c2d4d9bec
Binary files /dev/null and b/public/careers/marketing-and-communications .jpg differ
diff --git a/public/careers/marketing-and-communications-3.jpg b/public/careers/marketing-and-communications-3.jpg
new file mode 100644
index 000000000..57b9653ed
Binary files /dev/null and b/public/careers/marketing-and-communications-3.jpg differ
diff --git a/public/careers/missions.jpg b/public/careers/missions.jpg
new file mode 100644
index 000000000..60a0ed047
Binary files /dev/null and b/public/careers/missions.jpg differ
diff --git a/public/careers/online-ministries.jpg b/public/careers/online-ministries.jpg
new file mode 100644
index 000000000..f143e4080
Binary files /dev/null and b/public/careers/online-ministries.jpg differ
diff --git a/public/careers/production.jpg b/public/careers/production.jpg
new file mode 100644
index 000000000..0681c7a99
Binary files /dev/null and b/public/careers/production.jpg differ
diff --git a/public/careers/worship.jpg b/public/careers/worship.jpg
new file mode 100644
index 000000000..52a123ef1
Binary files /dev/null and b/public/careers/worship.jpg differ
diff --git a/ui-kit/Card/Card.styles.js b/ui-kit/Card/Card.styles.js
index 696e38c56..1b6a89d4c 100644
--- a/ui-kit/Card/Card.styles.js
+++ b/ui-kit/Card/Card.styles.js
@@ -6,53 +6,75 @@ import { system } from 'ui-kit';
 const DEFAULT_COVER_HEIGHT = '250px';
 const HERO_COVER_HEIGHT = '350px';
 
-const link = ({ as }) => props => {
-  if (as === 'a') {
-    return css`
-      cursor: pointer;
-      text-decoration: none;
-      transition: 0.2s ease-in-out;
-
-      &:focus,
-      &:hover {
-        box-shadow: ${themeGet('shadows.xxl')};
-        transform: scale(1.02);
-      }
-
-      &:active {
-        transform: scale(1);
-      }
-    `;
-  }
-};
+const link =
+  ({ as }) =>
+  props => {
+    if (as === 'a') {
+      return css`
+        cursor: pointer;
+        text-decoration: none;
+        transition: 0.2s ease-in-out;
+
+        &:focus,
+        &:hover {
+          box-shadow: ${themeGet('shadows.xxl')};
+          transform: scale(1.02);
+        }
+
+        &:active {
+          transform: scale(1);
+        }
+      `;
+    }
+  };
 
-const scaleLink = ({ scaleCard }) => props => {
-  // Does not scale card if prop set to false
-  if (scaleCard === false) {
-    return css`
-      &:focus,
-      &:hover {
-        transform: none;
-      }
+const scaleLink =
+  ({ scaleCard }) =>
+  props => {
+    // Does not scale card if prop set to false
+    if (scaleCard === false) {
+      return css`
+        &:focus,
+        &:hover {
+          transform: none;
+        }
+
+        &:active {
+          transform: none;
+        }
+      `;
+    }
+  };
 
-      &:active {
-        transform: none;
-      }
-    `;
-  }
-};
+const removeBoxShadow =
+  ({ boxShadow }) =>
+  props => {
+    // Removes box-shadow on hover if box-shadow is set to none
+    if (boxShadow === 'none') {
+      return css`
+        &:focus,
+        &:hover {
+          box-shadow: none;
+        }
+      `;
+    }
+  };
 
-const removeBoxShadow = ({ boxShadow }) => props => {
-  // Removes box-shadow on hover if box-shadow is set to none
-  if (boxShadow === 'none') {
-    return css`
-      &:focus,
-      &:hover {
-        box-shadow: none;
-      }
-    `;
-  }
-};
+const lineLimit =
+  ({ lineLimit }) =>
+  props => {
+    // Removes box-shadow on hover if box-shadow is set to none
+    if (lineLimit === true) {
+      return css`
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+      `;
+    } else {
+      return css``;
+    }
+  };
 
 const Card = styled.div`
   background-color: ${themeGet('colors.paper')};
@@ -79,67 +101,73 @@ const Content = styled.div`
   ${system}
 `;
 
-const content = ({ hasContent }) => props => {
-  if (hasContent) {
-    return css`
-      border-top-left-radius: ${themeGet('radii.base')};
-      border-top-right-radius: ${themeGet('radii.base')};
-      height: ${props =>
-        props.height ||
-        (props.largeCard ? HERO_COVER_HEIGHT : DEFAULT_COVER_HEIGHT)};
-    `;
-  }
-
-  return css`
-    border-radius: ${themeGet('radii.base')};
-    height: 100%;
-  `;
-};
+const content =
+  ({ hasContent }) =>
+  props => {
+    if (hasContent) {
+      return css`
+        border-top-left-radius: ${themeGet('radii.base')};
+        border-top-right-radius: ${themeGet('radii.base')};
+        height: ${props =>
+          props.height ||
+          (props.largeCard ? HERO_COVER_HEIGHT : DEFAULT_COVER_HEIGHT)};
+      `;
+    }
 
-const overlay = ({ overlay }) => props => {
-  if (overlay) {
     return css`
-      &::after {
-        background: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 0),
-          ${themeGet('colors.fg')}
-        );
-        bottom: 0;
-        content: '';
-        height: 100%;
-        left: 0;
-        opacity: 0.8;
-        position: absolute;
-        right: 0;
-        top: 0;
-        width: 100%;
-        z-index: 1;
-      }
+      border-radius: ${themeGet('radii.base')};
+      height: 100%;
     `;
-  }
-};
+  };
 
-const scaleCover = ({ scaleCoverImage }) => props => {
-  // Scales Cover Image of card if prop set to true
-  if (scaleCoverImage) {
-    return css`
-      transform: scale(1);
-      transition: 0.2s ease-in-out;
-
-      &:focus,
-      &:hover {
-        transform: scale(1.02);
-        transition: 0.2s ease-out;
-      }
+const overlay =
+  ({ overlay }) =>
+  props => {
+    if (overlay) {
+      return css`
+        &::after {
+          background: linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 0),
+            ${themeGet('colors.fg')}
+          );
+          bottom: 0;
+          content: '';
+          height: 100%;
+          left: 0;
+          opacity: 0.8;
+          position: absolute;
+          right: 0;
+          top: 0;
+          width: 100%;
+          z-index: 1;
+        }
+      `;
+    }
+  };
 
-      &:active {
+const scaleCover =
+  ({ scaleCoverImage }) =>
+  props => {
+    // Scales Cover Image of card if prop set to true
+    if (scaleCoverImage) {
+      return css`
         transform: scale(1);
-        transition: 0.2s ease-out;
-      }
-    `;
-  }
-};
+        transition: 0.2s ease-in-out;
+
+        &:focus,
+        &:hover {
+          transform: scale(1.02);
+          transition: 0.2s ease-out;
+        }
+
+        &:active {
+          transform: scale(1);
+          transition: 0.2s ease-out;
+        }
+      `;
+    }
+  };
 
 const Cover = styled.div`
   align-items: flex-end;
@@ -160,32 +188,34 @@ const Cover = styled.div`
   ${system}
 `;
 
-const position = ({ position, size }) => props => {
-  if (position === 'bottomLeft') {
-    if (size === 's') {
+const position =
+  ({ position, size }) =>
+  props => {
+    if (position === 'bottomLeft') {
+      if (size === 's') {
+        return css`
+          padding: ${themeGet('space.base')};
+        `;
+      }
       return css`
-        padding: ${themeGet('space.base')};
-      `;
-    }
-    return css`
-      /* backdrop-filter: blur(30px);
+        /* backdrop-filter: blur(30px);
       background-color: rgba(255, 255, 255, 0.15); */
-      padding: ${themeGet('space.s')};
+        padding: ${themeGet('space.s')};
 
-      @media screen and (min-width: ${themeGet('breakpoints.md')}) {
-        padding: ${themeGet('space.base')};
-      }
-    `;
-  } else if (position === 'center') {
-    return css`
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      align-content: center;
-      height: 100%;
-    `;
-  }
-};
+        @media screen and (min-width: ${themeGet('breakpoints.md')}) {
+          padding: ${themeGet('space.base')};
+        }
+      `;
+    } else if (position === 'center') {
+      return css`
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        align-content: center;
+        height: 100%;
+      `;
+    }
+  };
 
 const CoverContent = styled.div`
   border-bottom-left-radius: ${themeGet('radii.base')};
@@ -198,7 +228,7 @@ const CoverContent = styled.div`
 `;
 
 const CoverLabel = styled.b`
-  background-color: ${themeGet('colors.primary')};;
+  background-color: ${themeGet('colors.primary')};
   backdrop-filter: blur(25px);
   box-shadow: ${themeGet('shadows.l')};
   border-radius: ${themeGet('radii.xxl')};
@@ -216,11 +246,7 @@ const CoverLabel = styled.b`
 `;
 
 const Description = styled.p`
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-
+  ${lineLimit}
   ${system}
 `;
 
diff --git a/ui-kit/CardDropdown/CardDropdown.styles.js b/ui-kit/CardDropdown/CardDropdown.styles.js
new file mode 100644
index 000000000..2a5162fd6
--- /dev/null
+++ b/ui-kit/CardDropdown/CardDropdown.styles.js
@@ -0,0 +1,33 @@
+// Styling for our CardDropdown
+import styled from 'styled-components';
+import { themeGet } from '@styled-system/theme-get';
+import { system } from 'ui-kit';
+
+const CardDropdown = styled.div``;
+
+const CardMenu = styled.div`
+  z-index: 1;
+  background-color: ${themeGet('colors.white')};
+  position: absolute;
+  border-radius: ${themeGet('radii.base')};
+  box-shadow: ${themeGet('shadows.base')} ${system};
+
+  ${system}
+`;
+
+const CardMenuOption = styled.div`
+  padding: ${themeGet('space.base')};
+
+  cursor: pointer;
+
+  &:hover {
+    background-color: ${themeGet('colors.neutrals.200')};
+  }
+
+  ${system}
+`;
+
+CardDropdown.CardMenu = CardMenu;
+CardDropdown.CardMenuOption = CardMenuOption;
+
+export default CardDropdown;
diff --git a/ui-kit/CardDropdown/index.js b/ui-kit/CardDropdown/index.js
new file mode 100644
index 000000000..ae968d74d
--- /dev/null
+++ b/ui-kit/CardDropdown/index.js
@@ -0,0 +1,83 @@
+/**
+ * This component was created for the /career page and allows us to pass a dropdown menu in the DefaultCard component.
+ */
+
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { Box, Icon } from 'ui-kit';
+
+import Styled from './CardDropdown.styles';
+import { useRouter } from 'next/router';
+import { kebabCase } from 'lodash';
+
+const CardDropdown = props => {
+  const [menuOpen, setMenuOpen] = useState(false);
+  const menuItems = props?.items;
+
+  const router = useRouter();
+
+  // We don't want to show more than 7 items, so we'll chunk the array and then display all on a separate page
+  let itemsChunk = menuItems?.slice(0, 6);
+  if (props?.items?.length > 7) {
+    itemsChunk?.push({
+      title: 'See All',
+      url: `/careers/department/${kebabCase(props?.title)}-${props?.id}`,
+    });
+  }
+
+  return (
+    <Box bg="white">
+      <Box
+        as="a"
+        cursor="pointer"
+        display="flex"
+        width="100%"
+        justifyContent="center"
+        alignItems="center"
+        onClick={() => setMenuOpen(!menuOpen)}
+      >
+        <Box as="h3" color="neutrals.800" mb="0">
+          {props?.title}
+        </Box>
+        <Icon
+          name={menuOpen ? 'angle-up' : 'angle-down'}
+          color="neutrals.800"
+        />
+      </Box>
+      {menuOpen && (
+        <Styled.CardMenu
+          onMouseLeave={() => setMenuOpen(false)}
+          width={{ _: 260, sm: 500, md: 278, lg: 333 }}
+          ml={{ _: '-0.6rem', md: '-1.25rem' }}
+          mt="s"
+        >
+          {itemsChunk?.map(({ id, title, location, url }) => (
+            <Styled.CardMenuOption
+              onClick={() => {
+                title === 'See All'
+                  ? router.push(url)
+                  : router.push(`/careers/${kebabCase(title)}-${id}`);
+              }}
+              key={id}
+            >
+              <Box
+                textDecoration="none"
+                color="secondary"
+                fontWeight="bold"
+                fontSize="base"
+                mb="0"
+              >
+                {title}
+              </Box>
+              <Box>{location?.name}</Box>
+            </Styled.CardMenuOption>
+          ))}
+        </Styled.CardMenu>
+      )}
+    </Box>
+  );
+};
+
+CardDropdown.propTypes = {};
+
+export default CardDropdown;
diff --git a/ui-kit/DefaultCard/DefaultCard.js b/ui-kit/DefaultCard/DefaultCard.js
index ba9a00e70..9b2c3a531 100644
--- a/ui-kit/DefaultCard/DefaultCard.js
+++ b/ui-kit/DefaultCard/DefaultCard.js
@@ -62,7 +62,11 @@ const DefaultCard = (props = {}) => {
           </Box>
         ) : null}
         {props.description ? (
-          <Styled.Description color="neutrals.600" fontSize="s">
+          <Styled.Description
+            color="neutrals.600"
+            fontSize="s"
+            lineLimit={props?.lineLimit}
+          >
             {props.description}
           </Styled.Description>
         ) : null}
@@ -92,6 +96,7 @@ DefaultCard.defaultProps = {
   coverImageContentPosition: 'bottomLeft',
   coverImageOverlay: false,
   largeCard: false,
+  lineLimit: true,
 };
 
 export default DefaultCard;
diff --git a/ui-kit/HtmlRenderer/HtmlRenderer.js b/ui-kit/HtmlRenderer/HtmlRenderer.js
index 83c62a078..56e53168f 100644
--- a/ui-kit/HtmlRenderer/HtmlRenderer.js
+++ b/ui-kit/HtmlRenderer/HtmlRenderer.js
@@ -56,6 +56,29 @@ const HtmlRenderer = ({ htmlContent, customProcessing }) => {
   return <Styled>{parsedHtmlContent}</Styled>;
 };
 
+export const parseHtmlContent = htmlContent => {
+  const processNodeDefinitions = new HtmlToReact.ProcessNodeDefinitions(React);
+
+  const processingInstructions = [
+    ...defaultProcessing,
+    {
+      // Anything else
+      shouldProcessNode: function (node) {
+        return true;
+      },
+      processNode: processNodeDefinitions.processDefaultNode,
+    },
+  ];
+
+  const parsedHtmlContent = htmlToReactParser.parseWithInstructions(
+    htmlContent,
+    isValidNode,
+    processingInstructions
+  );
+
+  return parsedHtmlContent;
+};
+
 HtmlRenderer.propTypes = {
   htmlContent: PropTypes.string.isRequired,
   customProcessing: PropTypes.array,
diff --git a/ui-kit/_config/icons.js b/ui-kit/_config/icons.js
index 1f069ba07..11bd80152 100644
--- a/ui-kit/_config/icons.js
+++ b/ui-kit/_config/icons.js
@@ -1,8 +1,12 @@
 const icons = {
+  angleDown:
+    'M11.5781 16.3125C11.8125 16.5469 12.1406 16.5469 12.375 16.3125L19.3125 9.42188C19.5469 9.23438 19.5469 8.85938 19.3125 8.625L18.375 7.73438C18.1875 7.5 17.8125 7.5 17.5781 7.73438L12 13.2656L6.375 7.73438C6.14062 7.5 5.8125 7.5 5.57812 7.73438L4.64062 8.625C4.40625 8.85938 4.40625 9.23438 4.64062 9.42188L11.5781 16.3125Z',
   angleLeft:
     'M7.6875 11.625C7.45312 11.8594 7.45312 12.1875 7.6875 12.4219L14.5781 19.3594C14.7656 19.5938 15.1406 19.5938 15.375 19.3594L16.2656 18.4219C16.5 18.1875 16.5 17.8594 16.2656 17.625L10.7344 12L16.2656 6.42188C16.5 6.1875 16.5 5.8125 16.2656 5.625L15.375 4.6875C15.1406 4.45312 14.7656 4.45312 14.5781 4.6875L7.6875 11.625Z',
   angleRight:
     'M16.2656 12.4219C16.5 12.1875 16.5 11.8594 16.2656 11.625L9.42188 4.6875C9.1875 4.45312 8.8125 4.45312 8.625 4.6875L7.6875 5.625C7.45312 5.8125 7.45312 6.1875 7.6875 6.42188L13.2188 12L7.6875 17.625C7.45312 17.8594 7.45312 18.1875 7.6875 18.4219L8.625 19.3594C8.8125 19.5938 9.1875 19.5938 9.42188 19.3594L16.2656 12.4219Z',
+  angleUp:
+    'M12.375 7.73438C12.1406 7.5 11.8125 7.5 11.5781 7.73438L4.64062 14.5781C4.40625 14.8125 4.40625 15.1875 4.64062 15.375L5.57812 16.3125C5.8125 16.5469 6.14062 16.5469 6.375 16.3125L12 10.7812L17.5781 16.3125C17.8125 16.5469 18.1875 16.5469 18.375 16.3125L19.3125 15.375C19.5469 15.1875 19.5469 14.8125 19.3125 14.5781L12.375 7.73438Z',
   apple:
     'M17.291 12.4834C17.291 10.9297 18.0049 9.7959 19.3906 8.91406C18.5928 7.78027 17.417 7.19238 15.8633 7.06641C14.3516 6.94043 12.7139 7.90625 12.126 7.90625C11.4961 7.90625 10.0684 7.1084 8.93457 7.1084C6.58301 7.15039 4.10547 8.95605 4.10547 12.6934C4.10547 13.7852 4.27344 14.9189 4.69336 16.0947C5.23926 17.6484 7.1709 21.4277 9.18652 21.3438C10.2363 21.3438 10.9922 20.5879 12.3779 20.5879C13.7217 20.5879 14.3936 21.3438 15.5693 21.3438C17.627 21.3438 19.3906 17.9004 19.8945 16.3467C17.165 15.0449 17.291 12.5674 17.291 12.4834ZM14.9395 5.59668C16.0732 4.25293 15.9473 2.99316 15.9473 2.53125C14.9395 2.61523 13.7637 3.24512 13.0918 4.00098C12.3359 4.84082 11.916 5.89062 12 7.02441C13.0918 7.1084 14.0996 6.5625 14.9395 5.59668Z',
   bell: 'M21.5283 16.689C20.7305 15.8071 19.1768 14.5054 19.1768 10.1802C19.1768 6.94678 16.9092 4.34326 13.8018 3.67139V2.78955C13.8018 2.07568 13.2139 1.4458 12.5 1.4458C11.7441 1.4458 11.1562 2.07568 11.1562 2.78955V3.67139C8.04885 4.34326 5.78127 6.94678 5.78127 10.1802C5.78127 14.5054 4.22756 15.8071 3.42971 16.689C3.17775 16.9409 3.05178 17.2769 3.09377 17.5708C3.09377 18.2847 3.59768 18.9145 4.43752 18.9145H20.5205C21.3604 18.9145 21.8643 18.2847 21.9062 17.5708C21.9062 17.2769 21.7803 16.9409 21.5283 16.689ZM5.90725 16.8989C6.78908 15.7651 7.7549 13.7915 7.7969 10.2222C7.7969 10.2222 7.7969 10.2222 7.7969 10.1802C7.7969 7.61865 9.8965 5.47705 12.5 5.47705C15.0615 5.47705 17.2031 7.61865 17.2031 10.1802C17.2031 10.2222 17.1611 10.2222 17.1611 10.2222C17.2031 13.7915 18.1689 15.7651 19.0508 16.8989H5.90725ZM12.5 22.9458C13.9697 22.9458 15.1455 21.77 15.1455 20.2583H9.81252C9.81252 21.77 10.9883 22.9458 12.5 22.9458Z',
diff --git a/ui-kit/index.js b/ui-kit/index.js
index 310dec829..630f304fb 100644
--- a/ui-kit/index.js
+++ b/ui-kit/index.js
@@ -14,18 +14,19 @@ import Box from './Box';
 import Button from './Button';
 import Card from './Card';
 import CardCarousel from './CardCarousel';
+import CardDropdown from './CardDropdown';
 import CardGrid from './CardGrid';
 import Cell from './Cell';
 import Checkbox from './Checkbox';
 import ContentBlock from './ContentBlock';
-import CoverImage from './CoverImage'
+import CoverImage from './CoverImage';
 import DefaultCard from './DefaultCard';
 import Divider from './Divider';
 import FormLabel from './FormLabel';
 import GroupCard from './GroupCard';
 import GroupMemberStatusBadge from './GroupMemberStatusBadge';
 import HorizontalHighlightCard from './HorizontalHighlightCard';
-import HtmlRenderer from './HtmlRenderer'
+import HtmlRenderer from './HtmlRenderer';
 import Icon from './Icon';
 import Image from './Image';
 import List from './List';
@@ -59,6 +60,7 @@ export {
   Button,
   Card,
   CardCarousel,
+  CardDropdown,
   CardGrid,
   Cell,
   Checkbox,
diff --git a/utils/getCareerPhoto.js b/utils/getCareerPhoto.js
new file mode 100644
index 000000000..75a4fb91d
--- /dev/null
+++ b/utils/getCareerPhoto.js
@@ -0,0 +1,28 @@
+import { camelCase } from 'lodash';
+
+const photos = {
+  businessAndFinance: '/careers/campus-operations.jpeg',
+  cafe: '/location-pages/belle-glade-background.png',
+  campusOperations: '/external-landing/new-here-1.jpeg',
+  centralOperations: '/careers/central-operations.jpg',
+  creative: '',
+  discipleshipMinistries: '/careers/discipleship-ministries.jpg',
+  events: '',
+  kids: '',
+  kidsCare: '',
+  missions: '/careers/missions.jpg',
+  onlineMinistries: '/careers/online-ministries.jpg',
+  production: '/careers/production.jpg',
+  cfSeu: '',
+  specialNeeds: '',
+};
+
+const getCareerPhoto = name => {
+  //Grabs Photo for Department
+  const deptPhoto = photos[camelCase(name)];
+  const defaultPhoto = '/careers/careers.jpeg';
+
+  return deptPhoto ? deptPhoto : defaultPhoto;
+};
+
+export default getCareerPhoto;
diff --git a/utils/index.js b/utils/index.js
index a5dd3c6e3..6c5fd3441 100644
--- a/utils/index.js
+++ b/utils/index.js
@@ -5,6 +5,7 @@ import dateTextFormat from './dateTextFormat';
 import formatPhoneNumber from './formatPhoneNumber';
 import getAge from './getAge';
 import getComponent from './getComponent';
+import getCareerPhoto from './getCareerPhoto';
 import getMediaType from './getMediaType';
 import getUrlFromRelatedNode from './getUrlFromRelatedNode';
 import getURLFromType from './getURLFromType';
@@ -25,6 +26,7 @@ export {
   formatPhoneNumber,
   getAge,
   getComponent,
+  getCareerPhoto,
   getMediaType,
   getUrlFromRelatedNode,
   getURLFromType,