/*hlavičkaaaaaa*/
.menu a{text-align: center; display: inline-block; margin:0 auto;}
.barva  {background: 	#fff; margin: 0 ; padding: 0 ;}
.header { margin: auto; border-bottom: 1px groove; padding:15px 0 20px 0;}
.header img{display: inline-block; width: 150px; height:92px; margin: auto; margin-left: 50px }
.text {display: inline-block;text-align: left; margin: 35px 35px 0 35px; font-family: Segoe UI; font-size:14px; float:right;}
.text img {width:15px;}
/*menuuuuuuuuu*/
.hl {
  text-decoration:underline;
  text-decoration-color: black;
}

.svisle-nahoru-malo{text-align: center; border-bottom: 1px groove;}
.svisle-nahoru-malo1{text-align: center; border-bottom: 1px groove;}
.svisle-nahoru-malo a {
    display: inline-block;
    position: center;
    font-family: Segoe UI;
    font-size: 14px;
    font-weight: 100;
    color: #000;
    padding: 1em 0;
    width: 150px;
    text-align: center;
    text-decoration: none;
    background: #f5f5f5;
    transition: color .3s, box-shadow .3s;
    box-shadow: inset 0px 0 0 0 #e6e6fa;
    animation: text 6s 1;
}
.svisle-nahoru-malo1 a {
    display: inline-block;
    position: center;
    font-family: Segoe UI;
    font-size: 14px;
    font-weight: 100;
    color: #000;
    padding: 1em 0;
    width: 150px;
    text-align: center;
    text-decoration: none;
    background: #f5f5f5;
    transition: color .3s, box-shadow .3s;
    box-shadow: inset 0px 0 0 0 #e6e6fa;
}

.svisle-nahoru-malo a:hover {
    box-shadow: inset 0 -5px 0 0 #000;
    color: #000;
    background: #f5f5f5;
    font-weight: bold;
    animation: text 6s 1;
/*obsaaaaaaaaaaah*/
}
.svisle-nahoru-malo1 a:hover {
    box-shadow: inset 0 -5px 0 0 #000;
    color: #000;
    background: #f5f5f5;
    font-weight: bold;
/*obsaaaaaaaaaaah*/
}
#container
{
margin-top: 70px;
display: block;
text-align: center;
position: center;

}
.container span{
display: block;
}

.text2{
background: #f5f5f5;
color: black;
font-family: Segoe UI;
font-size: 60px;
font-weight: 400;
letter-spacing: 10px;
position: center;
animation: text 6s 1;
}

@keyframes text {
0%{
  color: #f5f5f5;
  background: #f5f5f5;
  text-shadow: 2px 5px #f5f5f5, -2px 0 #f5f5f5;
  text-decoration:none;
}
40% {color: #f5f5f5;
  background: #f5f5f5;
 text-shadow: 2px 5px #f5f5f5, -2px 0 #f5f5f5;
 text-decoration:none;
}
}

.welcome{
text-align: center;
margin-top: 30px;
font-family: Segoe UI;
  font-size: 25px;
  font-weight: 100;
  animation: hup 3s 1;
}
@keyframes hup {
  0%{
    color: #f5f5f5;
    letter-spacing: 20px;
    background: #f5f5f5;
    text-shadow: 2px 5px #f5f5f5, -2px 0 #f5f5f5;
    margin-left: 500px;
  }
  30% {color: #f5f5f5;
    letter-spacing: 20px;
    background: #f5f5f5;
   text-shadow: 2px 5px #f5f5f5, -2px 0 #f5f5f5;
   margin-left: 500px;

  }
}
.center{
display: block;

}
.mapa{
margin-top: 60px;
display: block;
width: 40%;
position: absolute;
margin-left: 19%;
box-shadow: 0px 0 10px 2px #e6e6fa;
height:320px;
animation: mapa 6s 1;
}

@keyframes mapa{
0%{width: 0%;
box-shadow: 0 0 0 0 #f5f5f5;
color: #f5f5f5;
background-color: #f5f5f5;}
40%{width: 0%;
box-shadow: 0 0 0 0 #f5f5f5;
color: #f5f5f5;
background-color: #f5f5f5;}
}
@keyframes mapatext{
0%{
color: #f5f5f5;
background-color: #f5f5f5;}
40%{color: #f5f5f5;}
60%{
color: #e6e6fa;}
80%{
color: #e6e6fa;}
}

.mapatext{
  margin-top: 60px;
overflow: hidden;
display: inline-block;
text-align: center;
float: right;
width: 20%;
padding-top:15px;
margin-right: 19%;
background-color: #e6e6fa;
box-shadow: 0px 0 10px 2px #e6e6fa;
height: 320px;
font-family: Segoe UI;
  font-size: 17px;
  font-weight: 100;

animation: mapa 6s 1, mapatext 6s 1;
}

#containerabout
{
margin-top: 60px;
margin-bottom: 100px;
display: block;
text-align: center;
position: center;

}
.containerabout span{
display: block;
}

.textabout{
background: #f5f5f5;
color: black;
font-family: Segoe UI;
font-size: 20px;
font-weight: 200;
letter-spacing: 5px;
position: center;
animation: text 6s 1;
}