/*Stranku jsem se rozhodl udelat do jednoducheho cernobileho designu, zvolil jsem 2 sloupcovy layout*/
/*Stranka je fiktivni !*/


/*responzivita*/
* {
margin: 0;
padding: 0;
font-family: "Comic Sans MS";
}
/*k obrazku*/
#mensi {
    width: 50%;
}
/*zarovnani nadpisu*/
h3 {
    text-align: center;
}
/*stylizace zahlavi*/
header {
    background-image: url(header.png);
    padding: 12.5%;
    color: black;
    background-size: cover ;
    
}

/*zarovnani na stred*/
h1, h2, footer {text-align: center;}
.fotos{
    margin-left: auto;
    margin-right:auto ;
    display: block;
    
    

}
/*tabulka doprostred*/
.tabulka {

    margin-left: auto;
    margin-right:auto ;
    text-align: center;
    




}
/*relativni pozicovani, Adam s fotkou nemel problem ;) */
#rysak {

position: relative;
left: 45%;



}
/*uprava odkazu aby nebyly podrthnute a cerne*/
a { color: black;
    text-decoration: none;
}
/*stylizace seznamu*/
#seznam {

    margin-left: 47%;
    margin-right: auto;
    
}

#seznam1 {

    margin-left: 10%;
    margin-right: auto;
    
}

/*stylizace paticky*/
footer {
    margin: auto;
}

ul ul {
    margin-left: 20px;
}
ul ul ol {
    margin-left: 10px;
}



div {
    padding: 30px 30px 30px;
}
/*menicko*/
nav ul {list-style-type: none;margin: 0;padding: 0 ;display: none;}
nav li {margin-bottom: 1px; }
 nav li a {display: block;height: 3.5em;
    line-height: 3.5em;font-family: arial,
     sans-serif;background-color: white;
     color: black;text-align: center;
     text-decoration: none;
      overflow: hidden}
 #seznam {display: block;}
 nav input[type=checkbox] {display: none;}
 nav input[type=checkbox]:checked ~ #menu {display: block;} 
 .ramecek {text-align: center;}  
 nav li a:hover {background: rgb(144,144,144);}
 nav li:hover ul a {background: rgb(214,214,214);color: black;}
 nav li:hover ul a:hover {background: rgb(100,100,100);
    color: white;}
 nav ul li a:hover + .submenu, .submenu:hover {display: block;}
 nav .ukaz {font-family: arial, sans-serif;
    background-color: black;
    color: white;
    text-align: center;
    display: block;
    padding: 10px 0;}
 

 @media screen and (min-width:64em)      {.ukaz {display: none;}
 
 label.ukaz {display: none;}
  #nav {position: relative;
                width: 750px;
                margin: 0 auto;}
  nav ul {display: block;position: absolute;}   
  nav li {display: block;float: left;
    margin-right: 1px;}
  nav li a {min-width: 9em;}
  nav li ul {display: none;}
  nav li ul li {float: none; margin-right: 0;}
  nav li ul li a {padding: 0 0px ;}
  }
 h2:hover {color: blue;}
 h2 {transition: color 0.5s} 


/*nastaveni pro pc, aby se udelal 2 sloupcovy layout*/
 @media only screen and (min-width: 1000px) {
    /* 2 sloupcovy layout*/
    .grid-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 20px;
    }
    

    }
/*tisk*/
@media  print {
    header{background-color: white;}
    nav {display: none;}
 }