@font-face {
	font-family: moderat-regular;
	src: url(../fonts/moderat-regular.otf)
}
@font-face {
	font-family: moderat-black;
	src: url(../fonts/moderat-black.otf)
}

html, body {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
}

body {
	font-size: 1em;
	font-family: moderat-regular;
	background: url(../img/header-pattern.svg) no-repeat left top;
	background-size: 90% auto;
}

.wrap {
	max-width: 62em;
	margin: 0 auto;
	padding: 0 1em;
}

.messenger {
	max-width: 100%;
	display: block;
	margin-top: 2em;
}
.messenger img { max-width: 12em; }

h1, h2, h3 { font-family: moderat-black; }
h1 { color: #d63647; margin-bottom: 0; clear: both; font-size: 3em; }
h2, h3 { color: #1fbcc6; }

p { line-height: 1.6; }

header { width: auto; }
header .logo { padding: 2em; float: right; text-align: center; box-sizing: border-box; }
header .logo img { height: 7.5em; }
header .row { height: 45em; margin: 0; padding-bottom: 10em; }
header .row img { max-height: 32em; }
header .row p { text-align: justify; max-width: 45%; font-size: 1.2em; margin: 2em 0; }

main {
	padding: 12em 0;
	margin-top: -22em;
	margin-bottom: -18em;
	background: url(../img/timeline.svg) no-repeat center top;
	background-size: auto 100%;
}

.pathstart {
	width: 8em;
	height: 8em;
	position: relative;
	left: 50%;
	top: -12em; /* padding main */
	margin-left: -2.5em; /* začátek ve vektoru není vycentrovaný */
}

.row { height: auto; width: 100%; display: flex; justify-content: space-between; align-items: center; flex-direction: row; margin: 10em 0; }
.row>img { max-height: 30em; max-width: 40%; }
#pribeh { padding-top: 4em; }

article {
	background-image: url(../img/box-border-m.png);
	background-size: 100% 100%;
	position: relative;
	max-width: 32%;
	padding: 2.4em;
	padding-left: 2.8em;
}
article.border-s { background-image: url(../img/box-border-s.png); }
article.border-l { background-image: url(../img/box-border-l.png); }
article h2 { margin-top: -1.5em; font-size: 3.2em; white-space: nowrap; }
article:nth-child(1) h2 { margin-right: -1.2em; text-align: right; }
article:nth-child(2) h2 { margin-left: -1.2em; }

@media screen and (max-width: 699px) {
	body { background: none; font-size: 1em; }

	.messenger { margin-left: auto; margin-right: auto; }

	header { width: 100%; }
	header .logo { padding-top: 30px; width: 100%; float: none; margin: 0 auto; }
	header .row p { max-width: 100%; }

	main { background: none; }

	.pathstart { display: none; }

	.row { flex-direction: column; margin: 4em 0; }
	.row:nth-child(even) { flex-direction: column-reverse; }
	.row>img { max-height: 80%; max-width: 80%; margin: 1em 0; }

	article {
		max-width: 100%; align-self: center !important; padding: 3em;
		background-image: url(../img/box-border-phone.png) !important;
	}
	article h2 { margin-top: auto; font-size: 2.3em;  white-space: initial; }
	article:nth-child(1) h2 { margin-right: auto; text-align: right; }
	article:nth-child(2) h2 { margin-left: auto; }
}

/* Odstraneni stylu u tlacitka */
input, button, submit { border:none; background-color: inherit; }