:root{
	--txt: #383429;
	--s: #bbb;
	--w: GhostWhite;
}

html{margin:0;padding:0;}

body{
	margin: 0;
	padding: 0;
	text-rendering: optimizeLegibility !important;
	font-family: 'EB Garamond', serif;
	font-size: 120%;
	line-height: 1.25em;
	font-weight: 500;
	font-style: normal;
	color: var(--txt);
	background: url('../img/bck.gif');
}
*, *:before, *:after, div, h1, h2, h3, h4, h5, h6, p, a, ol, dl, ul, span {box-sizing:  border-box !important;}


h1, h2, h3, h4, h5, h6, p, ul, ol, dl{
	text-shadow: var(--s) 0 0 .125em;
}

a, a:link, a:visited{
	color: var(--text);
	text-decoration: none;
	background: transparent;
}
a:hover, a:active{
	color: var(--text);
	text-decoration: none;
	background: var(--s);
}

header{
	width: 20%;
	padding: 20% 0 0 0;
	height: 0;
	margin: 1.25em 40% 0;
	float: left;
	background: url("../img/logo.png") no-repeat;
	background-size: 100% auto;
	background-position: center;
}
header h1{
	visibility: hidden;
}

.bckg{
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	height: 30em;
	padding: 0;
	float: left;
	box-shadow: inset var(--txt) 0 .125em .625em 0;
	text-align: center;
}
.jedan{
	background-image: url('../img/012.jpg');
}
.dva{
	background-image: url('../img/042.jpg');
}
.tri{
	background-image: url('../img/032.jpg');
}

.opis{
	width: 100%;
	float: left;
	text-align: center;
	padding: 5em 25%;
	margin: 0;
	background: url('../img/bck.gif');
}

.txt{
	width: 50%;
	float:left;
}

.sorte{
	width: 100%;
	float: left;
	text-align: center;
	padding: 5em .625em;
	margin: 0;
	background: url('../img/bck.gif');
}

.sorte .txt{
	width: 25%;
	padding: .625em;
	float:left;
}

h2{
	font-size: 1em;
	line-height: 1.25em;
	text-transform: uppercase;
	letter-spacing: .125em;
	margin: 0 12.5% 1.25em;
	width: 75%;
	float:left;
	height: 2.5em;
	font-weight: 500;
}

.sorte h2{
	font-size: 1.5em;
	line-height: 1.2em;
	text-transform: none;
	letter-spacing: 0;
	margin: 0 0 .6em;
	width: 100%;
	float:left;
	font-weight: 500;
	height: 1.66em;
	font-style: italic;
}

ul.litraza{
	list-style: none;
	width: 100%;
	float: left;
	padding: 0 .625em;
	cursor: default;
	margin: 0 0 1.25em;
}
.litraza li{
	font-size: .75em;
	float: left;
	margin: .3125em;
	padding: .10625em .3125em;
	border: 1px solid var(--s);
	width: calc(100% / 4 - .625em);
	border-radius: .3125em;
	background: transparent;
}
.litraza li:hover{
	background: var(--s);
}

.d p{
	font-size: 1em;
	line-height: 1.25em;
	text-transform: uppercase;
	letter-spacing: .125em;
	margin: 0 12.5% 0;
	width: 75%;
	float:left;
	font-weight: 500;
	height: auto;
}
.d{
	margin-bottom: 2.5em;
	box-shadow: none;
	width: 100%;
	float: left;
	text-align: center;
	padding: 2.5em 25%;
	background: none;
}

p{
	margin: 0 0 1.25em 0;
	width: 100%;
	float:left;
}

.contact{
	width: 100%;
	float: left;
	text-align: center;
	padding: 5em 25%;
	margin: 0;
	background: url('../img/bck.gif');
}
.contact .txt{
	width: 50%;
	padding: .625em;
	float:left;
}
}
.contact p.link{
	margin-top: 1.25em;
}
.contact a{
	margin: 1.25em 0 0;
	padding: .3125em 1.25em;
	border: 1px solid var(--s);
	border-radius: .3125em;
}

.boce{
	width: 100%;
	float: left;
}

.boce img{
	width: calc(25% - 1.25em);
	height: auto;
	margin: 2.5em .625em;
	float: left;
}

footer{
	width: 100%;
	float: left;
	text-align: center;
	padding: 0 .625em 5em .625em;
	margin: 0;
	background: url('../img/bck.gif');
}
footer img{
	height: 2.5em;
    width: auto;
	margin: .625em;
}
footer img.bigger{
	height: 3.75em;
    width: auto;
	margin: 0 .625em;
}
footer img.program{
	height: 3.75em;
    width: auto;
	margin: 0 .625em;
}
footer p{
	font-size: .75em;
	line-height: 1.25em;
	margin: .625em;
}

@media only screen and (max-width: 1440px) {
	.opis, .contact, .sorte{
		padding: 5em calc(100% / 6);
	}
	.sorte .txt{
		width: 50%;
	}
	.lec{clear: left;}
	.lec, .bje{margin-top: 2.5em;}
	.d{padding: 2.5em 1.25em;}
	.d p{margin: 0;width:100%;}
}
@media only screen and (max-width: 1060px) {
	.opis, .contact{
		padding: 5em calc(100% / 8);
	}
	.sorte{
		padding: 5em calc(100% / 4);
	}
	.sorte .txt{
		width: 100%;
	}
	.sorte .txt+.txt{
		margin-top: 2.5em;
	}
	ul.litraza{
		float: left;
		padding: 0 20%;
	}
	.bckg{
		height: 20em;
	}
}
@media only screen and (max-width: 925px) {
	.opis, .contact{
		padding: 5em calc(100% / 4);
	}
	.sorte{
		padding: 5em calc(100% / 4);
	}
	.txt, .contact .txt{
		width: 100%;
	}
	.txt+.txt{
		margin-top: 2.5em;
	}
	ul.litraza{
		float: left;
		padding: 0 1.25em;
	}
	header{
		width: 25%;
		padding: 25% 0 0 0;
		margin: 1.25em 35.5% 0;
	}
	.boce img{
		display: none;
	}
	.boce img.standing{
		width: calc(50% - 1.25em);
		margin: 0 .625em;
		display: block;
	}
}
@media only screen and (max-width: 700px) {
	.opis, .contact{
		padding: 5em 1.25em;
	}
	.sorte{
		padding: 5em 1.25em;
	}
	.txt, .contact .txt{
		width: 100%;
	}
	.txt+.txt{
		margin-top: 2.5em;
	}
	ul.litraza{
		float: left;
		padding: 0 1.25em;
	}
	header{
		width: 50%;
		padding: 50% 0 0 0;
		margin: 1.25em 25% 0;
	}
	.boce img{
		display: none;
	}
	.boce img.standing{
		width: calc(50% - 1.25em);
		margin: 0 .625em;
		display: block;
	}
}

::selection{color:var(--txt);background:Gold;}::-moz-selection{color:var(--txt);background:Gold;}