diff --git a/components/Blocks/FullWidthCampaign/fullWidthCampaign.module.css b/components/Blocks/FullWidthCampaign/fullWidthCampaign.module.css index e2672cc5a..efdee8666 100644 --- a/components/Blocks/FullWidthCampaign/fullWidthCampaign.module.css +++ b/components/Blocks/FullWidthCampaign/fullWidthCampaign.module.css @@ -1,7 +1,13 @@ .container { position: relative; - height: 640px; overflow: hidden; + height: 640px; +} + +@media screen and (min-width: 768px) { + .container { + height: 880px; + } } .content { @@ -31,11 +37,5 @@ .image { max-width: 100%; - height: 600px; -} - -@media screen and (min-width: 768px) { - .image { - height: 880px; - } + height: 100%; } diff --git a/components/Blocks/FullWidthCampaign/index.tsx b/components/Blocks/FullWidthCampaign/index.tsx index 755a73106..3a7a0a1ce 100644 --- a/components/Blocks/FullWidthCampaign/index.tsx +++ b/components/Blocks/FullWidthCampaign/index.tsx @@ -26,6 +26,7 @@ export default function FullWidthCampaign({ content }: FullWidthCampaignProps) { focalPoint={background_image.focalPoint} width={1512} height={880} + sizes="(min-width: 1512px) 1512px, 100vw" /> ) : null}