@font-face {
    font-family: 'ubunturegular';
    src: url('ubuntu-regular-webfont.eot');
    src: url('ubuntu-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-regular-webfont.woff2') format('woff2'),
         url('ubuntu-regular-webfont.woff') format('woff'),
         url('ubuntu-regular-webfont.ttf') format('truetype'),
         url('ubuntu-regular-webfont.svg#ubunturegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


body{
  font-size: 18px;
  font-family: ubunturegular, "Lucida Grande", Ubuntu, Verdana, sans-serif;
  background-color: #fff;
  background-image: url('../images/bottomgr2.gif');
  background-position:bottom center;
  background-repeat:repeat-x;
  line-height: 1.25;
  font-weight: normal;
}

#page p, #page li{
}


.r{text-align:right;} 
.c{text-align:center;} 
.j{text-align:justify;}
.l{text-align:left !important;}

.fr,.fr10{float:right;} 
.fl,.fl10{float:left;}
.fl10{margin-right:10px;}
.fr10{margin-left:10px;}
.cb,.clear{clear:both;}
.cr{clear:right;}
.cl{clear:left;}
.lb {border:1px solid #aaa;}
.red{color:#a00;}

h4{
}

.i{
font-style:italic;
}

.slogan{
color:#f80 !important;
}

#page img{
  max-width:610px;
}
.cuprum{
  font-family: ubunturegular, Arial, Ubuntu, sans-serif !important;
  max-width:99%;
}

.topBar{
  max-width: 1000px;
  margin:auto;
}

#jump{
  display:block;
  -webkit-border-bottom-right-radius: 8px;
  -webkit-border-bottom-left-radius: 8px;
  -moz-border-radius-bottomright: 8px;
  -moz-border-radius-bottomleft: 8px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  float:right;
  background: #d2ff52; /* Old browsers */
  background: -moz-linear-gradient(top,  #d2ff52 0%, #81d13c 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d2ff52), color-stop(100%,#81d13c)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #d2ff52 0%,#81d13c 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #d2ff52 0%,#81d13c 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #d2ff52 0%,#81d13c 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #d2ff52 0%,#81d13c 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#81d13c',GradientType=0 ); /* IE6-9 */
  padding:3px 10px 5px 10px;
  border:1px solid #080;
  border-top:none;
}

#layout
{
  background-color: #ffe;
  background-repeat: repeat-y;
  max-width: 1000px;
  height: auto;
  min-height: 550px;
  _height: 550px;
  text-align: left;
  margin: 10px auto;
  border:0px solid #777;
  border-right:1px solid #fca;
}

#banner 
{
  max-width: 1000px;
  height: 0px;   
  padding: 0px;
  margin:0px;
  border-bottom: 0px;
  visibility:hidden;

}

#page 
{
  display:table-cell;
  padding: 20px;
  width: 719px !important;
  _height: 580px;
  height: auto;
  min-height: 880px;
  xfloat: left;
  color: #404040;
  background-color:white;
  background-image:url('../images/corner.gif');
  background-position:top left;
  background-repeat:no-repeat;
  overflow:hidden;
  float:left;
}

#page ul
{
  margin:10px;
  line-height:1.6em;
}

#page li
{
  margin-bottom:10px;
  color:#777;
}



#page p
{
  line-height:1.6em;
  text-align:left;
  color:#777;
}


#menu {
  font-size:12pt;
  display:table-cell;
  max-width: 240px !important;
  width: 240px !important;
  _width: 240px;
  xfloat: left;
  border-left:1px solid #fda;
  margin-top:-20px;
}

.menulist
{
  padding:0px;
  margin:0px;
  font-size: .8em;
  background-color: #999;
}

.menulist li
{
  list-style-type: none;
  margin: 0px;
  margin-top: 1px;
  text-align: right;
}

.menulist li a
{
  display: block;
  color: #060;
  xfont-family: Verdana;
  font-size: 1.2em;
  padding: 3px;
  border-right: 24px solid #e60;
  background-color: #fff;
  _width: 220px;
  text-decoration: none;
}

.menulist li a:hover
{
  border-color: #000;
  color: #070;
  background-color: #ffa;
  text-decoration: none;
}

#menu h2
{
  background-color: #ccc;
  padding: 3px;
  padding-left:8px;
  font-size: 1em;
  font-weight: normal;
  color: #000;
  margin: 0px;
  padding-top: 20px;
}

ul.menu 
{
  background-color: #feb;
  padding: 0px;
  padding-left:0px;
  color: #000;
  margin: 0px;
  padding-top: 0px;
  width:100% !important;
}

ul.menu li
{
   padding-top:20px;
   padding-bottom:3px;
   list-style-type:none;
}

ul.menu a
{
  color: #000;
  padding:3px;
  padding-left:8px;
}

ul.menu a:hover
{
  text-decoration:none;
}

ul.menu ul
{
  padding:0px;
  margin:0px;
  background-color: #dba;
  font-weight:normal;
}

ul.menu ul li
{
  list-style-type: none;
  margin: 0px;
  margin-top: 1px;
  text-align: right;
  padding:0px;
}

ul.menu ul li a
{
  display: block;
  color: #060;
  xfont-family: Verdana;
  padding: 3px;
  border-right: 24px solid #fb7;
  background-color: #ffe;
  _width: 220px;
  text-decoration: none;
}

ul.menu ul li a:hover
{
  border-color: #c50;
  color: #070;
  background-color: #ffa;
  text-decoration: none;
}


#footer 
{
  clear:both;
  background-color: #feb;
  text-align: right;
  padding: 2px;
  font-size: .8em;
  border-top:1px solid #fa6;
  border-bottom:1px solid #fa6;
  height:18px;
}

.commenthead
{
  border:1px dotted #aaa;
  border-bottom:0px;
  margin-top:20px;
  background-color:#f5f5f5;
  padding:4px;
}

.commentname
{
  margin-left:8px;
  word-wrap: break-word;
}

.commenttime
{
  margin-left:240px;
  color:#aaa;
  word-wrap: break-word;
}

.commenttext
{
  clear:both;
  padding:5px;
  border:1px dotted #aaa;
  border-top:0px;
  word-wrap: break-word;
  overflow:auto;
  line-height:1.5em;
}

#tip
{
  margin-top:10px;
  margin-right:10px;
  text-align:right;
  font-size:.8em;
}

.popisfotky
{
  margin-bottom:40px;
  width:470px;
  font-size:.8em;
}

.fotka
{
  border:1px solid #aaa;
}



@media screen and (max-width: 800px) {
  body {
    font-size:4vw !important;
    width:100% !important;
  }  
  #menu, #menu ul{
    width:100% !important;
    max-width:100% !important;
    float:none;
    display:block !important;
    clear:both;
  }
  #page{width:96% !important;max-width:96% !important;min-height:auto;padding:0 2%;}
  #layout{overflow:visible !important;}
  #page img{
    max-width:98%;
    margin:auto;
  }
  #page ul{
    margin-left:2vw;
  }
  ul.menu ul li a{
    padding-top:1ex;
    padding-bottom:1ex;
  }
  iframe{
    max-width:100% !important;
  }
  #jump{
    display:none;
  }
}

