/* CSS Document */
body{
 /*
  background-color:#222;
  color:white;
  */
  background-color:#FFF;
  color:black;

  font-family:arial,sans-serif;
  margin: auto;
}

.novinky{
  background-color: #eee;
  padding:1px 0.8rem;
  border-radius: 10px;
  font-style: italic;
  line-height: 1px;
}

.novinky li{
  
  font-size: smaller;
  
}


@media screen and (min-width:1200px){
  body{
    width:1200px;
  }  
}

header,footer {
  width:100%;
}

header{
  background-image:url("img/logo.svg");
  background-size: 260px;
  background-position:10px 0;
  background-repeat: no-repeat;
}

header h1{
  color:red;
  margin-left: 200px;
  padding-top: 20px;
  font-size:300%;
  text-shadow:2px 2px #880000;
  margin-bottom:0;
}
header h2{
  color:#800;
  margin-left: 200px;
  margin-top:0;
}

footer {
  font-size:50%;
  color:#666;
  margin:1em;
}

nav ul {
  border-top:5px #800 solid;
}

nav ul li {
  display:inline-block;
  margin:-5px 5px 5px 0;
  padding:5px 10px;
  border: 4px #800 solid;
  border-radius: 0 0 10px 10px; 
}

nav ul li a{
  text-decoration:none;
  /*color:white; */
  color:black; 
}

nav ul li:hover{
  background-color:red;
  border-radius: 0 0 10px 10px;
  border-color:red; 
}

nav ul li a:visited{
  /*color:white; */
  color:black; 
  border-radius: 0 0 10px 10px;
  border-color:Blue; 
}


.main{
  display:flex;
  flex-wrap: wrap;
  font-family:Times new roman, serif;
  font-size:105%;
}
.main article{
  /*border:1px yellow dotted;*/
  flex:3;
  padding: 2em;
}

.main article a{
  color:#30f;
}


.main aside{
  display:flex;
  flex:1;
  /*border:1px lime dotted;*/
  background-color:#111;
}

aside{
  flex-direction:column;
  font-size:80%;
  border-radius:10px;
}

aside h4{
  margin:15px 0 3px 15px;
  
  color:#aaa;
}
aside div{
  
}
aside div.framed{
  /*border:1px blue solid;*/
  padding: 1em;
  /*background-color:#444;*/
  background-color:#eee;
  border-radius:5px 5px 10px 10px;
  margin:1px 10px;
}

#neuslysite {
  text-decoration:underline;
  cursor: help;
  
}

#conehrajeme{
  display:none;
  color:#aaa;
  background-color:#333;
  font-style:italic;
  padding:1em;
}

.hammenu {
  display:none;
}


/**************/
.hmenu h1 {
 color:red;
 width:50%;
 margin:0 auto;
 padding-top: 5px;
}

.hmenu ul {
  list-style-type:none;
  width:80%;
  
}
.hmenu ul li {
  display:block;
  margin: 4px;
  padding:10px 20px;
  border: 2px #800 solid;
  border-radius: 16px;
  /*background-color:#000; */
  background-color:#FFF; 
}
.hmenu ul li a{
  text-decoration:none;
  
  /*color:white; */
  color:black; 
  font-weight:bold;
}

.repec{
  list-style-type: decimal;
}

.calendar{
  border-width:0;
  width:800px; 
  height:600px; 
  frameborder:10px; 
  scrolling:no;
}

.odkazy{
  display:flex;
  flex-wrap: wrap;
}

.odkaz{
  color:#888;
  border:2px gray solid;
  border-radius:10px;
  padding:1em;
}
.odkaz a{
  color:#ccc;
  display:block;
  margin-bottom:0.5em;
  font-weight:bold;
}


.flexible{
  display:flex;
  flex-wrap: wrap;
}

.foto{
  flex:1;
}

.videoflex{
  /*
  display:flex;
  flex-wrap: wrap;
  */
}

.video{
  /*
  flex:1;
  */
  float:left;
  margin-left:20px;
}
/****************************************************************/
@media screen and (max-width:640px){
  body{
    width:360px;
  }
  
  header{
    background-size: 150px;
  }
  
  
  header h1{
    margin-left: 100px;
    padding-top: 10px;
    font-size:180%;
    text-shadow:none;
    margin-bottom:0;
  }
  header h2{
    color:#800;
    margin-left: 100px;
    margin-top:10px;
    font-size:100%;
  }
  nav{
    display:none;
  }    
  
  .hammenu {
    display:inline;
    position:relative;
    margin-top:-10px;
    padding-right:10px;
    float:right;
  }
  .main article{
    font-size:90%;
  }
  
  .calendar{
    border-width:0;
    width:340px; 
    height:600px; 
    frameborder:0; 
    scrolling:no;
  }
}

.nejblizsi{
  font-weight: bolder;
  font-size: 110%;
}