#homepage {
	position:relative;
	padding-bottom: 10em;
}

#watermark {
	position: absolute;
	top: 0;
	width: 30vw;
	left: 50%;
	margin-left: -15vw;
	z-index: 1;
}

#background-middle {
	padding-top: 25em;
	/*background-image: url('homepage/watermark-ar-grey-sliced-top.svg');background-size: 30%;*/
	background: url('homepage/background-middle.jpg?ver=1') bottom no-repeat;
	background-size: 100vw;
}

#homepage #nav-container {
	position: relative;
	margin-top: -20em;
	margin-bottom: 20em;
	padding-top: 60%;
}

#homepage nav {
	display: block;
	position: absolute;
	left:0;
	top:0;
	right:0;
	bottom: 0;
	z-index: 2;
}

#homepage nav img#homepage-logo {
	display: block;
	width: 34%;
	position: absolute;
	top: 50%;
	margin-top: -5%;
	left: 50%;
	margin-left: -17%;
}

#homepage nav span{
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	background-position:top;
	position: absolute;
}

#homepage nav span a {
	display: block;
	position: absolute;
	font-family: 'Caveat', cursive;
	color: #98ca3c;
	font-size: 2.4em;
}

#homepage nav span a:hover {
	color: #78aa1c;
	text-decoration: none;
}

#homepage .black-box {
	position: relative;
}

@media (max-width: 1199px) {
	#homepage nav span a {
		font-size: 1.98em;
	}
}

@media (max-width: 991px) {
	#homepage nav span a {
		font-size: 1.51em;
	}
}

@media (max-width: 767px) {
	#homepage nav span a {
		font-size: 2.7vw;
	}
}

#homepage nav #nav-o-nas{
	background-image: url('homepage/button-o-nas.svg?ver=1');
	left: 15%;
	top: 55%;
	width: 45%;
	height: 45%;
}

#homepage nav #nav-o-nas a{
	padding: 3% 16%;
	top: 75%;
	left: 7%;
}

#homepage nav #nav-prodavate{
	background-image: url('homepage/button-prodavate.svg?ver=1');
	left: 0;
	top: 34%;
	width: 40%;
	height: 30%;
}

#homepage nav #nav-prodavate a{
	padding: 4.2% 13.5%;
	top: 17%;
	left: 0.5%;
}

#homepage nav #nav-kupujete{
	background-image: url('homepage/button-kupujete.svg?ver=1');
	left: 20%;
	width: 25%;
	height: 35%;
	top: 10%;
}

#homepage nav #nav-kupujete a{
	padding: 8% 32%;
	top: 2%;
}

#homepage nav #nav-pronajimate{
	background-image: url('homepage/button-pronajimate.svg?ver=1');
	left: 55%;
	top: 15%;
	width: 25%;
	height: 30%;
}

#homepage nav #nav-pronajimate a{
	padding: 6% 24%;
	top: 2%;
}

#homepage nav #nav-dalsi-sluzby{
	background-image: url('homepage/button-dalsi-sluzby.svg?ver=1');
	left: 70%;
	top: 46%;
	width: 30%;
	height: 25%;
}

#homepage nav #nav-dalsi-sluzby a{
	padding: 6.5% 28.8%;
	top: 40%;
}

#homepage nav #nav-kontakty{
	background-image: url('homepage/button-kontakty.svg?ver=1');
	left: 55%;
	top: 55%;
	width: 35%;
	height: 34%;
}

#homepage nav #nav-kontakty a{
	padding: 3.6% 28.2%;
	top: 67%;
	left: 9%;
}

#homepage nav #nav-blog{
	background-image: url('homepage/button-blog.svg?ver=1');
	left: 5%;
	top: 57%;
	width: 34%;
	height: 30%;
}

#homepage nav #nav-blog a{
	padding: 3.4% 21%;
	top: 20%;
	left: 0.5%;
}

#homepage h1 {
	font-size: 2.6em;
	text-align: left;
	padding: 0;
	margin-bottom: 0.5em;
}

#homepage .stamp {
	position: absolute;
	right: -6vw;
	bottom: -7vw;
	width: 13vw;
}

#homepage h2 {
	margin-top: 3em;
	margin-bottom: 1em;
	background: url('homepage/bubble-vzdy-neco-navic.svg') center no-repeat;
	background-size: contain;
	padding: 13% 30% 15% 10%;
	font-size: 3.5em;
	text-align: center;
}

@media (max-width: 1199px) {
	#homepage #nav-container {
		margin-bottom: 10em;
	}

	#homepage h2 {
		margin-top: 1em;
		margin-bottom: 0em;
	}
}

@media(max-width: 991px) {
	h1 {
		font-size: 3em;
	}

	.black-box .lead{
		font-size: 1.5em;
	}

	#homepage h2 {
		font-size: 2.2em;
	}
}

@media (max-width: 767px) {
	#homepage h1 {
		font-size: 2em;
		background: none;
	}

	#homepage .lead.handwritten {
		font-size: 1.5em;
	}

	#homepage h2 {
		font-size: 1.9em;
		margin-top: 0;
		margin-bottom: 0;
	}

	#photo-makler {
		display: none;
	}
}

@media (max-width: 480px) {
	#homepage {
		padding-bottom: 4em;
	}

	#homepage #nav-container {
		margin-bottom: 5em;
	}
}

#photo-makler {
	width: 70vw;
	position: absolute;
	right: 0;
	bottom: 0;
}