diff --git a/src/components/ExampleItem.vue b/src/components/ExampleItem.vue
index 5ce58fe..dc87666 100644
--- a/src/components/ExampleItem.vue
+++ b/src/components/ExampleItem.vue
@@ -1,7 +1,9 @@
 <template>
 <div id="passageroot" class="pageroot">
   <div id="passagebanner" class="pagebanner">
-    <div id="bannercontentfill" class="pagebanner"
+    <img :src="`http://cms.yangprivate.site${psginfo.headimage.formats.large.url}`"
+         alt="" id="bannerimg"/>
+    <div id="bannercontentfill"
          style="width: 100%;height: 100%;
          background-color: rgba(0,0,0,0.5);">
       <div class="bannercontent">
@@ -111,10 +113,23 @@ export default {
 @import "src/publicstyle.scss";
 
 #bannercontentfill{
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+}
 
+#bannerimg{
+  z-index: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: center;
+  display: block;
 }
 
 #passagebanner{
+  position: relative;
   @include media-breakpoint-between(xs, md) {
     background-image: url('/ExamplesRes/Examplesbanner_wep.png');
   }