/*
	Move the main menu items down and to the left side of the header
	(bringing the look of the header closer to the new HeaderCommerce without changing any HTML)
	
	(to be used in conjunction with JS that actually calculates the menu position and moves it to the correct spot -
	this CSS just hides the menu before the JS kicks in to prevent visible jumping around
	and sets a few styles [e.g. header height] that can be calculated in advance even though the JS sets them too)
*/

@media only screen and (min-width: 992px) {

  .O-Header {
	height: 150px;
  }
  
  .O-Header:has(.o-header__breadcrumbs) {
	height: 198px;
  }  
  
  .M-Main-Navigation__buttons--shortcuts.is-visible {
    position: absolute;
	width: 100%;
	visibility: hidden;
  }
  
}