Gallery / Settings / Image - Transition, scale up 

Navigate to YOOtheme > SETTINGS > Custom Code > CSS/LESS, and add the following to it:

.uk-drop.uk-navbar-dropdown {
background: transparent url(../../../images/submenubackground.png) no-repeat;
background-size: contain;
top: 0px !important;
padding-top: @navbar-nav-item-height;
/* optional, depending on the style */
border: none;
box-shadow: none;
}

To adjust a possibly suitable shift to the lef — depending on the concept and the subject of the actually used background image — use the parameter YOOtheme > STYLE > Components > Navbar > Dropdown > @M Shift Margin, and set it to -80px, for example.

Layout / Header / Dropdown - change to center to line the image up in the centre of the main menu item, then...

play with the width of the dropdown in styles / navbar to get the image to centre.

Settings > General > Text Alignment: Right.

Then, edit the element, click on its tab "Advanced", scroll down to the field labeled "CSS", and insert the following:

.el-element li {
display: flex;
justify-content: flex-end;
}

Navigate to YOOtheme > SETTINGS > Custom Code > CSS/LESS, and add the following to it:

@media (min-width: @theme-page-container-width) {
    .tm-page-container .tm-page {
    max-width: none;
    background: @theme-page-container-background;
    }
}
@media (min-width: @theme-page-container-width) {
    .tm-page-container .tm-page > main,
    .tm-page-container .tm-page > header {
    max-width: @theme-page-container-width;
    margin-left: auto;
    margin-right: auto;
    }
}

Style / Utility / logo / color

Make sure the image URL is select for the "LINK" field of the Dynamic Content item of the "Grid":
GRID > Content > ITEMS > [Articles] > Content > LINK > Dynamic > Article: Intro Image.

Then edit the "Grid" itself, click on the tab "Settings" and apply the following:
LIGHTBOX > Lightbox:  Enable lightbox gallery.
PANEL > Link:  Link panel.

Optionally remove the content from the field Settings > LINK > Text — unless you want to get a button.

Layout / Header / Dropdown

Turn on Dropdown full width submenus

But... Untick Align to navbar or all the items will line up on the left of the page.

You can adjust the megamenu to spread larger menus across the page.

 YOOtheme / Menus / 

Set up megamenus by clicking on the menu you want to upgrade and then the builder button beside the item

Width of the dropdown inside the dropbar!!!

Go to Customizer > Menus > [Menu] click on the name of the parent item (not on the "Builder" button), and select Dropdown Stretch: Navbar or Dropdown Stretch: Navbar Container.

Menus / Main Menu / choose your menu item / Nav / Settings / Grid

Changes the number of columns you want for your drop down.

Add the following css to advanced for the overlay

.el-overlay { justify-content: center; }
.el-overlay > * { flex: 0; }

 https://webcode.tools/css-generator/drop-shadow

.el-section {
filter: drop-shadow(6px 13px 11px #000000);
}

https://yootheme.com/support/yootheme-pro/joomla/widgets-and-modules#module-positions

To style the toolbars,

Open the Customizer, and select LAYOUT > Site > Toolbar: X-Large.