div#page>header>a#gocontent {
	display: none;
	}

@media only screen and (max-width: 888px) {

	#gohome {
		display: block;
		position: absolute;
		top: 0.75rem;
		left: 1rem;;
		height: 3.5rem;
		width: 11rem;
		cursor: pointer;
		opacity: 0;
		z-index: 2000;
		}

	#hamb + label {
		color: #D3D3D3;
		position: absolute;
		top: 0.5rem;
		left: 87vw;
		z-index: 200;
	}
	
	#hamb + label::before {
		font-size: 3em;
		content: "\2261"; 
	}

	#hamb:checked + label::before {
		color: #181818;
		content: "\00d7"; 
	}

	#hamb:checked ~ main {
		display: none;
	}

	#hamb:checked ~ footer {
		display: none;
	}

	#hamb ~ header nav:not(.breadc) {
		display: none;
	}	

	#hamb ~ header nav p, #hamb ~ header nav .extra {
		display: none;
	}

	#hamb:checked ~ header > nav {
		position: relative;
		display: block;
		z-index: 200;
		height: 100%;
		overflow-y: scroll;
		overflow-x: hidden;
		scrollbar-width: none;
		}

	#hamb:checked ~ header > nav::-webkit-scrollbar {
    	display: none;
  		}

	#hamb:checked ~ header > nav:hover {
		overflow-y:auto;
  		scrollbar-width: auto;
		}
		
	#hamb:checked ~ header nav ul {
		margin: unset;
		padding: unset;
		list-style: none;
		}

	#hamb:checked ~ header nav ul.l2>li:has(input:checked) ul.l3 {
		display: block ;
		}

	#hamb:checked ~ header nav ul.l2>li:not(:has(input:checked)) ul.l3:not(:has(:is(.select,.s_child))) {
		display: none;
		}

	#hamb:checked ~ header nav ul ul li {
		margin: 1rem;
		line-height: 1rem;
		color: #181818;
		}

	#hamb:checked ~ header nav ul li.s_child {
		color: #181818;
		list-style-type: disclosure-open;
		}

	#hamb:checked ~ header nav ul ul li.select {
		list-style-type: disclosure-closed;
		}
	
	#hamb ~ header {
		position: absolute;
		z-index: 10;
		top: 0;
		left: 0;
		right: 0;
		height: var(--header-height);
		min-height: 90px;
		padding: 1rem 1rem 1rem 1rem;
		background-color: #040707 ;
		background-image: var(--header-logo-g-bg), var(--header-bg-url);
		background-repeat: no-repeat, no-repeat;
		background-size: 10rem auto,var(--header-bg-size);
		background-position: 1rem 1rem,var(--header-bg-pos);
		}
	
	#hamb:checked ~ header {
		top: 0;
		bottom: 0; 
		left: 0;
		right: 0;
		height: unset;
		padding: 8rem 0 1rem 1.5rem;
		background-color: #FAE700 ;
		background-image: var(--header-logo-b-bg);
		background-repeat: no-repeat;
		background-size: 10rem auto;
		background-position: 1rem 1rem;
		}

	#hamb:checked ~ header>h1, #hamb:checked ~ header>div.breadc, #hamb:checked ~ header>nav.breadc {
		display: none;
		}

	header>div:first-of-type {
		position: absolute;
		bottom: 5rem;
		left: 1rem;	
		color: #FAE700;
		font-size: 2rem;
		font-weight: 200;
		text-transform: uppercase;
		letter-spacing: 0rem;
		line-height: 2.1rem;
		/* word-spacing: 100vw; /* #FIXME */
		}
/*
	header>div:first-of-type>span::after {
  		content: '\A';
  		white-space: pre-wrap;
  	}
*/

	header div.breadc, header nav.breadc {
		position: absolute;
		bottom: 1.5rem;
		left: 0;
		margin: 0 0 0 1rem;
		padding: 1rem 1rem 0 0rem;
		font-size: 0.8rem;
		line-height: 1rem;
		}

	header div.breadc a, header nav.breadc a {
		color: #D3D3D3;
		}

	header div.breadc a:hover, header nav.breadc a:hover {
		color: #FAE700;
		}

	header nav.breadc ol>li {
		display: inline-block;
	} 

	header nav.breadc ol>li:not(:last-child):after {
		content: ' / ' ;
	} 



	#bg_logo_a {
		display: none;
  		position: fixed;
  		bottom: 5%;
  		right: 0;
 		width: auto;
  		height: 12rem;
  		z-index: 100;
  		transform-origin: bottom left ;
		}

		/* Hide warning block in case :has() support – including relative selectors – is detected */
		@supports selector(:has(+ *)) {
			#bg_logo_a {
			display: block;
		  }
		}

	#hamb:checked ~ header>nav a, #hamb:checked ~ header>nav span, #hamb:checked ~ header>nav h3, #hamb:checked ~ header>nav span[aria-level="3"] {
		display: block;
		width: 100%;
		padding: 0.25rem 20% 0.25rem 0 ;
		color: #181818;
		}

	#hamb ~ header #header {
		display: none;
		}

	#hamb ~ header #header label {
		display: block;
		cursor: pointer;
		}

	#hamb:checked ~ header #header {
		display: block;
		background-image: var(--image-1828);
		background-repeat: no-repeat;
		background-position: right bottom 1rem;
		background-size: 16% auto;
		}

	#hamb:checked ~ header #header div .sub {
		margin-left: 1.5rem; 
		}

	#hamb:checked ~ header #header div:not(.s_child) .sub {
		display: none;
		}

	#hamb:checked ~ header h2.btn, #hamb:checked ~ header span[aria-level="2"], #hamb:checked ~ header span[aria-level="2"] {
		display:block;
		font-size: 1.5rem;
	 	text-transform: uppercase;
		font-weight: normal;	
		letter-spacing: 0.1rem;
		line-height: 1;
		padding: 0.3rem 0 0 0; /* fix font */
		margin: 0.5rem 0;
		}	

	#hamb:checked ~ header h3, #hamb:checked ~ header span[aria-level="3"] {
		display:block;
		font-size: 1.1rem;
	 	font-weight: normal;
	 	letter-spacing: 0.1rem;
	 	margin: 1.5em 0; 
		line-height: 1;
		}

	#hamb:checked ~ header div.btn_wrap {
		margin-bottom: 1.5rem;	
		}
	
	/* #hamb:checked ~ header #header div.btn_wrap>input:checked ~ label, */
	#hamb:checked ~ header #header div.btn_wrap.s_child > label:first-of-type {
		border-left: 1px solid black;
		}

	#hamb:checked ~ header #header div.btn_wrap input:checked ~ div.sub, #hamb:checked ~ header #header div.btn_wrap.s_child {
		display: block;
		}

	header>nav>div>label {
		display: block;
		padding-left: 0.3rem;
		border-left: 1px solid transparent ;
		}
		
	#bg_logo_a:has(+ div #hamb:not(:checked)) { /* FF: https://bugzilla.mozilla.org/show_bug.cgi?id=418039 */
		display: none ;
		}

	}

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


	#gohome {
		display: block;
		position: absolute;
		top: 0.75rem;
		left: 1.5rem;;
		height: 3.5rem;
		width: 11rem;
		cursor: pointer;
		opacity: 0;
		z-index: 2000;
		}

	header {
		position: relative;
		height: var(--header-height);
		background-image: var(--header-bg-url);
	  	background-size: var(--header-bg-size);
	  	background-repeat: no-repeat;
	  	background-position: var(--header-bg-pos);
	}

	header>div:first-of-type {
		font-size: 2rem;
		position: absolute;
		bottom: 2rem;
		left: 0;
		color: #FAE700;
		font-weight: 200;
		text-transform: uppercase;
		margin: 0 0 2rem 2.2rem;
		line-height: 1.9rem;
		max-width: 500px;
	}

	header div.breadc, header nav.breadc {
		font-size: 0.8rem;
		position: absolute;
		bottom: 0;
		left: 0;
		color: #D3D3D3;
		font-weight: 200;
		margin: 0 0 1rem 2.2rem;
		line-height: 0.90em;
	}

	header div.breadc a, header nav.breadc a {
		color: #D3D3D3;
	}

	header div.breadc a:hover, header nav.breadc a:hover {
		color: #FAE700;
	}

	header nav.breadc ol>li {
		display: inline-block;
	} 

	header nav.breadc ol>li:not(:last-child):after {
		content: ' / ' ;
	} 


	#bg_logo_a {
		display: none;
	}	

	#hamb {
		display: none;
	}

	div.mmenu {
		display: none;	
	}

	nav#header {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: flex-start;
		gap: 0.1rem;
		height: 4rem;
		margin-top: 0rem;
		padding-top: 1rem;
		padding-left: 10rem;
		padding-right: 1rem;
		background-position-y: 1rem;
		background-position-x: 2rem;
		background-image: var(--header-logo-g-bg);
		background-repeat: no-repeat;
		background-size: 10rem auto;
		}

	nav#header input {
		position: relative;
		z-index: 20000;
		display: none; 
		}

	#header ul {
		/* border: 4px solid red;*/
		color: #D3D3D3;
		padding-top: 1rem;
		}

	#header ul.l2 ul {
		color: white;
		padding-top: 1rem;
		padding-left: 1rem;
		}

	#header ul a {
		color: #D3D3D3;
		}

	#header ul a:hover {
		color: #FAE700;
		}

	#header ul>li>a {
		display: block;
		}


	/*   BUTTONS  */

	.btn {
	  display: block;
	  color: #D3D3D3;
	  text-align: center;
	  text-decoration: none;
	  border: 0;
	  outline: 0;
	  padding: 0.2rem max(1vw,0.7rem) ;
	  border-radius: 0.4rem;
	  letter-spacing: 0.05rem;
	  text-transform: uppercase;
	  font-size: 0.6rem;
	  width: fit-content;
	  white-space: nowrap;
	  font-weight: normal;
	}

	.btn a, .btn span {
		display: block;
		color: #D3D3D3;
		padding: 0.75rem 0 0.5rem 0;
		line-height: 0;
		font-weight: 400;
		font-size: 0.7rem;
	}

	.btn a {
		cursor: pointer;
	}

	.btn_wrap.compact {
		display: none ;
		}

	.btn:hover, .btn_wrap:hover .btn {
	  background-color: #FAE700;
  	  transform: skew(-21deg); 
	}

	.btn.s_child, .btn_wrap.s_child .btn, 
	.btn.select, .btn_wrap.select.btn {
		color: #FAE700;
	}

	.btn:hover a, .btn_wrap:hover .btn a, .btn:hover span, .btn_wrap:hover .btn span {
		color: #040707;
		transform: skew(21deg);
	}

	.btn:not(:hover).s_child a, .btn_wrap:not(:hover).s_child .btn a, .btn:not(:hover).s_child span, .btn_wrap:not(:hover).s_child .btn span,
	.btn:not(:hover).select a, .btn_wrap:not(:hover).select .btn a, .btn:not(:hover).select span, .btn_wrap:not(:hover).select .btn span {
	  	color: #FAE700;
	}
	  
	#header label {
		z-index: -20000;
		}

	.sub {
		display: none;
		width: 100%;
		background-image: linear-gradient(to bottom, transparent 0, transparent 1rem, #040707 1rem, #040707 25rem, transparent 30rem);
		position: absolute;
		top: 4rem;
		left: 0px;
		color: white;
		z-index: 100;
/*		border: 1px solid white; */
		height: 50vh;
		padding-top: 1rem;
		}

	.sub h3, .sub span[aria-level="3"] {
		font-weight: normal;
		font-size: 0.8rem;
		line-height: 0.9rem;
		padding: 0.5rem 0.5rem 0.5rem 1rem;
		display: block;
		cursor: pointer;
		}

	.sub h3:hover, .sub span[aria-level="3"]:hover {
		background-color: #FAE700;
		color: #181818;
		}

	.sub ul.l2 li:hover, .sub ul.l2 li.s_child {
		color: #FAE700;
		}


	.sub ul {
		list-style-type: none;
		}

	.sub>ul {
		width: 20vw;
		}

	#header .btn_wrap:hover .sub>ul:not(:has(input:checked)) li:first-of-type input ~ div {
		display: block;
	/*	border: 1px solid yellow;*/
		}

	.sub>ul li:hover {
	/*	background-color: green; */
		}

	.sub>ul.l2>li.select:not(.select-false),
	.sub>ul.l2:not(:has(input:checked))>li:first-of-type {
		background-color: #FAE700;
		color: #181818;
		}

	.sub>ul li>div {
		display: none;
		position: absolute;
		top: 1rem;  /* must match the top-padding value of .sub */
		left: 20vw;
		width: calc(100% - 20vw);
		}

	#header .sub li:not(.s_child) input[type="radio"]:checked + label,
	#header .sub li:not(.s_child):hover label {
		display: block;
		background-color: #FAE700;
		color: #181818;
		}		

	#header .sub input:checked ~ div, #header .btn_wrap:hover .sub>ul:not(:has(input:checked))>li:first-of-type input ~ div {
		display: block;
		min-height: 20rem; 
		border-left: 1px solid gray;
		}

	#header.sub input:checked ~ label, #header .btn_wrap:hover .sub>ul:not(:has(input:checked))>li:first-of-type input ~ label {
		display: block;
	/*	background-color: green;  */
		}

	.btn_wrap {
		display: inline-block;
	/*	border: 1px solid green; */
		margin-top: 1rem;
		}
		
	.btn_wrap:hover {
		height: 3rem;
		}

	.btn_wrap:hover .sub, .btn_wrap .sub:hover {
		display: block;
		height: 30rem;
		}

/* FF fix needed */
/*
header:has(.btn.pivot:hover), header:has(.btn_wrap.pivot:hover) {
	background-image: none ;
	}
*/

#header ul.l2 ul.l3 {
	padding: 3rem 1rem 3rem 1rem ;
	}

#header ul.l2 > li > div > p {
	font-size: 0.8rem;
	}

#header ul.l3 {
	padding-right: 1rem;
	display: flex ; 
	flex-wrap: wrap;
	gap: 1rem;
	}

#header ul.l3>li {
	font-size: 0.8rem;
	line-height: 0.8rem;
	width: calc(33.33% - ((2*1rem)/3));
	border-bottom: 1px solid #D3D3D3;
	min-height: 3rem;
	}

#header ul.l3>li.select, #header ul.l3>li:hover {
	border-bottom: 1px solid #FAE700;
	}

#header ul.l3>li a {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: left;
	align-content: center;
	padding: 0.75rem 0.75rem 0.75rem 0 ;
	}

#header ul.l3>li.select a {
	color: #FAE700;
	}
	
ul.l2>li>div>p {
   position: absolute;
   left: 1rem;
   top: 1rem;
   padding: 0rem;
   }

ul.l2>li>div>p>a::after {
  	content: ' \2192'
}

ul.l2>li>div>p.select>a::after {
	visibility: hidden;
}

#header ul.l2>li>div>p>:is(a,span) {
	display: inline-block ;
	color: #D3D3D3;
	padding: 0.5rem 0 ;
	}

#header ul.l2>li>div>p:hover>a, #header ul.l2>li>div>p.select>a {
	color: #FAE700;
}
	
ul.l2, ul.l3 {
	border-top: 1px solid gray;
	}