diff --git a/_includes/title_image.html b/_includes/title_image.html
index df5fce76e61bfa3e05e1cd196434e31c30dff85e..59108f3433507b9579187bb988dc3da797ddc5cd 100644
--- a/_includes/title_image.html
+++ b/_includes/title_image.html
@@ -40,6 +40,6 @@
         {% endif %}
     </div>
 
-    {% include transition.html %}
+    {% include transition.html direction="right" %}
 
 </div>
diff --git a/_sass/common/_title.scss b/_sass/common/_title.scss
index df6d9d547fae9961d01f8e28315d00203d4ec9a3..c7ad03089b49871bf9cfb1341c7710f93daaa9f1 100644
--- a/_sass/common/_title.scss
+++ b/_sass/common/_title.scss
@@ -7,8 +7,11 @@
 
 
 div#title {
+
     position:               relative;
     min-height:             2rem;
+
+    color:                  $color-content-light-gray;
     background-color:       $color-helmholtz-blue;
 
     .location-info {
@@ -104,21 +107,10 @@ div#title {
         }
     }
 
-    /*
-        The transition element from the title image into the main body.
-        NOTE Mirrored along the top line so it reaches into the title image and
-        overlaps it instead of being placed below and going into the following
-        main content.
-    */
     .transition {
-//        @include rotate-180-offset-top;
-        @include rotate-180;
 
-        color: $color-content-light-gray;
-        position:   absolute;
-        right:      -1px; /* (1) */
-        bottom:     -1px; /* (1) */
-
-        /* (1) Drag in the transition to avoid 1px wide border artifacts. */
+        /* Do not apply the mix-blend mode of the parent */
+        isolation: isolate; 
     }
 }
+