diff --git a/src/components/ArticleList.tsx b/src/components/ArticleList.tsx
index 4f9386e..07b8b99 100644
--- a/src/components/ArticleList.tsx
+++ b/src/components/ArticleList.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
-import ArticleRow from './ArticleRow';
-import sanity from '../sanity';
 import '../css/article.css';
+import sanity from '../sanity';
+import ArticleRow from './ArticleRow';
 import BlueButton from './BlueButton';
 import Centered from './Centered';
 
diff --git a/src/components/ArticleRow.tsx b/src/components/ArticleRow.tsx
index 526ea4a..3b826b6 100644
--- a/src/components/ArticleRow.tsx
+++ b/src/components/ArticleRow.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
-import imageUrl from '../lib/imageUrl';
 import '../css/article.css';
+import imageUrl from '../lib/imageUrl';
 import ClickableLink from './ClickableLink';
 import FlexRow from './FlexRow';
 import FlexRowSection from './FlexRowSection';
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index df0385c..f84c980 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,6 +1,6 @@
+import BlockContent from '@sanity/block-content-to-react';
 import React from 'react';
 import '../css/footer.css';
-import BlockContent from '@sanity/block-content-to-react';
 import useFooter from '../hooks/useFooter';
 import Centered from './Centered';
 
diff --git a/src/components/InitiativeColumn.tsx b/src/components/InitiativeColumn.tsx
index 8bc109c..a7c1e93 100644
--- a/src/components/InitiativeColumn.tsx
+++ b/src/components/InitiativeColumn.tsx
@@ -1,6 +1,6 @@
 import BlockContent from '@sanity/block-content-to-react';
-import imageUrl from '../lib/imageUrl';
 import '../css/initiative.css';
+import imageUrl from '../lib/imageUrl';
 
 export default function InitiativeColumn({ name, thumbnail, content }) {
 	let thumbUrl: string | null = null;
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index cb03e5b..166a032 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -1,14 +1,5 @@
-/**
- * Layout component that queries for data
- * with Gatsby's useStaticQuery component
- *
- * See: https://www.gatsbyjs.com/docs/use-static-query/
- */
-
-import React from 'react';
-
-import Navbar from './Navbar';
 import Footer from './Footer';
+import Navbar from './Navbar';
 
 export default function Layout({ children }: { children: React.ReactNode }) {
 	return (
diff --git a/src/components/MemberRow.tsx b/src/components/MemberRow.tsx
index f85b3eb..9b48935 100644
--- a/src/components/MemberRow.tsx
+++ b/src/components/MemberRow.tsx
@@ -1,7 +1,7 @@
-import imageUrl from '../lib/imageUrl';
 import '../css/article.css';
-import RowItemHeader from './RowItemHeader';
+import imageUrl from '../lib/imageUrl';
 import ConstrainedImage from './ConstrainedImage';
+import RowItemHeader from './RowItemHeader';
 import RowItemSubheader from './RowItemSubheader';
 
 export default function MemberRow({
diff --git a/src/components/Mission.tsx b/src/components/Mission.tsx
index 7f74246..948d546 100644
--- a/src/components/Mission.tsx
+++ b/src/components/Mission.tsx
@@ -4,15 +4,12 @@ import useMission from '../hooks/useMission';
 import BlueButtonLink from './BlueButtonLink';
 
 export default function Mission() {
-	let mission = useMission();
-	if (!mission) {
-		return null;
-	}
+	let mission = useMission(); // can be null
 
 	return (
 		<section className='text-center'>
 			<div className='mission-box'>
-				<p className='mission-landing-page-text'>“{mission.vision}”</p>
+				<p className='mission-landing-page-text'>“{mission?.vision}”</p>
 				<BlueButtonLink href='/mission'>Our Mission</BlueButtonLink>
 			</div>
 		</section>
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index a4f5073..709f9d8 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
-import '../css/navbar.css';
 import { Link } from 'react-router-dom';
+import '../css/navbar.css';
 
 let pages = [
 	{
diff --git a/src/components/Segment.tsx b/src/components/Segment.tsx
index 7470a94..cf987bf 100644
--- a/src/components/Segment.tsx
+++ b/src/components/Segment.tsx
@@ -1,23 +1,9 @@
-import '../css/segment.css';
 import BlueButtonLink from './BlueButtonLink';
-
-function SegmentHeader({ children }: { children: React.ReactNode }) {
-	return (
-		<h3
-			style={{
-				margin: '1em 0px',
-				fontSize: '1.75rem',
-				fontWeight: 500,
-			}}
-		>
-			{children}
-		</h3>
-	);
-}
+import SegmentHeader from './SegmentHeader';
 
 export default function Segment({ title, content, imageUrl, infoUrl }) {
 	return (
-		<div className='segment'>
+		<div style={{ textAlign: 'center', padding: '0px 17px' }}>
 			<SegmentHeader>{title}</SegmentHeader>
 			<img src={imageUrl} alt={title} />
 			<p className='strong-paragraph'>{content}</p>
diff --git a/src/components/SegmentHeader.tsx b/src/components/SegmentHeader.tsx
new file mode 100644
index 0000000..7a7680d
--- /dev/null
+++ b/src/components/SegmentHeader.tsx
@@ -0,0 +1,17 @@
+export default function SegmentHeader({
+	children,
+}: {
+	children: React.ReactNode;
+}) {
+	return (
+		<h3
+			style={{
+				margin: '1em 0px',
+				fontSize: '1.75rem',
+				fontWeight: 500,
+			}}
+		>
+			{children}
+		</h3>
+	);
+}
diff --git a/src/css/segment.css b/src/css/segment.css
deleted file mode 100644
index b3af010..0000000
--- a/src/css/segment.css
+++ /dev/null
@@ -1,18 +0,0 @@
-.segment {
-  padding: 0px 17px;
-  text-align: center;
-}
-
-.segment-body {
-  color: #444;
-  font-size: 22px;
-  line-height: 33px;
-  font-weight: 300;
-  text-align: left;
-}
-
-.segment-title {
-  margin: 1em 0px;
-  font-size: 1.75rem;
-  font-weight: 500;
-}
\ No newline at end of file
diff --git a/src/pages/mission.tsx b/src/pages/mission.tsx
index f13643a..e7420d3 100644
--- a/src/pages/mission.tsx
+++ b/src/pages/mission.tsx
@@ -1,10 +1,10 @@
 import React from 'react';
-import Hero from '../components/Hero';
-import useMission from '../hooks/useMission';
-import '../css/mission.css';
 import BlueButtonLink from '../components/BlueButtonLink';
 import Centered from '../components/Centered';
+import Hero from '../components/Hero';
 import ParagraphWithHeader from '../components/ParagraphWithHeader';
+import '../css/mission.css';
+import useMission from '../hooks/useMission';
 import { SGA_PREVIOUS_LEADERSHIP_URL } from '../lib/constants';
 
 function MissionQuote({ text, author }) {
diff --git a/src/pages/newsArticle.tsx b/src/pages/newsArticle.tsx
index bf06611..816831a 100644
--- a/src/pages/newsArticle.tsx
+++ b/src/pages/newsArticle.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 import { useParams } from 'react-router-dom';
+import BlockContentWithExternalLinks from '../components/BlockContentWithExternalLinks';
+import ClickableLink from '../components/ClickableLink';
 import Hero from '../components/Hero';
-import imageUrl from '../lib/imageUrl';
+import PrimaryHeader from '../components/PrimaryHeader';
 import '../css/article.css';
 import useNewsArticle from '../hooks/useNewsArticle';
-import ClickableLink from '../components/ClickableLink';
-import BlockContentWithExternalLinks from '../components/BlockContentWithExternalLinks';
-import PrimaryHeader from '../components/PrimaryHeader';
+import imageUrl from '../lib/imageUrl';
 
 export default function NewsArticle() {
 	let { articleId } = useParams<{ articleId: string }>();
diff --git a/src/pages/officers.tsx b/src/pages/officers.tsx
index 94aab23..71faed5 100644
--- a/src/pages/officers.tsx
+++ b/src/pages/officers.tsx
@@ -23,14 +23,15 @@ export default function Officers() {
 	}, []);
 
 	const officersSorted = sortCommittee(officers ?? [], officerOrder);
-	const officerList = officersSorted.map((officer) => (
-		<MemberRow member={officer} />
-	));
 
 	return (
 		<>
 			<Hero heading='Officers' imageURL='/images/who-we-are/officers.jpg' />
-			<main>{officerList}</main>
+			<main>
+				{officersSorted.map((officer) => (
+					<MemberRow member={officer} />
+				))}
+			</main>
 		</>
 	);
 }