diff --git a/src/components.d.ts b/src/components.d.ts
index e42969d12a7c361e4099ddf8770109e29bf900bb..40e55d7150ac6b463d8d9099a6f994a25f3a1364 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -53,7 +53,7 @@ import {CtaLinkValue} from './components/hy-link-list/hy-link-list';
 import {AdditionalInfo, RelatedLink} from './components/hy-list-item/hy-list-item';
 import {MenuLanguage} from './components/navigation/menu-language/menu-language';
 import {ComponentLabels} from './components/site-header/site-header';
-import {MainMenu} from './components/navigation/hy-menu-main-group/hy-menu-main-group';
+import {DonateLink, MainMenu} from './components/navigation/hy-menu-main-group/hy-menu-main-group';
 import {ProcessFlowBoxValue} from './components/process/process';
 import {ShortcutLinkValue} from './components/hy-shortcuts/hy-shortcuts';
 import {DesktopLinks as DesktopLinks1} from './components/site-header/site-header';
@@ -628,10 +628,10 @@ export namespace Components {
   }
   interface HyMenuMainGroup {
     dataMainMenu: MainMenu[] | string;
+    donate: DonateLink[];
     isMobile: boolean;
-    logoLabelGroup?: string;
-    logoSizeGroup?: any;
-    logoUrlGroup?: string;
+    logoLabel?: string;
+    logoUrl?: string;
     siteLabel?: string;
     siteUrl?: string;
   }
@@ -2013,10 +2013,10 @@ declare namespace LocalJSX {
   }
   interface HyMenuMainGroup {
     dataMainMenu?: MainMenu[] | string;
+    donate?: DonateLink[];
     isMobile?: boolean;
-    logoLabelGroup?: string;
-    logoSizeGroup?: any;
-    logoUrlGroup?: string;
+    logoLabel?: string;
+    logoUrl?: string;
     onUniversityMainMenuToggled?: (event: CustomEvent<any>) => void;
     siteLabel?: string;
     siteUrl?: string;
diff --git a/src/components/navigation/hy-menu-main-group/hy-menu-main-group.scss b/src/components/navigation/hy-menu-main-group/hy-menu-main-group.scss
index 5fbcb1d68c5b66d82f875e6aa0a4b4f50ea7b7d5..da5332728d38c96bcf8b0b1981ddafa66d1bc44b 100644
--- a/src/components/navigation/hy-menu-main-group/hy-menu-main-group.scss
+++ b/src/components/navigation/hy-menu-main-group/hy-menu-main-group.scss
@@ -176,12 +176,8 @@
   align-items: center;
   display: flex;
   flex-flow: row;
-  margin-left: 28px;
   position: relative;
 
-  @include breakpoint($narrow) {
-    margin-left: 32px;
-  }
   @include breakpoint($wide) {
     margin-left: 40px;
   }
@@ -191,29 +187,94 @@
   border: none;
   background: transparent;
   padding: 15px 28px 15px 15px;
+
+  &:hover {
+    cursor: pointer;
+  }
 }
 
 .menu--main-group__dropdown__top {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  margin-bottom: 23px;
+}
+
+.menu--main-group__dropdown__close {
+  border: none;
+  background-color: transparent;
+  padding: 0;
+  margin: 0;
+
+  &:hover {
+    cursor: pointer;
+  }
+}
+
+.menu--main-group__logo-container .hy-site-logo__label.group {
+  max-width: 250px;
 }
 
 .menu--main-group__dropdown__items {
+  display: flex;
+  flex-direction: column;
+
+  .menu-main-link {
+    @include font-size(15px, 20px);
+
+    background-color: var(--grayscale-dark-text);
+    color: var(--grayscale-white);
+    font-family: var(--main-font-family);
+    letter-spacing: -0.5px;
+    margin-bottom: 8px;
+    padding: 14px 20px;
+    text-decoration: none;
+    width: 100%;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
 }
 
 .menu--main-group__dropdown__donate {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  background-color: var(--grayscale-dark-text);
+  position: fixed;
+  bottom: 0;
+  margin-left: -20px;
+  width: 100%;
+
+  .hy-link__donate.group {
+    @include font-size(16px, 16px);
+    @include font-weight($semibold);
+
+    display: flex;
+    color: var(--grayscale-white);
+    font-family: var(--main-font-family);
+    margin: 20px auto 16px auto;
+    text-decoration: none;
+
+    .hy-link__donate__label {
+      margin-left: 6px;
+    }
+  }
 }
 
 .menu--main-group__dropdown--mobile {
-  place-items: stretch;
-  //inset: 0px;
-  display: flex;
-  -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
-  flex-direction: column;
-  justify-items: space-between;
+  -webkit-box-orient: vertical;
   background-color: var(--grayscale-black);
   bottom: 0px;
+  display: flex;
+  flex-direction: column;
+  justify-items: space-between;
+  max-width: 350px;
   overflow: hidden;
   padding: 0px;
+  place-items: stretch;
   position: fixed;
   right: 0px;
   top: 0px;
@@ -223,13 +284,12 @@
   width: 0px;
 
   &.is-open {
-    padding: 20px;
+    padding: 50px 20px 20px;
     transform: translateX(0px);
+    transition: transform 0.3s cubic-bezier(0, 0, 0.3, 1);
     visibility: visible;
     width: 90%;
-    z-index: 100;
-    padding-top: 50px;
-    transition: transform 0.3s cubic-bezier(0, 0, 0.3, 1);
+    z-index: 101;
 
     &::after {
       opacity: 1;
diff --git a/src/components/navigation/hy-menu-main-group/hy-menu-main-group.tsx b/src/components/navigation/hy-menu-main-group/hy-menu-main-group.tsx
index 115f14bdd5aecaf5db908efe3424e7c7337e6331..fe3a5917371e53246b15e609bd2f677d39ba4c4a 100644
--- a/src/components/navigation/hy-menu-main-group/hy-menu-main-group.tsx
+++ b/src/components/navigation/hy-menu-main-group/hy-menu-main-group.tsx
@@ -4,9 +4,13 @@ export interface MainMenu {
   menuLinkId: string;
 }
 
+export interface DonateLink {
+  url: string;
+  label: string;
+}
+
 import {Component, Host, h, Element, Prop, State, Watch, Listen, Event, EventEmitter} from '@stencil/core';
 import {ColorVariant, SiteLogoSize} from '../../../utils/utils';
-import {DonateLink} from '../../site-header/site-header';
 
 let keys = {
   enter: 'Enter',
@@ -21,13 +25,12 @@ export class HyMenuMainGroup {
   @Element() el: HTMLElement;
   @Prop() dataMainMenu: MainMenu[] | string;
   @Prop() isMobile: boolean = false;
-  @Prop() logoUrlGroup?: string;
-  @Prop() logoSizeGroup?: any;
-  @Prop() logoLabelGroup?: string;
+  @Prop() logoUrl?: string;
+  @Prop() logoLabel?: string;
   @Prop() siteLabel?: string;
   @Prop() siteUrl?: string;
+  @Prop() donate: DonateLink[];
   @State() isMenuOpen: boolean = false;
-  private donateLink: DonateLink[];
 
   @Event() universityMainMenuToggled: EventEmitter;
 
@@ -154,32 +157,31 @@ export class HyMenuMainGroup {
           }}
         >
           <div class="menu--main-group__dropdown__top">
-            <hy-site-logo
-              is-group={true}
-              size={logoSizeGroup}
-              color={logoColorGroup}
-              url={this.siteUrl}
-              label={this.siteLabel}
-            />
+            <div class={'menu--main-group__logo-container'} id={'menu-logo'}>
+              <hy-site-logo
+                is-group={true}
+                size={logoSizeGroup}
+                color={logoColorGroup}
+                url={this.siteUrl}
+                label={this.siteLabel}
+              />
+            </div>
             <button class="menu--main-group__dropdown__close" onClick={() => this.isMenuOpen == false}>
-              CLOSE ME
+              <hy-icon icon={'hy-icon-remove'} size={20} fill={white} />
             </button>
           </div>
           <div class="menu--main-group__dropdown__items">
             {this._dataMainMenu.map((item) => {
               return (
                 <a href={item.url} class={{'menu-main-link': true}}>
-                  <span class="heading-icon">
-                    <hy-icon icon={'hy-icon-caret-right'} size={10} fill={white} />
-                  </span>
                   <span class={'menu--main-group__label'}>{item.label}</span>
                 </a>
               );
             })}
           </div>
           <div class="menu--main-group__dropdown__donate">
-            {this.donateLink &&
-              this.donateLink.map((i) => {
+            {this.donate &&
+              this.donate.map((i) => {
                 return (
                   <a class={'menu--secondary__item hy-link__donate group'} href={i.url}>
                     <hy-icon icon={'hy-icon-heart-support'} size={14} fill={logoColorGroup} />
diff --git a/src/components/navigation/hy-menu-main-group/readme.md b/src/components/navigation/hy-menu-main-group/readme.md
index dd21c99c3c616ba06e29a09dc2ee3519f0dab473..122597d87748ecc2954dbf383d1468b6a4b200a1 100644
--- a/src/components/navigation/hy-menu-main-group/readme.md
+++ b/src/components/navigation/hy-menu-main-group/readme.md
@@ -4,15 +4,15 @@
 
 ## Properties
 
-| Property         | Attribute          | Description | Type                   | Default     |
-| ---------------- | ------------------ | ----------- | ---------------------- | ----------- |
-| `dataMainMenu`   | `data-main-menu`   |             | `MainMenu[] \| string` | `undefined` |
-| `isMobile`       | `is-mobile`        |             | `boolean`              | `false`     |
-| `logoLabelGroup` | `logo-label-group` |             | `string`               | `undefined` |
-| `logoSizeGroup`  | `logo-size-group`  |             | `any`                  | `undefined` |
-| `logoUrlGroup`   | `logo-url-group`   |             | `string`               | `undefined` |
-| `siteLabel`      | `site-label`       |             | `string`               | `undefined` |
-| `siteUrl`        | `site-url`         |             | `string`               | `undefined` |
+| Property       | Attribute        | Description | Type                   | Default     |
+| -------------- | ---------------- | ----------- | ---------------------- | ----------- |
+| `dataMainMenu` | `data-main-menu` |             | `MainMenu[] \| string` | `undefined` |
+| `donate`       | --               |             | `DonateLink[]`         | `undefined` |
+| `isMobile`     | `is-mobile`      |             | `boolean`              | `false`     |
+| `logoLabel`    | `logo-label`     |             | `string`               | `undefined` |
+| `logoUrl`      | `logo-url`       |             | `string`               | `undefined` |
+| `siteLabel`    | `site-label`     |             | `string`               | `undefined` |
+| `siteUrl`      | `site-url`       |             | `string`               | `undefined` |
 
 ## Events
 
diff --git a/src/components/navigation/menu/menu.scss b/src/components/navigation/menu/menu.scss
index 8ea72d4ebe01f8a578c7a76aa6f86939340b0ecd..5d38d130526d680328434db5715867ff94a000c1 100644
--- a/src/components/navigation/menu/menu.scss
+++ b/src/components/navigation/menu/menu.scss
@@ -14,6 +14,11 @@
     position: absolute;
     right: 0;
     top: 0;
+    z-index: 99;
+
+    &.is-open {
+      z-index: 101;
+    }
   }
 
   &--desktop {
diff --git a/src/components/site-header/site-header.scss b/src/components/site-header/site-header.scss
index a47d29312237e6c51cef9050500d07531169986b..241bd7a9d1d71ee2fa912ff1193ba3f9fa6aca6d 100644
--- a/src/components/site-header/site-header.scss
+++ b/src/components/site-header/site-header.scss
@@ -74,7 +74,7 @@
   flex-flow: row;
   place-content: center space-between;
   position: relative;
-  z-index: 100;
+  z-index: 99;
 
   @include breakpoint($narrow) {
     margin: 0 auto;
@@ -161,7 +161,11 @@
 .hy-site-header__menu-container {
   align-items: center;
   display: flex;
-  z-index: 510;
+  z-index: 99;
+
+  &.is-open {
+    z-index: 101;
+  }
 }
 
 .hy-site-header__panel {
diff --git a/src/components/site-header/site-header.tsx b/src/components/site-header/site-header.tsx
index cf04fdf4b43d79fb7b07ea3867f4c820d6c68170..433c69225b5e52fce6ce047f6d57a205276afc22 100644
--- a/src/components/site-header/site-header.tsx
+++ b/src/components/site-header/site-header.tsx
@@ -452,7 +452,7 @@ export class SiteHeader {
                 <div class={'menu--secondary menu--secondary--group'}>
                   <hy-site-search
                     class={'menu--secondary__item group'}
-                    size={14}
+                    size={18}
                     color={logoColorGroup}
                     is-group={true}
                     show-label={true}
@@ -460,7 +460,15 @@ export class SiteHeader {
                     search-labels={this.dataSiteSearchLabels}
                     search-tools={this.dataSearchTools}
                   />
-                  <hy-menu-main-group is-mobile={true} data-main-menu={this.dataMainMenuLinks} />
+                  <hy-menu-main-group
+                    site-label={this.siteLabel}
+                    site-url={this.siteUrl}
+                    logo-label={this.logoLabel}
+                    logo-url={this.logoUrl}
+                    is-mobile={true}
+                    donate={this.donateLink}
+                    data-main-menu={this.dataMainMenuLinks}
+                  />
                 </div>
               </div>
             )}
@@ -475,7 +483,7 @@ export class SiteHeader {
                 )}
               </div>
 
-              <div class={'hy-site-header__menu-container'}>
+              <div class={{'hy-site-header__menu-container': true, 'is-open': this.isMenuOpen}}>
                 {!this.isGroup && (
                   <hy-site-search
                     class={'menu--secondary__item'}
diff --git a/src/components/site-header/site-search/site-search.scss b/src/components/site-header/site-search/site-search.scss
index 177a4028728de21aec8676b2169d67ffee18d7f5..bf1d97e71cf4f8e3a9ed949992399577e8267be1 100644
--- a/src/components/site-header/site-search/site-search.scss
+++ b/src/components/site-header/site-search/site-search.scss
@@ -117,10 +117,13 @@
 
   .button--search__label {
     color: var(--grayscale-white);
+    display: none;
 
     @include breakpoint($wide) {
       @include font-size(14px, 24px);
       @include font-weight($semibold);
+
+      display: block;
       letter-spacing: -0.5px;
     }
   }