/* 4 - logo, 3 - nadpis, 2 - fakulta, 1 - posun */

:root {
	--green: #007C58;
	--blue: #2677b8;
	--barva1: var(--green);
	--barva2: var(--blue);

	--barva1_opacity: #007C58dd;
	--barva1_opacity_50: #007C5877;
	--barva2_opacity: #2677b8dd;
	--barva2_opacity_50: #2677b877;

	--border_color: var(--green);
	--tlacitko_border_hover: var(--blue);

	--max_logo_width: 180px;
	--horizontal_menu_height: 80px;
}
body { font-size: 1.2em; }
a.tlacitko { padding: 0.3em 1.3em; }
a.tlacitko:hover { border-color: var(--tlacitko_border_hover); }
a.tlacitko.white { background-color: #FFF; color: var(--green); }
a.tlacitko.white:hover { background-color: var(--blue); color: #FFF; }

#scrollToHome {box-shadow: 0 0 3px #FFF;}

#horizont-0 {z-index: 2; padding-bottom: 0; }


#banhead { box-sizing: border-box; border-top: 180px solid #FFF; border-left: 160px solid #FFF; }
#banhead::before { content: ""; display: block; background: url('img/ruze.svg') no-repeat left bottom; background-size: 150%; top: -120px; right: 0; position: absolute; width: 350px; height: 510px; z-index: 1; }
#banhead::after { content: ""; display: block; background: var(--barva1_opacity_50); top: -40px; left: 100px; right: -40px; bottom: 0; position: absolute;}

div.hp_only { position: relative;  padding-left: 90px; margin-top: 40px; padding-bottom: 210px; }
/*div.hp_only::before { content: ""; position: absolute; left: -70px; top: 0; bottom: 0; display: block; width: 160px; background: url('img/2026.png') no-repeat left center; background-size: contain; }*/
#head_envelope::after { content: ""; position: absolute; left: 110px; top: 180px; bottom: 0; display: block; width: 154px; background: url('img/2026.svg') no-repeat left center; background-size: contain; }
#head_envelope.subpage::after { display: none; }

#float_icons_part_5 { float: none; width: 80%; margin-top: 90px; }
#float_icons_part_7 { margin: 0; position: absolute; bottom: 0; left: 0; right: 0; height: 210px; text-align: right; }
#floatingImage_2 { position: absolute; bottom: 0; left: calc(50% - 20px);}
#floatingImage_3 { margin: 0; }

#topline { z-index: 2; }


	.subpage #banhead::before {
		width: 140px;
		height: 220px;
	}


@media(min-width: 1050px) {
	#float_icons_part_1 {padding-top: 27px;}
	#float_icons_part_5 {margin-top: 105px;}
}

@media(min-width: 1240px) {
	#float_icons_part_5 {margin-left: 40px;}
}

@media(min-width: 1800px) {
	#float_icons_part_5 {margin-left: 70px;}
}

@media(max-width: 1900px) {
	#banhead { border-left-width: 100px; }
	#head_envelope::after { left: 50px; }
}

@media(max-width: 1800px) {
	#banhead { border-left-width: 50px; }
	#head_envelope::after { left: 0px; }
}

@media(max-width: 1800px) {
	div.hp_only { padding-left: 140px; }
	#banhead { border-left-width: 50px; }
	#head_envelope::after { left: 0px; }
}
@media(max-width: 1090px) {
	#float_icons_part_5 {width: 100%;}
}
@media(max-width: 1049px) {
	#floatingImage_4 { margin-top: 0; }
}
@media (max-width: 860px) {
	div.hp_only { padding-left: 80px; }
	#banhead {overflow: visible;}
	#banhead::before { width: 270px; height: 430px; }
	#head_envelope::after { width: 104px; }
	#banhead { border-left-width: 33px; }
	#banhead::after { left: 68px; }
}
@media (max-width: 700px) {
	#floatingImage_4 { margin-right: 0; }
	ul#m0 li { margin: 0 0.6em; }
}
@media (max-width: 640px) {
	#banhead::before { width: 140px; height: 220px;}
	#float_icons_part_7 { left: 92px; width: initial; text-align: center; }
	#floatingImage_1 {margin: 0 8px 0 0px;}
	#floatingImage_4 {margin: 0;}
	#float_icons_part_1 { margin-top: 0; }
	#horizont-0 {z-index: 3;}
	ul#m0 li { margin: 0; }
}

@media (min-height: 840px) and (orientation: landscape) {
	#floatingImage_2 {}
	.homepage #topline {
		bottom: 0;
		position: absolute;
		left: 0;
		right: 0;
		top: 80px;
	}
	.homepage #topline-in {
		height: 100%;
	}
	.hp_only {
		height: calc(100% - 170px);
		box-sizing: border-box;
	}
}
@media (min-height: 660px) and (orientation: portrait) {
	#floatingImage_2 {}
	.homepage #topline {
		bottom: 0;
		position: absolute;
		left: 0;
		right: 0;
		top: 40px;
	}
	.homepage #topline-in {
		height: 100%;
	}
	.hp_only {
		height: calc(100% - 190px);
		box-sizing: border-box;
	}
}
@media (min-height: 660px) and (min-width: 641px) and (orientation: portrait) {
	.homepage  #topline {top: 110px;}
	.hp_only {height: calc(100% - 120px);}
}


