/* ******* BARVY ****** */
:root{
--tmavacolor:#164A7C;
--svetlacolor:#4375A5;
--redsvecolor:#FE715B;
--redtmacolor:#E74D35;
--zeltmacolor:rgba(137, 180, 20, 0.9);
--zelsvecolor:rgba(199, 240, 86, 0.5);
}
/* ******* BODY ****** */
.wrapper {
		padding: 6em 0em 4em 0em;
	}
.wrapper.style1 {
			padding: 0em;	
		}
.ndps {
padding-top: 160px;
}
.canvasndps {
padding-top: 60px;
}
.header
{			height: 340px;
			padding: 0em;
			background: #222222 url(../img/banner.jpg) no-repeat;
			background-size: cover;
			position: center;	
		}	
.canvasheader
{			height: 240px;
			padding: 0em;
			background: #222222 url(../img/banner.jpg) no-repeat;
			background-size: cover;
			position: center;	
		}
a.nadpis {
font-family: 'Oxygen', sans-serif;
color: white;
background: var(--svetlacolor);
padding: 3px 12px 5px 14px;
}
a.nadpis:hover {
text-decoration:none;
color: white;
}
a.
ul li:hover ul{
        display: block;
		background-color:#2C111D;
    }
	
.navi {
		position: sticky;
		top: 0;
		z-index: 100;
	}
.nav {
		z-index: 100;
		right: none;
		text-align: center;
		background-color: var(--tmavacolor);
		width: 100%;
		font-family: 'Oxygen', sans-serif;
	}
	.nav > ul {
			margin: 0;
			background: var(--tmavacolor);
		}

			.nav > ul > li {
				border-radius: 4px;
				display: inline-block;
				margin-left: 0.5em;
				padding: 0 1em;
				background: var(--tmavacolor);
				
			}

				.nav > ul > li a {
				font-family: 'Oxygen', sans-serif;
					color: white;
					background: var(--tmavacolor);
					line-height: 4em;
					letter-spacing: 1px;
					text-decoration: none;
					text-transform: uppercase;
					font-weight: 400;
					font-size: 1em;
					
					
				}
.nav span {
font-size: 25p;
background-color: transparent;
margin-left: 10px;
margin-right: 10px;
padding: 10px 10px;
border-radius: 4px;
border: 1px solid var(--svetlacolor);
vertical-align: middle;
color: white;
transition: all ease-in-out 1s;
}
.nav span:hover {
background-color: var(--svetlacolor);
color: white;
}
.spodninav ul {
margin: 0;
padding: 0;
list-style-type: none;
}
.spodninav  ul li{
font-size: 1.4em;
display: inline;
}
.spodninav ul li a
{
color: white;
text-decoration: none;
padding: .2em .5em;
}
tabel, th, td {
border: 1px solid black;
text-align: center;
}
 /* ******* OBSH ****** */

 /* ******* ZAPATI ****** */
.bottom{
padding-top: 50px;
padding-bottom: 20px;
text-align: center;
right: none;
width: 100%;
height: 180px;
background-color: var(--tmavacolor);
color: white;
}
.bottomloga img {
display: inline-block;
margin-left: auto;
margin-right: auto;
opacity: 0.6;
filter: aplha(opacity=70)
}
.bottomloga img:hover {
opacity: 1;
filter: aplha(opacity=100);
}
/* ******* CONTENT ****** */
.content {
font-size: 18px;
text-align: justify;
margin-top: -50px;
}
.content p {
padding-bottom: 15px;
}
.content h1 {
color: var(--redsvecolor);
font-size: 3em;
text-transform: uppercase;
font-weight: 800;
padding-bottom: 10px;
}
.content h2 {
color: var(--redsvetcolor);
font-size: 1.4em;
font-weight: 400;
}
.content a {
color: var(--svetlacolor);
font-style: italic;
text-decoration: none;
}
.content a:hover{
color: white;
background-color: var(--svetlacolor);
text-decoration: none;
cursor: pointer;
}
.podnadpis {
background-color: var(--redsvecolor);
padding-bottom: 10px;
margin-bottom: 20px;
}
.podnadpis h2 {
color: white;
text-transform: uppercase;
}
/* ******* BLOK ****** */
.blok {
width: 100%;
float: left;
padding-bottom: 10px;
padding-top: 10px;
margin-bottom: 15px;
position: relative;
 }
/* ******* ULOHY ****** */
.ulohy {
border-top: 4px solid var(--svetlacolor);
border-bottom: 8px double var(--tmavacolor);
}
.uloha {
padding-top: 10px;
padding-bottom: 0px;
margin-bottom: 5px;
margin-top: 5px;
color: black;
vertical-align: middle;
}
.uloha button {
background-color: transparent;
font-size: 25px;
margin-left: 10px;
margin-right: 10px;
padding: 10px 10px;
border-radius: 4px;
border: 1px solid var(--tmavacolor);
vertical-align: middle;
color: var(--tmavacolor);
transition: all ease-in-out 1s;
}
.uloha button:hover {
background-color: var(--svetlacolor);
color: white;
}
.uloha a:hover {
background-color: transparent;
color: white;
}
.uloha p {
margin-top: 5px;
}
/* ******* VYSKAKOVACI ****** */
.vyskakovaci {
display:none;
position: absolute; 
z-index: 100;
margin-left:10%;
width: 80%;
height: 80%;
background: rgba(67, 117, 165, 0.5);
}
.vnitrek {
background-color: var(--tmavacolor);
color: white;
margin: 50px;
padding: 15px 25px 15px 25px;
}
.vyskakovaci a {
color: white;
decoration: none;
}
/* ******* BOCNI LISTA****** */
.bok {
width: 8.33333333%;
}
.bok button {
background-color: transparent;
font-size: 25px;
margin-left: 10px;
margin-right: 10px;
padding: 10px 10px;
border-radius: 4px;
border: none;
vertical-align: middle;
color: var(--redsvecolor);
transition: all ease-in-out 1s;
}
.bok button:hover {
background-color: var(--redtmacolor);
color: white;
}
.bok a {
color: var(--svetlacolor);
font-size: 12px;
text-decoration: none;
overflow: hidden;
background-color: transparent;
}
/* ******* BOCNI LISTA - BOXY ****** */
.box {
width: 240px;
text-align: center;
}
.box ul {
list-style-type: none;
}
.bok a:hover{
color: white;
background-color: transparent;
}
.box a {
font-size: 14px;
color: var(--svetlacolor);
font-style: normal;
}
.box a:hover {
color: var(--redtmacolor);
font-style: normal;
}
/* ******* KONEC ****** */
.shrnuti span {
background-color: transparent;
font-size: 25px;
margin-left: 10px;
margin-right: 10px;
margin-top: 10px;
padding: 10px 10px;
border: none;
color: var(--redtmacolor);
}
.shrn {
border-left: 4px solid var(--redtmacolor);
border-right: 4px solid var(--tmavacolor);
}
.dal a{
font-style: normal;
}
/* ********* HRA ******** */
.uvitaci {
position: absolute;
height: 610px;
width: 966px;
z-index:100;
background-color: white;
text-align: center;
}
.uvitaci ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.uvitaci h1 {
background-color: black;
color: white;
font-size: 3em;
text-transform: uppercase;
font-weight: 600;
padding-top: 10px;
padding-bottom: 10px;
}
.uvitaci h2 {
background-color: var(--tmavacolor);
color: white;
font-size: 1.5em;
text-transform: uppercase;
font-weight: 300;
padding-top: 10px;
padding-bottom: 10px;
}
.uvitaci button {
background-color: var(--svetlacolor);
font-size: 25px;
width: 340px;
margin-top: 10px;
padding: 10px 10px;
border-radius: 4px;
border: none;
vertical-align: middle;
color: white;
transition: all ease-in-out 0.7s;
}
.uvitaci button:hover {
background-color: var(--tmavacolor);
color: white;
}
.mapy {
display: none;
}
.mapy h2{
background-color: var(--redtmacolor);
}
.mapy button {
background-color: var(--redsvecolor);
}
.mapy button:hover{
background-color: var(--redtmacolor);
}
.poznamka {
padding-top: 20px;
padding-left: 50px;
padding-right: 50px;
}
.potvrzeni {
display: none;
}
.ovladani {
text-align: center;
float: left;
width: 300px;
height: 608px;
padding-top: 25px;
background-color: beige;
}
.ovladani button {
background-color: var(--svetlacolor);
font-size: 25px;
width: 200px;
margin-top: 10px;
padding: 10px 10px;
border-radius: 4px;
border: none;
vertical-align: middle;
color: white;
transition: all ease-in-out 0.7s;
}
.ovladani button:hover{
background-color: var(--tmavacolor);
color: white;
}
.nazevORP {
display: none;
}
.obrazekMISTA {
display: none;
}