/* default */

  header {
    padding:0 5vw;
    position:fixed; z-index:11; top:0; left:0; /*padding:2vw 4vw;*/ width:100vw; height:var(--header-height); /*height:var(--header-height)!important;*/ display:flex; align-items:center;
    transition: padding 100ms linear, border 0s linear;
    font-family: inherit; color:var(--color-text); text-transform:uppercase; font-size:var(--font-size-xsmall); letter-spacing:.05em;
    color:black;
  }
  header .Pattern {
    display:none; position:absolute; z-index:-1; top:0; left:0; width:100vw; height:100%;
    background:var(--color-secondary-dark);
    background:linear-gradient(
      to top,
      rgba(from var(--color-secondary-dark) r g b / 1) 0%,
      rgba(from var(--color-secondary-light) r g b / 1) 100%
    );
    background-repeat:no-repeat;
  }
  header.Dark { background-color:black; }
  header.Transparent { background-color:unset; background-image:unset; background-position:unset; background-size:unset; background-repeat:unset; }
  header.Alert { margin-top:calc(var(--alert-text-size) * 2); }
  header.LoggedIn.ShowAdminBar { margin-top:var(--wp-login-bar); }
  header.LoggedIn.ShowAdminBar.Alert { margin-top:calc(var(--alert-text-size) * 2 + var(--wp-login-bar)); }
  header a { display:flex; flex-direction:column; justify-content:center; }
  header .Logo { width:20%; display:flex; color:inherit; }
  header .Logo button { padding:0; height:100%; align-items:center; }
  header .Logo button svg { height:100%; width:100%; }
  header nav { /*margin-top:.275vw;*/ width:80%; height:100%; display:flex; justify-content:end; align-items:center; }
  header nav .Left { width:unset; display:flex; justify-content:center; }
  header nav .Right { display:flex; justify-content:center; }
  header nav .Right .Cta { margin-right:0; white-space:nowrap; color:inherit; }
  header nav .Right .Cta button { border:0; }
  header nav .Right .Cta.Contact:hover button { color:var(--color-highlight); /*outline:2px solid var(--color-highlight); outline-offset:-2px;*/ }

  header.Stucco { /*padding:1vw 4vw;*/ height:6vw; /*height:6vw!important;*/ align-items:center; /*background-color:black;*/ color:white; background-position:90%; }
  header.Stucco .Cta button { padding:.15vw 1vw; }
  header.Stucco .Pattern { display:block; }
  header.Stucco nav { /*padding-top:1vw;*/ }
  header.Stucco nav ul.Primary { margin-top:0;  }

  header.Minimal .Left { visibility:hidden; }

  /* header nav button { line-height:unset; } */
  header nav ul.Primary { position:relative; margin:0; padding:0; height:inherit; display:flex; list-style:none; }
  header nav ul.Primary > li { flex-grow:1; white-space:nowrap; height:inherit; }
  header nav ul.Primary > li > a { height:inherit; color:inherit; }
  header nav ul.Primary > li > a > button { border-radius:0; height:inherit; }
  header nav ul.Primary > li > a > button span {  }
  header nav ul.Primary > li > a > button span::before { content:attr(data-title); height:0; display:block; overflow:hidden; visibility:hidden; font-weight:bold; }
  header nav ul.Primary > li .material-symbols-outlined { font-size:large; color:black; }
  header nav ul.Primary > li ul.Secondary { display:none; position:absolute; padding-left:0; list-style:none; }
  header nav ul.Primary > li:hover {}
  header nav ul.Primary > li:hover > a > button { background-color:var(--color-primary); color:var(--color-highlight); font-weight:bold; }
  /* header nav ul.Primary > li:hover > a > button:hover { background-color:var(--color-primary); color:var(--color-highlight); } */
  header nav ul.Primary > li:hover ul.Secondary { display:revert; }
  header nav ul.Primary > li:hover .material-symbols-outlined { color:inherit; }
  header nav ul.Secondary { }
  header nav ul.Secondary > li { border-bottom:1px solid black; background-color:var(--color-primary); color:white; }
  header nav ul.Secondary > li a { margin-right:unset; }
  header nav ul.Secondary > li > a button { color:white; }
  header nav ul.Secondary > li > a button span::before { content:attr(data-title); height:0; display:block; overflow:hidden; visibility:hidden; font-weight:bold; }
  header nav ul.Secondary > li:hover > a button { font-weight:bold; color:var(--color--highlight); }
  header nav ul.Secondary > li:hover { }
  header nav ul.Secondary > li:hover > a button { color:var(--color--highlight); }
  header #hamburger { display:none; position:relative; z-index:1; width:6vw; height:6vw; }
  header #hamburger rect { fill:none; stroke:white; stroke-width:.6vw; display:none; }
  header #hamburger line { stroke:black; stroke-width:.3vw; }
  header #hamburger-side { display:none; }

  header nav .Right ul.Primary > li { margin-left:1vw; }
  header nav .Right ul.Primary > li > a { background-color:black; color:white; }
  header nav .Right ul.Primary > li > a > button span { border-radius:.3em; height:50%; padding:0 1em; align-content:center; background-color:inherit; color:inherit; }

/* wide */

  /*@media (min-width: 1441px) {
    header { font-size:1.25vw!important; }
  }*/

/* mobile */

  @media (max-width: 767px) {
    header {
      margin:0; padding:var(--content-spacing-vertical-mobile) var(--content-spacing-horizontal-mobile); /*padding-top:.75rem!important*/;
      justify-content:space-between; height:var(--header-height)!important;
    }
    header.Alert { margin-top:calc(var(--alert-text-size) * 2); }
    /* header.LoggedIn.ShowAdminBar { margin-top:var(--wp-login-bar); } */
    header.LoggedIn.ShowAdminBar.Alert { margin-top:calc(var(--alert-text-size) * 2 + var(--wp-login-bar)) }
    header.Stucco { z-index:3; padding:var(--content-spacing-vertical-mobile) var(--content-spacing-horizontal-mobile); }
    header.Stucco nav { padding-top:unset; }
    /* header.Stucco #hamburger line { stroke:white; } */
    header #logo { margin:0!important; height:100%; }
    header #logo .Mark { width:5vw!important; }
    header .Logo { padding-left:5vw; width:40%; }
    header #hamburger { right:4vw; height:100%; display:flex; flex-direction:column; justify-content:center; }
    header #hamburger svg { width:6vw; }
    header #hamburger svg:hover { cursor:pointer; }
    header #hamburger-side { display:block; zoom:70%; margin-right:12vw; border-radius:.5em; }
    header #hamburger-side button { border-radius:.25em; }
    header nav { flex-grow:1; width:60%; height:100%; }
    header nav .Left { display:none; }
    header nav .Right { padding:0; width:100%; justify-content:right; }
    header nav .Right .Primary { display:none; }
    header nav .Right .Cta.Contact { display:none; margin-right:2rem; /*margin-right:1em;*/ }
    header nav .Right .Cta.Quote { display:none; /*margin-right:1em;*/ }
  }