Morden: Set max width of site-header to match .alignwide

morden/header.php

@@ -25,45 +25,49 @@
 
 		<header id="masthead" class="site-header">
 
-			<?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
+			<div class="site-header-wrap">
 
-			<?php if ( has_nav_menu( 'menu-1' ) ) : ?>
-				<nav id="site-navigation" class="main-navigation" aria-label="<?php esc_attr_e( 'Main Navigation', 'varia' ); ?>">
-					<input type="checkbox" role="button" aria-haspopup="true" id="toggle" class="hide-visually">
-					<label for="toggle" id="toggle-menu" class="button">
-						<?php _e( 'Menu', 'varia' ); ?>
-						<span class="dropdown-icon open">+</span>
-						<span class="dropdown-icon close">&times;</span>
-						<span class="hide-visually expanded-text"><?php _e( 'expanded', 'varia' ); ?></span>
-						<span class="hide-visually collapsed-text"><?php _e( 'collapsed', 'varia' ); ?></span>
-					</label>
-					<?php
-					wp_nav_menu(
-						array(
-							'theme_location' => 'menu-1',
-							'menu_class'     => 'main-menu',
-							'items_wrap'     => '<ul id="%1$s" class="%2$s" aria-label="submenu">%3$s</ul>',
-						)
-					);
-					?>
-				</nav><!-- #site-navigation -->
-			<?php endif; ?>
+				<?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
 
-			<?php if ( has_nav_menu( 'social' ) ) : ?>
-				<nav class="social-navigation" aria-label="<?php esc_attr_e( 'Social Links Menu', 'varia' ); ?>">
-					<?php
-					wp_nav_menu(
-						array(
-							'theme_location' => 'social',
-							'menu_class'     => 'social-links-menu',
-							'link_before'    => '<span class="screen-reader-text">',
-							'link_after'     => '</span>' . varia_get_icon_svg( 'link' ),
-							'depth'          => 1,
-						)
-					);
-					?>
-				</nav><!-- .social-navigation -->
-			<?php endif; ?>
+				<?php if ( has_nav_menu( 'menu-1' ) ) : ?>
+					<nav id="site-navigation" class="main-navigation" aria-label="<?php esc_attr_e( 'Main Navigation', 'varia' ); ?>">
+						<input type="checkbox" role="button" aria-haspopup="true" id="toggle" class="hide-visually">
+						<label for="toggle" id="toggle-menu" class="button">
+							<?php _e( 'Menu', 'varia' ); ?>
+							<span class="dropdown-icon open">+</span>
+							<span class="dropdown-icon close">&times;</span>
+							<span class="hide-visually expanded-text"><?php _e( 'expanded', 'varia' ); ?></span>
+							<span class="hide-visually collapsed-text"><?php _e( 'collapsed', 'varia' ); ?></span>
+						</label>
+						<?php
+						wp_nav_menu(
+							array(
+								'theme_location' => 'menu-1',
+								'menu_class'     => 'main-menu',
+								'items_wrap'     => '<ul id="%1$s" class="%2$s" aria-label="submenu">%3$s</ul>',
+							)
+						);
+						?>
+					</nav><!-- #site-navigation -->
+				<?php endif; ?>
+
+				<?php if ( has_nav_menu( 'social' ) ) : ?>
+					<nav class="social-navigation" aria-label="<?php esc_attr_e( 'Social Links Menu', 'varia' ); ?>">
+						<?php
+						wp_nav_menu(
+							array(
+								'theme_location' => 'social',
+								'menu_class'     => 'social-links-menu',
+								'link_before'    => '<span class="screen-reader-text">',
+								'link_after'     => '</span>' . varia_get_icon_svg( 'link' ),
+								'depth'          => 1,
+							)
+						);
+						?>
+					</nav><!-- .social-navigation -->
+				<?php endif; ?>
+
+			</div>
 
 		</header><!-- #masthead -->
 

morden/sass/_extra-child-theme.scss

@@ -66,11 +66,16 @@ body {
  * Wide Header & Footer
  */
 #masthead {
-	margin-left: auto;
-	margin-right: auto;
-	padding-left: #{map-deep-get($config-global, "spacing", "horizontal")};
-	padding-right: #{map-deep-get($config-global, "spacing", "horizontal")};
 	position: relative;
+
+	.site-header-wrap {
+
+		@extend %responsive-alignwide;
+
+		& > * {
+			max-width: 100%;
+		}
+	}
 }
 
 #colophon {
@@ -99,7 +104,7 @@ body {
  * CSS-grid Desktop Menu
  */
 @include media(mobile) {
-	.site-header {
+	.site-header-wrap {
 		align-items: center;
 		display: grid;
 		grid-template-columns: auto;
@@ -217,8 +222,8 @@ body {
  */
 #masthead {
 	background: #{map-deep-get($config-global, "color", "foreground", "default")};
-	padding-left: #{map-deep-get($config-global, "spacing", "horizontal")};
-	padding-right: #{map-deep-get($config-global, "spacing", "horizontal")};
+	padding-left: 0;
+	padding-right: 0;
 
 	& > * {
 		position: relative;
@@ -230,10 +235,6 @@ body {
 	color: #{map-deep-get($config-header, "branding", "color", "text")};
 }
 
-.site-title + .site-description {
-	margin-top: -#{map-deep-get($config-global, "spacing", "unit")};
-}
-
 /**
  * Main
  */

morden/style-rtl.css

@@ -3195,7 +3195,7 @@ img#wpstats {
 	}
 }
 
-.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 	width: calc(100% + 256px);
 	max-width: calc(100% - 32px);
 	margin-right: auto;
@@ -3203,35 +3203,35 @@ img#wpstats {
 }
 
 @media only screen and (min-width: 560px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 560px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 640px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 640px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 782px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 782px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 1024px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 782px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 1280px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 782px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
@@ -3440,13 +3440,13 @@ hr.wp-block-separator.is-style-wide,
  * Wide Header & Footer
  */
 #masthead {
-	margin-right: auto;
-	margin-left: auto;
-	padding-right: 16px;
-	padding-left: 16px;
 	position: relative;
 }
 
+#masthead .site-header-wrap > * {
+	max-width: 100%;
+}
+
 #colophon {
 	padding-right: 0;
 	padding-left: 0;
@@ -3474,7 +3474,7 @@ hr.wp-block-separator.is-style-wide,
  * CSS-grid Desktop Menu
  */
 @media only screen and (min-width: 560px) {
-	.site-header {
+	.site-header-wrap {
 		align-items: center;
 		display: grid;
 		grid-template-columns: auto;
@@ -3482,86 +3482,86 @@ hr.wp-block-separator.is-style-wide,
 		grid-column-gap: 16px;
 		grid-template-areas: "site-logo site-logo" "site-title main-navigation" "site-description social-navigation";
 	}
-	.site-header:before, .site-header:after {
+	.site-header-wrap:before, .site-header-wrap:after {
 		content: none;
 		display: none;
 	}
-	.site-header > * {
+	.site-header-wrap > * {
 		margin-top: 0;
 		margin-bottom: 0;
 	}
-	.site-header .site-logo {
+	.site-header-wrap .site-logo {
 		grid-area: site-logo;
 		margin-bottom: 16px;
 	}
-	.site-header .site-title {
+	.site-header-wrap .site-title {
 		align-self: flex-end;
 		grid-area: site-title;
 	}
-	.site-header .site-title + .site-description {
+	.site-header-wrap .site-title + .site-description {
 		margin-top: 0;
 	}
-	.site-header .site-description {
+	.site-header-wrap .site-description {
 		align-self: center;
 		grid-area: site-description;
 	}
-	.site-header .main-navigation {
+	.site-header-wrap .main-navigation {
 		align-self: center;
 		grid-area: main-navigation;
 		justify-self: flex-end;
 	}
-	.site-header .main-navigation > div > ul {
+	.site-header-wrap .main-navigation > div > ul {
 		justify-content: flex-end;
 	}
-	.site-header .main-navigation > div > ul > .menu-item-has-children > a::after {
+	.site-header-wrap .main-navigation > div > ul > .menu-item-has-children > a::after {
 		font-size: 0.5rem;
 	}
-	.site-header .main-navigation > div > ul > li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item > a {
+	.site-header-wrap .main-navigation > div > ul > li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item > a {
 		color: rgba(255, 255, 255, 0.8);
 	}
-	.site-header .main-navigation > div > ul > li:hover > ul,
-	.site-header .main-navigation > div > ul > li.focus > ul,
-	.site-header .main-navigation > div > ul > li.current-menu-item > ul {
+	.site-header-wrap .main-navigation > div > ul > li:hover > ul,
+	.site-header-wrap .main-navigation > div > ul > li.focus > ul,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item > ul {
 		background: #303030;
 		border: 1px solid #101010;
 		border-radius: 5px;
 		overflow: hidden;
 	}
-	.site-header .main-navigation > div > ul > li:hover li,
-	.site-header .main-navigation > div > ul > li.focus li,
-	.site-header .main-navigation > div > ul > li.current-menu-item li {
+	.site-header-wrap .main-navigation > div > ul > li:hover li,
+	.site-header-wrap .main-navigation > div > ul > li.focus li,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li {
 		border-top: 1px solid #101010;
 	}
-	.site-header .main-navigation > div > ul > li:hover li:first-child,
-	.site-header .main-navigation > div > ul > li.focus li:first-child,
-	.site-header .main-navigation > div > ul > li.current-menu-item li:first-child {
+	.site-header-wrap .main-navigation > div > ul > li:hover li:first-child,
+	.site-header-wrap .main-navigation > div > ul > li.focus li:first-child,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li:first-child {
 		border-top: 0;
 	}
-	.site-header .main-navigation > div > ul > li:hover li > a,
-	.site-header .main-navigation > div > ul > li.focus li > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li > a {
+	.site-header-wrap .main-navigation > div > ul > li:hover li > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li > a {
 		background: #303030;
 		color: white;
 		padding: 8px 24px;
 	}
-	.site-header .main-navigation > div > ul > li:hover li:hover > a,
-	.site-header .main-navigation > div > ul > li:hover li.focus > a,
-	.site-header .main-navigation > div > ul > li:hover li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.focus li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus li.focus > a,
-	.site-header .main-navigation > div > ul > li.focus li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li:hover > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
+	.site-header-wrap .main-navigation > div > ul > li:hover li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li:hover li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li:hover li.current-menu-item > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li.current-menu-item > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
 		background: #CD2220;
 	}
-	.site-header .main-navigation > div > ul > li.current-menu-item > a {
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item > a {
 		color: inherit;
 		box-shadow: 0 2px 0;
 	}
-	.site-header .social-navigation {
+	.site-header-wrap .social-navigation {
 		align-self: center;
 		grid-area: social-navigation;
 		justify-self: flex-end;
@@ -3577,8 +3577,8 @@ hr.wp-block-separator.is-style-wide,
  */
 #masthead {
 	background: #303030;
-	padding-right: 16px;
-	padding-left: 16px;
+	padding-right: 0;
+	padding-left: 0;
 }
 
 #masthead > * {
@@ -3589,10 +3589,6 @@ hr.wp-block-separator.is-style-wide,
 	color: white;
 }
 
-.site-title + .site-description {
-	margin-top: -16px;
-}
-
 /**
  * Main
  */

morden/style.css

@@ -3201,7 +3201,7 @@ img#wpstats {
 	}
 }
 
-.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 	width: calc(100% + 256px);
 	max-width: calc(100% - 32px);
 	margin-left: auto;
@@ -3209,35 +3209,35 @@ img#wpstats {
 }
 
 @media only screen and (min-width: 560px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 560px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 640px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 640px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 782px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 782px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 1024px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 782px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
 }
 
 @media only screen and (min-width: 1280px) {
-	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery {
+	.entry-content > .alignwide, .entry-content > .alignwide.wp-block-jetpack-gif, .entry-content > .alignwide.wp-block-jetpack-tiled-gallery, #masthead .site-header-wrap {
 		width: calc(calc( 782px - 32px) + 256px);
 		max-width: calc(100% - 32px);
 	}
@@ -3458,13 +3458,13 @@ hr.wp-block-separator.is-style-wide,
  * Wide Header & Footer
  */
 #masthead {
-	margin-left: auto;
-	margin-right: auto;
-	padding-left: 16px;
-	padding-right: 16px;
 	position: relative;
 }
 
+#masthead .site-header-wrap > * {
+	max-width: 100%;
+}
+
 #colophon {
 	padding-left: 0;
 	padding-right: 0;
@@ -3492,7 +3492,7 @@ hr.wp-block-separator.is-style-wide,
  * CSS-grid Desktop Menu
  */
 @media only screen and (min-width: 560px) {
-	.site-header {
+	.site-header-wrap {
 		align-items: center;
 		display: grid;
 		grid-template-columns: auto;
@@ -3500,86 +3500,86 @@ hr.wp-block-separator.is-style-wide,
 		grid-column-gap: 16px;
 		grid-template-areas: "site-logo site-logo" "site-title main-navigation" "site-description social-navigation";
 	}
-	.site-header:before, .site-header:after {
+	.site-header-wrap:before, .site-header-wrap:after {
 		content: none;
 		display: none;
 	}
-	.site-header > * {
+	.site-header-wrap > * {
 		margin-top: 0;
 		margin-bottom: 0;
 	}
-	.site-header .site-logo {
+	.site-header-wrap .site-logo {
 		grid-area: site-logo;
 		margin-bottom: 16px;
 	}
-	.site-header .site-title {
+	.site-header-wrap .site-title {
 		align-self: flex-end;
 		grid-area: site-title;
 	}
-	.site-header .site-title + .site-description {
+	.site-header-wrap .site-title + .site-description {
 		margin-top: 0;
 	}
-	.site-header .site-description {
+	.site-header-wrap .site-description {
 		align-self: center;
 		grid-area: site-description;
 	}
-	.site-header .main-navigation {
+	.site-header-wrap .main-navigation {
 		align-self: center;
 		grid-area: main-navigation;
 		justify-self: flex-end;
 	}
-	.site-header .main-navigation > div > ul {
+	.site-header-wrap .main-navigation > div > ul {
 		justify-content: flex-end;
 	}
-	.site-header .main-navigation > div > ul > .menu-item-has-children > a::after {
+	.site-header-wrap .main-navigation > div > ul > .menu-item-has-children > a::after {
 		font-size: 0.5rem;
 	}
-	.site-header .main-navigation > div > ul > li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item > a {
+	.site-header-wrap .main-navigation > div > ul > li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item > a {
 		color: rgba(255, 255, 255, 0.8);
 	}
-	.site-header .main-navigation > div > ul > li:hover > ul,
-	.site-header .main-navigation > div > ul > li.focus > ul,
-	.site-header .main-navigation > div > ul > li.current-menu-item > ul {
+	.site-header-wrap .main-navigation > div > ul > li:hover > ul,
+	.site-header-wrap .main-navigation > div > ul > li.focus > ul,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item > ul {
 		background: #303030;
 		border: 1px solid #101010;
 		border-radius: 5px;
 		overflow: hidden;
 	}
-	.site-header .main-navigation > div > ul > li:hover li,
-	.site-header .main-navigation > div > ul > li.focus li,
-	.site-header .main-navigation > div > ul > li.current-menu-item li {
+	.site-header-wrap .main-navigation > div > ul > li:hover li,
+	.site-header-wrap .main-navigation > div > ul > li.focus li,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li {
 		border-top: 1px solid #101010;
 	}
-	.site-header .main-navigation > div > ul > li:hover li:first-child,
-	.site-header .main-navigation > div > ul > li.focus li:first-child,
-	.site-header .main-navigation > div > ul > li.current-menu-item li:first-child {
+	.site-header-wrap .main-navigation > div > ul > li:hover li:first-child,
+	.site-header-wrap .main-navigation > div > ul > li.focus li:first-child,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li:first-child {
 		border-top: 0;
 	}
-	.site-header .main-navigation > div > ul > li:hover li > a,
-	.site-header .main-navigation > div > ul > li.focus li > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li > a {
+	.site-header-wrap .main-navigation > div > ul > li:hover li > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li > a {
 		background: #303030;
 		color: white;
 		padding: 8px 24px;
 	}
-	.site-header .main-navigation > div > ul > li:hover li:hover > a,
-	.site-header .main-navigation > div > ul > li:hover li.focus > a,
-	.site-header .main-navigation > div > ul > li:hover li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.focus li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus li.focus > a,
-	.site-header .main-navigation > div > ul > li.focus li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li:hover > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
+	.site-header-wrap .main-navigation > div > ul > li:hover li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li:hover li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li:hover li.current-menu-item > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li.focus li.current-menu-item > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li:hover > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li.focus > a,
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
 		background: #CD2220;
 	}
-	.site-header .main-navigation > div > ul > li.current-menu-item > a {
+	.site-header-wrap .main-navigation > div > ul > li.current-menu-item > a {
 		color: inherit;
 		box-shadow: 0 2px 0;
 	}
-	.site-header .social-navigation {
+	.site-header-wrap .social-navigation {
 		align-self: center;
 		grid-area: social-navigation;
 		justify-self: flex-end;
@@ -3595,8 +3595,8 @@ hr.wp-block-separator.is-style-wide,
  */
 #masthead {
 	background: #303030;
-	padding-left: 16px;
-	padding-right: 16px;
+	padding-left: 0;
+	padding-right: 0;
 }
 
 #masthead > * {
@@ -3607,10 +3607,6 @@ hr.wp-block-separator.is-style-wide,
 	color: white;
 }
 
-.site-title + .site-description {
-	margin-top: -16px;
-}
-
 /**
  * Main
  */