diff --git a/packages/app-project/src/screens/ProjectHomePage/components/Hero/Hero.js b/packages/app-project/src/screens/ProjectHomePage/components/Hero/Hero.js
index 7d07e35b4a..6f6e0366a7 100644
--- a/packages/app-project/src/screens/ProjectHomePage/components/Hero/Hero.js
+++ b/packages/app-project/src/screens/ProjectHomePage/components/Hero/Hero.js
@@ -11,16 +11,17 @@ import ContentBox from '../../../../shared/components/ContentBox'
 const StyledContentBox = styled(ContentBox)`
   ${props => (props.screenSize !== 'small') && `
     border-color: transparent;
+    max-height: 763px;
   `}
 `
 
 function Hero (props) {
-  const { className, screenSize, workflows } = props
+  const { screenSize, workflows } = props
 
   // Default to `small` layout
   let component = (
     <Box
-      className={className}
+      align='stretch'
       background={{
         dark: 'dark-1',
         light: 'light-1'
@@ -40,7 +41,7 @@ function Hero (props) {
 
   if (screenSize !== 'small') {
     component = (
-      <Grid className={className} columns={['1.618fr', '1fr']} margin={{ bottom: 'medium' }}>
+      <Grid columns={['1.618fr', '1fr']} margin={{ bottom: 'medium' }}>
         <Background />
         <StyledContentBox
           gap='medium'
diff --git a/packages/app-project/src/screens/ProjectHomePage/components/Hero/components/Background/Background.js b/packages/app-project/src/screens/ProjectHomePage/components/Hero/components/Background/Background.js
index 3017a43ab9..ec37103e73 100644
--- a/packages/app-project/src/screens/ProjectHomePage/components/Hero/components/Background/Background.js
+++ b/packages/app-project/src/screens/ProjectHomePage/components/Hero/components/Background/Background.js
@@ -5,7 +5,6 @@ import styled from 'styled-components'
 
 const Img = styled.img`
   height: 100%;
-  min-height: 61.8vh;
   object-fit: cover;
   object-position: 0 50%;
   width: 100%;