body { background-color: #FFFFFF;
       font-family: Verdana, Arial, sans-serif;
       text-align: left;}

header { font-size: 1.40em;
        text-align: center;
        background-color: #9BD770;
        color: #1B3409;
        line-height: 280%;
        margin-top: -10px;}

#header_znak {float: left;
              margin-left: -20px;
              margin-top: -15px;} 

#header_znak img {max-width: 70%;
                  height: auto}                           

nav {background-color: #1B3409;
     text-align: center;
     font-size: 1.15em;
     font-weight: bold;
     margin-top: -37px;
     padding: 1px;}

nav ul {list-style-type: none;}

nav a{padding-right: 10px;}

nav li{display: inline;}

nav a:link, nav a:visited{
    color: #66B032;
    text-decoration: underline;
    text-underline-offset: 5px;
    text-decoration-thickness: 3px;}

nav a:hover, nav a:active{
    color: #9BD770;
    text-decoration:underline;
    text-underline-offset: 5px;
    text-decoration-thickness: 5px;}

main {width: 95%;
      margin: -20px auto -20px auto;
      padding: 0 15px 30px 35px;
      background-color: #EBF7E3;}

main p {font-size: 0.8em;
        text-align: justify;}

footer { background-color: #9BD770;
        font-size: small;
        font-style: italic;
        text-align: center;}

footer a:link, footer a:visited, footer a:hover, footer a:active{
    color: #000000;}

a:link, a:visited, a:hover, a:active {color: #375F1B;}

table, th, td {border: solid 0.15em;
               border-collapse: collapse;
               padding: 0.3em 0.7em 0.3em 0.7em;
               font-size: 0.9em;}

th{background-color: #1B3409;
   color: #82cd4c;
   border-color: #82cd4c;}

td{background-color: #c7e9af;
   color: #000000;
   border-color: #000000;}
  
.tableleft{float:left;}

.tableright{float:left;
            margin: -1.40em 0 3em 3em;}

.tableleft1{float:left;}

.tableright1{float:left;
            margin: -1.40em 0 3em 3em;}

.clear{clear: both;}

.tableleft2{float: left;
            margin: -1em 0 3em 3em;}

.clanek{float: left;
        width: 40%;
        border-bottom: solid 2px;
        border-color: #66B032;}

#new1{float: left;
      margin-left: 2em;
      margin-top: 5.25em;
      width: 30em;
      border-bottom: solid 2px;
      border-color: #66B032;
      padding-bottom: 1.65em;}

#new2{float: left;
      margin-left: 2em;
      margin-top: -6em;
      width: 30em;
      border-bottom: solid 2px;
      border-color: #66B032;
      padding-bottom: 1em;}

#tabulka{float: right;
      margin-left: 1.5em;
      margin-top: 5.2em;
      width: 20em;}      

#soupiskapic {float: left;
              width: 530px;
              height: 320px;
              margin-left: 2em;}

@media screen and (max-width: 800px) {
    #header_znak{width: 45%}
    
    header {font-size: 5vw;}
    
    nav{font-size: 4vw;
        text-align: left;}
    
    nav li{display: table;
           border-bottom: solid;
           border-bottom-color: #9BD770;
           border-bottom-width: 2px;}
    
    nav a:link, nav a:visited{
    color: #66B032;
    text-decoration: none;}
    
    main{width: 90%;
        margin: -20px auto -20px auto;
        padding: 0 1.1em 2em 1em;}
    
    iframe {width: 95%}
    
    .tableleft{width:100%;
               float:none;}
    
    .tableright{width:100%;
                float:none;
                margin: 0 0 1em 0;}
    
    .tableleft1{width:100%;
                float:none;}
    
    .tableright1{width:100%;
                float:none;
                margin: 0 0 1em 0;}
    
    .tableleft2{float: none;
                width:80%;}
    
    .clanek{width: 100%;}
    
    #soupiskapic {width: 90%;}
    
    #tabulka{width: 100%;
             float: left;
            margin: 0 0 0 0;}
    
    #new1{width: 100%;
          margin: 1.5em 0 0 0;}
    
    #new2{width: 100%;
          margin: 1.5em 0 0 0;}
    
    .clear{clear: both;}
   
}