.header{
/*	background-image: url('/assets/imgs/header-d.png');*/
	background-size: 100% auto;
	padding: 0.3vw 0;
	display: grid;
	grid-template-columns: var(--grid-cols);
    gap: var(--grid-gap);
    font-size: var(--header-fs);
    position: sticky;
    top: 0;
    z-index: 1;
/*    background: blue;*/
}

.headerChild{
	z-index: 10;
}

.headerRight{
	font-size: var(--header-right-fs);
	display: grid;
}

.headerLeft .headerChildItem, .headerLeft a{
	text-transform: uppercase;
	font-family: "bb-modern-semicondensed-pro";
}

.headerRight span{
	line-height: 1em;
}

.header svg{
	height: var(--header-h);
	transition: 0.4s fill;
}

.headerChild svg g {
  transition: transform 0.8s ease; /* smooth animation */
  transform-origin: center center; /* make sure they rotate/translate from center */
  display: inline-block;
}



.headerChild a, .headerChild p{
	margin: 0;
	text-decoration: none;
	color: black;
	transition: 0.4s color;
}
.headerChild a::visited{
	color: black;
}


#hFilters{
	cursor: pointer;
}

#hHome a{
	transition: 0.2s filter;
}

#hAbout{
	grid-column-start: 3;
}

#hContact{
	grid-column-start: 8;
}

#hAddress{
	grid-column-start: 10;
}

#hSm{
	grid-column-start: 12;
}

@media screen and (orientation: landscape) and (max-width: 1020px){
	:root{
		--header-fs: 1.2vw !important;
	}
}

@media screen and (orientation:portrait) and (min-width: 600px){
	:root{
		--header-fs: 2.5vw !important;
		--grid-gap: 2vw !important;
	}
}

@media screen and (orientation:portrait) and (max-width: 600px){
	:root{
		--header-fs: 3.5vw !important;
		--grid-gap: 2vw !important;
	}
}

@media screen and (orientation:portrait){
	/*:root{
		--header-fs: 3.5vw !important;
		--grid-gap: 2vw !important;
	}*/

	.header{
		padding-top: 1vh;
	}
	.headerChild.headerRight{
		display: none;
	}
	.headerChild#hHome{
		grid-column-start: 1;
    grid-column-end: 5;
	}
	.headerChild#hAbout{
		grid-column-start: 6;
    grid-column-end: 9;
	}
	.headerChild#hFilters{
		grid-column-start: 9;
    grid-column-end: 12;
	}
}