@media (prefers-color-scheme:dark){ 
	:root {
		--white:#000;
		--white_0:rgba(0,0,0,0);
		--white_5:rgba(0,0,0,0.5);
		--white_8:rgba(0,0,0,0.8);
		--white_9:rgba(0,0,0,0.9);
		--light:#222;
		--light_7:rgba(34,34,34,0.7);
		--light_8:rgba(34,34,34,0.8);
		--light_9:rgba(34,34,34,0.9);
		--light_shadow:	#bbb;
		--dark_shadow:	#666;
		--gray:	#999;
		--dark:	#f3e9e7;
		--black:#fff;
	
		--color:#EC0B43;
		--color2:#F71950;
	
	
		--red: 		#EC0B43
		--platinum: #DEE5E5
		--light_cfix:#f7f8fa;
		--green: 	#4CB944
		--black2: 	#0C1618
		--blue: 	#3066BE
	
	}

	header > nav > a:after,
	header > nav > a > span { mix-blend-mode:lighten; }
	#o-mne_wrapper p > img.podpis { filter:invert(1); }
	#technologie_wrapper > div > div > a.invert > img,
	#zkusenosti_wrapper ul > li.icon-clock-running:before { filter:invert(1); }
	
}
@media (orientation:portrait){
	#portfolio_wrapper article > div.metadata {  }
}

@media (min-width:800px){
	header > nav > a:before { display:none; }
}
@media (max-width:799px){
	html { font-size:2.25vw; }
	
	#portfolio_wrapper h2 { padding-bottom:3rem; margin-bottom:-4rem; }
	#portfolio_wrapper > a[name]:first-child { height:2rem; }
	#portfolio_wrapper article { padding:0; margin-bottom:3rem; }
	#portfolio_wrapper article > div.metadata { display:block; width:calc(100vw - 4rem); top:0rem; margin:0; padding:5rem 2rem 2rem; z-index:2; background:var(--white_9); }
	#portfolio_wrapper article > div.images { display:block; width:auto; z-index:1; padding:0 2rem; margin-bottom:6rem; }
	#portfolio_wrapper article > div.images > img { margin-bottom:4vw; }
	#portfolio_wrapper article.clip_zigzag > div.images { margin-bottom:0; }
	#portfolio_wrapper article.clip_zigzag > div.metadata { margin-left:0; background:var(--light_9); }
	#zkusenosti_wrapper { width:36.44rem; padding:0 2rem 0 6rem; }
	#technologie_wrapper > div > div.sticky { padding-bottom:4rem; }
	header > nav > a:after { display:none; }
	header > nav > a[class^="icon-"] { width:3rem; height:3rem; overflow:hidden; padding:0; }
	header > nav > a[class^="icon-"]:before { display:block; font-size:1.5rem; height:3rem; width:3rem; text-align:center; line-height:3rem; color:var(--red); }

	#technologie_wrapper > div > div { padding-top:2.5rem; padding-bottom:3.5rem; }

}