diff --git a/static/img/mobile-hero-vector.svg b/static/img/mobile-hero-vector.svg
new file mode 100644
index 0000000..22a4e44
--- /dev/null
+++ b/static/img/mobile-hero-vector.svg
@@ -0,0 +1,10 @@
+
+
+
+
+
+
diff --git a/views/blocks/homepage-hero/homepage-hero.css b/views/blocks/homepage-hero/homepage-hero.css
index 00e4efb..cb6d5df 100644
--- a/views/blocks/homepage-hero/homepage-hero.css
+++ b/views/blocks/homepage-hero/homepage-hero.css
@@ -33,6 +33,10 @@
svg {
}
+
+ .hero-vector--mobile {
+ display: none;
+ }
}
.intro {
@@ -122,6 +126,16 @@
width: var(--hero-vector-width);
}
+ .homepage-hero .heroVector .vector > svg {
+ display: none;
+ }
+
+ .homepage-hero .heroVector .hero-vector--mobile {
+ display: block;
+ height: auto;
+ width: 100%;
+ }
+
.homepage-hero .heroMedia img,
.homepage-hero .heroMedia video {
object-position: 58% center;
diff --git a/views/blocks/homepage-hero/homepage-hero.php b/views/blocks/homepage-hero/homepage-hero.php
index 8e900ea..0b47241 100644
--- a/views/blocks/homepage-hero/homepage-hero.php
+++ b/views/blocks/homepage-hero/homepage-hero.php
@@ -80,6 +80,7 @@ $wrapper = blockWrapperAttributes( $classes, $is_preview );
diff --git a/views/partials/hero-vector-mobile.php b/views/partials/hero-vector-mobile.php
new file mode 100644
index 0000000..f2014d7
--- /dev/null
+++ b/views/partials/hero-vector-mobile.php
@@ -0,0 +1 @@
+ ); ?>)
\ No newline at end of file