diff --git a/src/assets/our-work/our-work-header.png b/src/assets/our-work/our-work-header.png new file mode 100644 index 00000000..d5ee2e77 Binary files /dev/null and b/src/assets/our-work/our-work-header.png differ diff --git a/src/assets/our-work/our-work-header.svg b/src/assets/our-work/our-work-header.svg deleted file mode 100644 index 9af6efdb..00000000 --- a/src/assets/our-work/our-work-header.svg +++ /dev/null @@ -1 +0,0 @@ -our work header image \ No newline at end of file diff --git a/src/assets/our-work/our-work-header.webp b/src/assets/our-work/our-work-header.webp new file mode 100644 index 00000000..39f0166a Binary files /dev/null and b/src/assets/our-work/our-work-header.webp differ diff --git a/src/pages/app-our-work/app-our-work.scss b/src/pages/app-our-work/app-our-work.scss index 0b095ddf..7f701823 100644 --- a/src/pages/app-our-work/app-our-work.scss +++ b/src/pages/app-our-work/app-our-work.scss @@ -3,7 +3,14 @@ header { @include media-breakpoint-down(md) { - background-image: url(assets/our-work/our-work-header.svg); + background-image: url(assets/our-work/our-work-header.png); + background-size: contain; + background-repeat: no-repeat; + background-position: center; + + &.webp { + background-image: url(assets/our-work/our-work-header.webp); + } } @include media-breakpoint-down(sm) { @@ -12,14 +19,19 @@ section { align-items: center; - background-image: url(assets/our-work/our-work-header.svg); + background-image: url(assets/our-work/our-work-header.png); background-repeat: no-repeat; display: flex; flex-direction: column; justify-content: center; background-position: center; + background-size: contain; min-height: 520px; + &.webp { + background-image: url(assets/our-work/our-work-header.webp); + } + @include media-breakpoint-down(md) { min-height: 350px; background-image: none; @@ -74,6 +86,10 @@ -moz-box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.75); box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.75); + &:first-child { + margin-top: 20px; + } + @include media-breakpoint-down(sm) { grid-template-columns: initial; grid-template-rows: 1fr 1fr;