change(header): changed homepage text color

- started also the changes to main header section when
  we are on the homepage where the header goes over the
  hero section

theme/themes/eea/extras/header.less

@@ -83,7 +83,7 @@
   gap: @dropdownMenuWrapperGap;
   white-space: @dropdownMenuContentWhiteSpace;
   margin: @dropdownMenuWrapperMargin;
-  
+
   &.language-list {
     padding-inline-start: @dropdownMenuLanguageWrapperPaddingInlineStart;
   }
@@ -117,7 +117,7 @@
         }
         a {
           font-weight: @officialUnionLinkFontWeight;
-          white-space: @dropdownMenuContentWhiteSpace; 
+          white-space: @dropdownMenuContentWhiteSpace;
           color: @officialUnionLinkColor;
         }
       }
@@ -288,10 +288,15 @@
 
 @media all and (max-width: @largestMobileScreen) {
   .eea.header .top.bar .ui.container {
-    width: 100% !important; //override semantic auto to display content with space between them   
+    width: 100% !important; //override semantic auto to display content with space between them
   }
 }
-
+.homepage .eea.header {
+  position: absolute;
+  top: 0;
+  z-index: 1;
+  width: 100%;
+}
 /*----------------------------------------------------------------------------
   Header Actions - Burger and Search Icons
 ----------------------------------------------------------------------------*/
@@ -370,7 +375,7 @@
   .top.bar .ui.dropdown .menu {
     margin-top: @tabletDropdownMenuMarginTop;
   }
-  
+
   .top.bar .ui.dropdown .menu,
   .top.bar .ui.dropdown .menu .item {
     font-size: @tabletDropdownMenuFontSize;
@@ -531,11 +536,11 @@
     color: @megaMenuTextColor;
 
     &+ .ui.grid {
-  
+
       div.column:first-child {
         padding-left: 0;
       }
-  
+
       div.column:last-child {
         padding-right: 0;
       }
@@ -649,5 +654,5 @@
   }
   #mega-menu .title > a {
     color: @megaMenuTextColor;
-  } 
+  }
 }

theme/themes/eea/extras/header.variables

@@ -90,7 +90,7 @@
 -----------------------*/
 
 /* Main Section */
-@headerMainSectionBackground          : @white;
+@headerMainSectionBackground          : transparent;
 @headerMainSectionTransparency        : rgba(255, 255, 255, 0.1);
 
 /* Logo */

theme/themes/eea/globals/site.overrides

@@ -16,3 +16,7 @@
 [class*=' ri-'] {
   fill: currentColor;
 }
+
+.homepage {
+  color: @tertiaryColor;
+}