/* *******************************************
     bottom, html5, responsive 
**********************************************/


* {
	margin: 0;
}
html, body {
	height: 100%;
}
.wrapper {
	min-height: 100%;
	margin: 0 auto -2.2em; /* the bottom margin is the negative value of the footer's height */
	
	xbackground-image: URL('img/bg3.png');
	background-color: #ffffff;
	background-position: top left;
	
	
}

.push {
	height: 2.1em; /* '.push' must be the same height as 'footer' */
}
footer {
	height: 2.3em; /* '.push' must be the same height as 'footer' */
	background-color: #4f4f4f;
}
footer div { font-size: 70%; width: 80%; margin: 0 auto; padding: 1em 0; font-family: 'PT Sans', sans-serif; }
@media screen and (max-width: 767px) {
  footer div { font-size: 55%; width: 90%; margin: 0 auto; padding: 1.3em 0; font-family: 'PT Sans', sans-serif; }
}





/*************************************************************
  general definitions
*************************************************************/

@font-face {
  font-family: 'Museo Sans Rounded';
  font-style: normal;
  font-weight: 300;
  src: url('ajax/font/MuseoSansRounded300.otf');
}
@font-face {
  font-family: 'Museo Sans Rounded';
  font-style: normal;
  font-weight: 500;
  src: url('ajax/font/MuseoSansRounded500.otf');
}
@font-face {
  font-family: 'Museo Sans Rounded';
  font-style: normal;
  font-weight: 700;
  src: url('ajax/font/MuseoSansRounded700.otf');
}
/*
@font-face {
  font-family: 'Museo Sans Rounded';
  font-style: normal;
  font-weight: 900;
  src: url('ajax/font/MuseoSansRounded900.otf');
}
@font-face {
  font-family: 'Museo Sans Rounded';
  font-style: normal;
  font-weight: 100;
  src: url('ajax/font/MuseoSansRounded100.otf');
}
*/



#content
{
  font-family: 'Museo Sans Rounded', Arial, sans-serif;
  font-weight: 300;
  font-size: 100%;
}
@media only screen and (min-width: 767px) {
  #content { font-size: 100%; }
}




/*************************************************************
  Sticky Header a Responsive nav
*************************************************************/


#zacatek
{
  position: relative;
  width: 100%;
}

header
{
  xposition: absolute;
  xtop: 0;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
  z-index: 1201;
  x-border: 1px solid #ff0000;
  width: 100%;
  xheight: 80px;
  background-image: URL('img/white80.png');
  position: fixed;
  top: 64px;
  /* Pokud zvedneme TOP (nevejde se logo), o stejne pixely natahni prehead1,2 */
}

/* zakladni umisteni loga (margin-left) */
#header-inner
{
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  padding: 0;
  x-border: 1px solid #000000;
 
}



/* sticky menu obecne, ze se ukaze a jak velke logo */
header.sticky
{
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
  position: fixed;
  top: 0;
  background-image: URL('img/white80.png');
  xheight: 70px;
}

/*  vyska divu je stejna jako u textu, logo pak jde top -pulka width, ale div koriguje o pixelovou polovinu lineheight23  */
.topmenulogodiv { height: 23px; x-border: 1px solid #7f7f7f; text-align: left; position: relative; top: 12px; }
header .topmenulogo
{
  width: 12vw;
  position: relative;
  top: -6vw;
  left: 50%;	/* neni na centered, ale left, takze 50% pozice a leftmarg minus pul sirky */
  margin-left: -6vw;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
header.sticky .topmenulogo
{
  width: 47px;
  margin-left: -23px;
  position: relative;
  left: 50%;
  top: -24px;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}

#prehead
{
  background-color: #ffffff; height: 70px;
}
#prehead.sticky { color: #ff0000; visibility: hidden; }

/* v mobilni verzi schovat */
@media (max-width: 767px) {
  #prehead { display: none; }
}


#prehead1
{
  position: absolute;
  top: 15px;
  left: 14vw;
  width: 35vw;
  xbackground-color: #efefef;
  line-height: 40px;
  color: #1a5632;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1vw;
  font-weight: bold;
}
#prehead2
{
  position: absolute;
  top: 14px;
  right: 16vw;
  width: 35vw;
  x-background-color: #efefef;
  text-align: right;
  line-height: 35px;
  color: #1a5632;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1vw;
  font-weight: bold;
}
#prehead img
{
  position: relative; top: 2px;
  margin: 0 5px 0 15px;
  height: 1em;
}
#prehead img.fb { position: relative; top: 2px; margin: 0 5px 0 15px; height: 1.6em; }
#prehead img.yt { position: relative; top: 2px; margin: 0 5px 0 15px; height: 1.6em; }
#prehead img.in { position: relative; top: 2px; margin: 0 5px 0 15px; height: 1.6em; }
#prehead A, #prehead A:hover { color: #1a5632; text-decoration: none; }


/**************************************
  menu 
***************************************/
#topmenu
{
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 0;
  padding: 0;
  xfloat: left;
  x-border: 1px solid #ffff00;
}

/* ala tablet - menu zhroutime pod logo */
@media only screen and (max-width: 767px) {
    /* verze zafixovana: header { width: 100%; position: relative; } */
    header { width: 100%; position: absolute; top:0; height: 0px; }
    /* WASM: Hamburger pak je do fotky a nula funguje, neni prilepen */
    #topmenu { float: none; clear: both; text-align: center; margin: 0 0 0 0; xborder: 1px solid #ffff00; background-color: transparent; }
    header.sticky { position: absolute; top:0; height: 0px; }
    header.sticky #header-inner { margin: 0; }
}


/* dost pravdepodobne android pre4.3 takze neumi vw, ale jen em */
@media only screen and (max-width: 320px) {
    header { width: 100%; position: absolute; top:0; height: 0px; }
    #topmenu { float: none; clear: both; text-align: center; margin: 0 0 0 0; xborder: 1px solid #ffff00; background-color: transparent; }
    header.sticky { position: absolute; top:0; height: 0px; }
    header.sticky #header-inner { margin: 0; }
}



/*************************************************************
  obecne definice typografie
*************************************************************/

H2
{
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
}
p { margin-top: 0.6em; }
ul { font-size: 100%; list-style-type: square; margin: 0; padding: 0 0 0 1.5em; }





/*************************************************************
  hraci prostor
*************************************************************/

.space
{
  width: 92%;
  margin: 2vw auto;
}
.left30
{
  float: left;
  width: 30%;
}
.left30 H2
{
  font-size: 2.6vw;	/* musime se vejit na sirku, takze  */
  border-bottom: 0.1em solid #000000;
}
.right70
{
  width: 70%;
  float: right;
}
.right70 DIV { padding: 0.3em 0.2em 0em 1.5em; font-size: 125%; }


.uspace
{
  width: 92%;
  margin: 2vw auto;
}
.uleft30
{
  float: left;
  width: 29%;
  
}
.uright70
{
  width: 69%;
  float: right;
}




/* table like */
.xspace
{
  width: 92%;
  margin: 2vw auto;
  display: table;
  background-color: #ffffff;
}

.tretina
{
  x-background-color: #afafaf;
  display: table-cell;
  border-left: 1.5em solid #ffffff;
  width: 33.3%;
  margin: 0;
  padding: 0;
  xbackground-color: #96b9e1;
  background-color: #76a9d1;
  xbackground-color: #5484d0;
  
  xmargin: 0.7em 0.5em 0.7em 0.5em;
  xpadding: 1vw;
  xvertical-align: middle;
}
.tretina:first-child { border-left: none; }

.tretina  A { color: #ffffff; text-decoration: none; }
.tretina  A:hover { color: #ffffff; text-decoration: underline; }


.xmezera { margin: 0; padding: 1vw 1vw;}

.xfoo { font-size: 0.1em; margin: 0; padding: 0; }
.xtitle { font-size: 2.5vw; font-weight: bold; text-align: center; padding: 0em 0.7em 0 0.7em; color: #ffffff; text-shadow: 2px 2px 5px #000000; border-bottom: 1px solid #afafcf; }
.xcena { font-size: 4vw; font-weight: bold; text-align: center; padding: 0.2em 0.7em 0 0.7em;  }
.xdovetek { font-size: 1.5vw; font-weight: normal; text-align: center; padding: 0em 0.7em;  }
.xpopis { margin: 0.6em 0; font-size: 1.4vw; }
/*
*/

@media only screen and (max-width: 767px) {
  .tretina { display: block; width: 100%; border-left: none; margin-top: 1em; }
}


.more { background-color: #94a4e0; padding: 0.15em 0.6em 0.2em 0.6em!important; float: right; margin-right: 1em; margin-top: 0.5em; box-shadow: 2px 2px 6px #7f7f7f; border: 1px solid #dfdfff; }
.more A { color: #000000; text-decoration: none; }
.more A:hover { color: #000000; text-decoration: underline; }

.ziskate
{
  margin: 1em 0 1em 0.5em!important;
  padding: 1em!important;
  font-size: 100%!important;
  box-shadow: 5px 5px 12px #8f8f8f;
  background-color: #facfd9;
  
}



.spacer
{
  width: 100%;
  margin: 0;
  background-image: URL('img/spacer.jpg');
  background-size: 100% auto;
  display: block;
  padding: 3em 0;
}


.mapa_frame
{
  width: 100%;
}

.mapa_frame2
{
  width: 100%;
  position: relative;
}


#mapa_prekryt
{
  position: absolute; top: 0px; left: 0; width: 100%; height: 360px; opacity: 0.3; background-color: #afffaf; z-index: 300;
}
#mapa_title_frame
{
  position: absolute; top: 0px; left: 0; width: 100%; height: 60px; background-color: #1a5632; color: #ffffff; z-index: 400;
}


#mapa_title_text
{
  line-height: 58px; font-size: 1.5vw; font-weight: bold; float: left; margin-left: 2em;
}
@media screen and (max-width: 1023px) {
  #mapa_title_text {  font-size: 2.5vw;  }
  #mapa_title_link { font-size: 1.7vw; }
}    
@media screen and (max-width: 481px) {
   #mapa_title_text {  font-size: 3vw;  }
   #mapa_title_link { font-size: 2.2vw; }
}    


#mapa_title_link
{
  line-height: 58px; font-size: 1vw; font-weight: bold; float: right; margin-right: 2em;
}
#mapa_title_link A { color: #ffffff; text-decoration: none; }
#mapa_title_link A:hover { color: #ffffff; text-decoration: none; }








.pata_frame
{
  width: 100%;
  margin: 0;
  background-image: URL('img/bottom1.jpg');
  background-size: 100% auto;
  display: block;
  padding: 1px 0;
}

@media screen and (max-width: 1023px) {
  .pata_frame { background-color: #1a5632; background-image: none; font-size: 4vw; }
  
}

.pata_space
{
  margin: 2em 3em 2em 10em;
}
.pata_left
{
  font-family: 'Museo Sans Rounded','Roboto Condensed',Arial;
  color: #bfcfbf;
  font-size: 1.4vw;
  float: left;
  width: 40%;
}

.pata_left2
{
  font-family: 'Museo Sans Rounded','Roboto Condensed',Arial;
  color: #bfcfbf;
  font-size: 1.4vw;
  float: left;
  width: 40%;
}

.pata_right
{
  font-family: 'Museo Sans Rounded','Roboto Condensed',Arial;
  color: #bfcfbf;
  font-size: 1.4vw;
  float: left;
  width: 18%;
}
.pata_title { font-size: 110%; margin-bottom: 0.4em; }
.pata_tab { font-size: 100%; color: #bfcfbf; margin-top: 0.4em; }
.pata_tab TH { text-align: right; padding-right: 1em; }

.pata_titlesite { display: none; font-size: 110%; margin-bottom: 0.5em; margin-top: 1em;  }

@media screen and (max-width: 1023px) {
  .pata_left { font-size: 3.5vw; width: 99%; float: none; }
  .pata_left2 { font-size: 3.5vw; width: 99%; float: none; }
  .pata_right { font-size: 3.5vw; width: 99%; float: none; }
  .pata_space {  margin: 0.5em 3em 2em 3em;  }
  .pata_title { font-size: 110%; margin-bottom: 0.5em; margin-top: 0.7em;  }
  .pata_titlesite { display: block; font-size: 110%; margin-bottom: 0.5em; margin-top: 1em;  }
}



/************************************************************************
   Homepage
************************************************************************/

.hpmoto1 {
  font-size: 2.3vw; 
  margin: 0.1em 0.5em 0.5em 0.5em; 
  font-family: 'Taviraj', serif;
  font-weight: 700;
  font-style: italic;
  text-shadow: 1px 1px 2px #9f9f9f;
  line-height: 125%;
  text-align: center;
}

.hpmoto2 {
  font-size: 1.6vw; 
  margin: 0.6em 1.5em; 
  line-height: 125%;
}

.hpmoto3 {
  font-size: 2vw; 
  margin: 0.8em 0.5em 0.4em 0.5em; 
  font-family: 'Taviraj', serif;
  font-weight: 700;
  font-style: italic;
  text-shadow: 2px 2px 3px #ffffff;
  line-height: 125%;
  text-align: center; 
  x-background-color: #faaabc;
  xackground-color: #fddade;
  background-color: #fdcace;
  padding: 0.7em;
  box-shadow: 5px 5px 15px #8f8f8f;
}

.hpmoto3beta {
  font-size: 2vw; 
  margin: 0.8em 0.5em 0.4em 0.5em; 
  font-family: 'Taviraj', serif;
  font-weight: 700;
  font-style: italic;
  line-height: 125%;
  text-align: center; 
  background-color: #faaabc;
  padding: 0.7em;
  box-shadow: 5px 5px 15px #afafaf;
}

@media only screen and (max-width: 767px) {
  .hpmoto1 {  font-size: 3.5vw;  }
  .hpmoto2 {  font-size: 2.2vw;  }
  .hpmoto3 {  font-size: 3.2vw;  }
}

.chocolat-image0 { border: none; width: 100%; }

.kdojsemhp { font-size: 2vw; margin-top: 1em; }


/*************************************************************
  tablety telefony
*************************************************************/

@media only screen and (max-width: 767px) {
  .space { width: 98%; margin: 0 auto; }
  .uspace { width: 98%; margin: 0 auto; }
  .left30 { width: 99%; margin-top: 0.7em; }
  .left30 H2 { font-size: 150%; } 	/* uz se nemusime bat, napalime 150%  */
  .right70 { width: 99%; }
  .right70 DIV { padding: 0.3em 0.2em 0em 0.5em; font-size: 100%; }
  .uleft30 { width: 99%; margin-top: 0.7em; }
  .uleft30 H2 { font-size: 150%; } 	/* uz se nemusime bat, napalime 150%  */
  .uright70 { width: 99%; }
  .uright70 DIV {  }
}


/*************************************************************
  male telefony, android pre4.3
   - uz muze byt problem i s H2kou, takze couvame a font naopak vetsi
*************************************************************/

@media only screen and (max-width: 320px) {
  .space { width: 98%; margin: 0 auto; }
  .uspace { width: 98%; margin: 0 auto; }
  .left30 { width: 99%; margin-top: 0.7em; }
  .left30 H2 { font-size: 150%; } 	/* uz se nemusime bat, napalime 150%  */
  .right70 { width: 99%; }
  .right70 DIV { padding: 0.3em 0.2em 0em 0.5em; font-size: 100%; }
  .uleft30 { width: 99%; margin-top: 0.7em; }
  .uleft30 H2 { font-size: 150%; } 	/* uz se nemusime bat, napalime 150%  */
  .uright70 { width: 99%; }
  .uright70 DIV { padding: 0.3em 0.2em 0em 0.5em; font-size: 100%; }
  .right70foto { width: 99%; }
  .right70foto DIV { padding: 0.3em 0em 0em 0em; font-size: 100%; }
}




/*************************************************************
  hraci prostor ì
*************************************************************/


/*************************************************************
  WA vybavicka
*************************************************************/

.foto100
{
  border: 0px; width: 100%;
  margin: 0px;
  padding: 0px;
  line-heigth: 0px;
  display: block;
}
.sha-top
{
  background-image: URL('img/shadow-top.png');
  background-position: bottom left;
  background-repeat: repeat-x;
  background-size: auto 100%;
  height: 1em;
  margin: 0.5em 0 0 0;
  padding: 0px;
}

.sha-bottom
{
  background-image: URL('img/shadow-bottom.png');
  background-position: bottom left;
  background-repeat: repeat-x;
  background-size: auto 100%;
  height: 1em;
  margin: 0 0 0.5em 0;
  padding: 0px;
}

.clear { clear: both; }








/****************************************************
 chocolat, cycle2
****************************************************/

p.foto { font-size: 1.5vw; }
.chocolat-frame-text
{
  margin: 0.8em 0 1em 0!important;
  padding: 0!important;
  font-size: 1.5vw;
}
.chocolat-frame-text H3 { font-size: 100%!important;  }
.chocolat-frame-text IMG { width: auto; height: 6em; }
.chocolat-image-text { border: 1px solid #afafaf; width: auto!important; height: 6em!important; margin-right: 0.3em!important; }

.choco-fix { position: relative; font-size: 1.5vw; height: 6em; float: left; }

.x-foto-plus { font-size: 1.5vw; height: 2.2em; top: 4em; position: absolute; width: 98%; background-color: #ffffff; opacity: 0.7; text-align: center; margin: 0; }
.x-foto-plus_inner { font-size: 1.2vw; margin-top: 0.5em; text-align: center;  font-weight: bold; color: #000000; text-decoration: none; }
.x-foto-plus-mobile { display: none; }
.x-foto-plus-mobile_inner { display: none; }
.x-foto-plus_inner A { color: #1f1f1f; text-decoration: none; }


.choco-foto-1 { display: block; }
.choco-foto-2 { display: block; }
.choco-foto-3 { display: block; }
.choco-foto-4 { display: block; }
.choco-foto-5 { display: block; }
.choco-foto-6 { display: block; }

@media screen and (max-width: 640px) {
  .choco-fix { position: relative; font-size: 3vw; height: 10em; float: left; }
  .chocolat-image-text { border: 1px solid #afafaf; width: auto!important; height: 10em!important; margin-right: 0.3em!important; }
  .choco-foto-1 { display: block; }
  .choco-foto-2 { display: block; }
  .choco-foto-3 { display: none; }
  .choco-foto-4 { display: none; }
  .choco-foto-5 { display: none; }
  .choco-foto-6 { display: none; }
  .x-foto-plus-mobile { display: block; font-size: 3vw; height: 2.2em; top: 8em; position: absolute; width: 98%; background-color: #ffffff; opacity: 0.7; text-align: center; margin: 0; }
  .x-foto-plus-mobile_inner { display: block; font-size: 2.5vw; margin-top: 0.5em; text-align: center;  font-weight: bold; color: #000000; text-decoration: none; }
  .x-foto-plus-mobile_inner A { color: #1f1f1f; text-decoration: none; }
  p.foto { font-size: 3vw; }
}


.foto_h1
{
  font-size; 3vw;
  color: #265640;
}
.foto_txt
{
  font-size: 1.5vw;
  color: #1f1f1f;
}




.fotoga_title { font-size: 1.2vw; color: #efefef; margin: 3px 5px; text-align: center; }
.fotoga-img { border: 1px solid #afafaf; width: 90%!important; height: auto!important; margin: 10px auto; }

.fotoga_title_mobile { font-size: 2vw; color: #efefef; margin: 3px 5px; text-align: center; }
.fotoga-img-mobile { border: 1px solid #afafaf; width: 95%!important; height: auto!important; margin: 10px auto; }



.slider-img { width: 100%; display: block; margin: 0; padding: 0; }
.slider-p { width: 100%; display: block; margin: 0; padding: 0; }

/* slidertext a text1,2,3 jsou ve stejnem tagu */
.slider-text {
	font-size: 4.3vw;
	position: absolute;
	x-top:50%;	/* zakladni posun nahoru dolu */
	x-left:50%;
	background-color: rgba(255,255,255,0.4);
	x-opacity: 0.8;
	padding: 0.5em 0.7em;
	border-radius: 0.2em;
	font-weight: normal;
	
	
}
.slider-text1 { 	margin: 0 2em 0 0em; top: 30%; right: 0; font-size: 4.3vw; }
.slider-text2 { 	margin: 0 0 0 2em; top: 40%; left: 0; font-size: 4.3vw; }
.slider-text3 { 	margin: 0 0 2em 2em; font-size: 4.3vw; }
.slider-text4 { 	margin: 0 0 2em 2em; }
.slider-text5 { 	margin: 0 0 3em 5em; }
.slider-text6 { 	margin: 0 0 3em 5em; }

A .slider-text { color: #000000; text-decoration: none; }
A:hover .slider-text { color: #000000; text-decoration: none; }



.motiv-img { width: 100%;  display: block; margin: 0; padding: 0; }
.motiv-p { xheight: 37vh; width: 100%; display: block; margin: 0; padding: 0; 	overflow: hidden; background-color: #efefff; }

/* default text */
.motiv-text {
	position: absolute;
	bottom:0;
	padding: 0.5em 0.7em;
	overflow: hidden;
	font-size: 1.5vw;
	font-family: Tahoma;
        background-image: URL('img/white80.png');
        width: 100%;
}
.motiv-text-ita {
  x-font-style: italic;
  font-size: 1.2vw;
}

/* default responsive */
@media screen and (max-width: 767px) {
  .xmotiv-img { display: none; }
  .xmotiv-p { height: 10em; }
  .motiv-text { font-size: 3vw; }
  .motiv-text-ita { font-size: 2.2vw; }
}

/* dynamicke css z mid_slid */


/* pod 320 uplne pryc */
.testi { display: block; }
@media screen and (max-width: 320px) {
  .testi { display: none; }
} 




.chocolat-image IMG { border: 1px solid #afafaf; width: 18%; }

/* u tabletu musime trochu zvetsit pismo */
@media screen and (max-width: 767px) {
   .slider-text { font-size: 4.3vw; }
}

@media screen and (max-width: 320px) {
  .chocolat-image IMG { border: 1px solid #afafaf; width: 16%; }
  .cycle-pager { visibility: hidden; }
  .slider-text { display: none; }	/* to uz je marny, zrusit */ 
}




/*************************************************************
  jQuery goUp a jine hracky
*************************************************************/
#nahoru { display: block; text-align: center; }
.nahoru
{
  border: 1px solid #7f7f7f;
  padding: 0px;
  background: transparent url("img/up.png") no-repeat scroll center center / 10vw;
  outline: 0px none;
  width: 8em;
  height: 8em;
  margin: 0.7em auto;
}






/*************************************************************
  jQuery rozbalovaci seznam
*************************************************************/

/* oprava space70 */
#seznam div { padding: 0; }

#seznam { padding-top: 0px; padding-left: 0.9em; text-align: left; xborder: 1px solid #ffff00; margin: 1vw auto; }

#seznam h3
{
  color:#000000;
  border-bottom: 1px solid #7f7f7f;
  padding: 0.2em 0 0.3em 0;
  font-size: 90%;
  wisibility: hidden;
}
#seznam h3#nadpis-1 { border-top: 1px solid #7f7f7f; }

#seznam h3.sipka {  visibility: visible; }
#seznam h3.sipka:hover { cursor: pointer;cursor: hand; }
#seznam h3.active { visibility: visible; }
#seznam h3.last { border-bottom:0px; }

#seznam div.popis { background: transparent url(img/grey80.png) repeat top left; overflow: hidden; height:0px; line-height: 1.4em; font-size: 70%; }
#seznam div.popis p { color:#fff; }
#seznam div.popis li { color:#fff; margin-bottom: 0.2em; margin-left: 0em; padding-left: 0.1em; line-height: 1.2em;}
#seznam div.popis ul, #seznam div.popis ol { padding-left: 6vw; margin-top: 0.3em; }
#seznam p { margin-bottom: 1em; margin-left: 3vw; }
#seznam div.popis:hover { cursor: pointer; cursor: hand; }

@media screen and (max-width: 320px) {
  #seznam h3 {  padding: 0.1em 0 0.1em 0; font-size: 80%;  }
}



/*************************************************************
  google maps patch
*************************************************************/
#gmapy { width: 90%; margin: 1vw auto; }
#gmapy div { padding: 0; font-size: 100%; }


.center90 { width: 90%; margin: 2em auto; font-size: 1.3vw; color: #3f3f3f; }

.leftit { float: left; xborder: 1px solid #ff0000; font-size: 90%!important; }
.leftit TABLE { }
.leftit TABLE TH { text-align: right; padding: 0em 0.3em 0em 0.1em; }
.leftit TABLE TD { text-align: left; padding: 0em 0.1em 0em 0.3em; }





/*************************************************************
  misc
*************************************************************/

.kon { xborder: 1px solid #ff0000; font-size: 100%!important; }
.kon TABLE { }
.kon TABLE TH { text-align: right; padding: 0em 0.3em 0em 0.1em; }
.kon TABLE TD { text-align: left; padding: 0em 0.1em 0em 0.3em; }



.extraspace { margin: 0.3em; }
h3 { margin-top: 0.5em; margin-bottom: 0.1em; }




#ctyrka { width: 100%; margin-top: 1vw; 
x-border: 1px solid #7f7f7f; }
#cty_ram
{ 
float: left; width: 25%; margin: 0; 
x-background-color: #dfdfff; 
}
#cty_inner { font-size: 2vw; margin: 1vw; 
x-border: 1px solid #7f7f7f;
height: 12vw; background-color: #1f6fdf; }



/* u tabletu musime trochu zvetsit pismo */
@media screen and (max-width: 767px) {
   #cty_ram { width: 50%; }
}

@media screen and (max-width: 481px) {
   #cty_ram { width: 100%; }
}












#tabtema1 { font-size: 100%; margin: 0.5em 1em; }
#tabtema1 TH { text-align: left; background-color: #dfdfdf; padding: 0.2em 0.4em; }
#tabtema1 TD { text-align: left; background-color: #dfdfdf; padding: 0.2em 0.4em; }

.fototemah2 { width: 98%!important; margin: 1em 0em; }
.fototemah2sec { width: 98%!important; margin: 1em 0em; }
/* u tabletu vypnout */
@media screen and (max-width: 767px) {
   .fototemah2sec { display: none; }
}



.slogan
{
  background-color: #0372bc;
  margin: 1.2em 1em;
  padding: 0.7em 1.0em!important;
  box-shadow: 5px 5px 5px #afafaf;
  font-size: 145%!important;
  border-right: 0.6em solid #ed2033;
}

.tablo_h1 { text-align: center; border-bottom: 0.1em solid #afafaf; margin-top: 1em; margin-bottom: 0.7em; margin-left: 2em; margin-right: 2em; }





#mapdiv
{
  border-top: 1px solid #7f7f7f;
  border-bottom: 1px solid #7f7f7f;
  border-left: 0px;
  border-right: 0px;
  margin-top: 2vw;
  margin-bottom: 2vw;
}











H1.title
{
  font-size: 3vw;
  color: #265640;
  text-shadow: 2px 2px 3px #bfbfbf;
  text-align: center;
  margin: 2vw auto;
}

@media screen and (max-width: 639px) {
  H1.title { font-size: 4.6vw; }
}


.hp_bg
{
  width: 96%;
  x-background-color: #f3f9ed;
  margin: 0 auto;
}

.hp_frame, .hp_frame2
{
  width: 100%;
  margin: 0 auto;
  x-background-color: #f3f9ed;
  padding: 1.5em 0;
  x-border-bottom: 1px solid #1a5632;
  border-bottom: 12px solid #ffffff;
}

.hp_frame H1 { font-size: 2vw; color: #265640; margin: 0em 0 0.2em 1.5em; font-weight: 900; }
.hp_frame H1 A { color: #265640; text-decoration: none; }
.hp_frame H1 A:hover { color: #000000; text-decoration: underline; }
.hp_frame2 H1 { font-size: 2vw; color: #265640; margin: 0em 0 0.2em 0; font-weight: 900; }
.hp_frame2 H1 A { color: #265640; text-decoration: none; }
.hp_frame2 H1 A:hover { color: #000000; text-decoration: underline; }


/* .hp_frame H1 { font-size: 2vw; color: #1f1f1f; margin: 0em 0 0.2em 1.5em; } */
.hp_imgframe
{
  width: 48%;
  margin: 0;
  padding: 0;
  float: left;
  x-background-color: #cfcfcf;
}
.hp_imgframe IMG { margin: 0; border: none; width: 100%; display: block; }
.hp_txtframe
{
  width: 52%;
  margin: 0;
  padding: 0;
  float: left;
  x-background-color: #dfdfdf;
  display: block;
}
.hp_txtframe2
{
  width: 100%;
  margin: 0;
  padding: 0;
  x-background-color: #dfdfdf;
  display: block;
  margin-bottom: 1em;
}

.hpfull
{
  width: 100%;
  float: none;
}

.hp_imgframe2img, .hp_imgframe2img_prava
{
  width: 48%;
  margin: 0 2% 0 0;
  padding: 0;
  float: left;
  x-background-color: #cfcfcf;
}
.hp_imgframe2img IMG, .hp_imgframe2img_prava IMG { margin: 0; border: none; width: 100%; display: block; }
.hp_txtframe DIV { margin: 0em 2em; font-size: 1.5vw; color: #1f1f1f; display: block; text-align: justify; }
.hp_txtframe DIV.perex { margin: 0em 2em; font-size: 1.5vw; color: #1f1f1f; display: block; text-align: justify; }
.hp_txtframe DIV.autdat { margin: 0 0.5vw 0 4vw; font-size: 1.1vw; color: #1f1f1f; display: block; text-align: right; color: #3f3f3f; }
.hp_txtframe DIV.txt { margin: 1em 0 1em 3vw; font-size: 1.5vw; color: #1f1f1f; display: block; text-align: justify; line-height: 130%; }
.hp_txtframe DIV A { font-weight: bold; color: #71bf44!important; }
.hp_txtframe DIV A:hovedr { font-weight: bold; color: #71bf44!important; text-decoration: underline; }
.hp_link { margin-top: 0.7em!important; float: left; padding: 0.5em 1.2em 0.5em 0; color: #71bf44!important; font-size: 1.5vw!important;  font-weight: bold; }
.hp_link A { color: #71bf44!important; text-decoration: none; font-weight: bold; }
.hp_link A:hover { color: #1f5632!important; text-decoration: underline; }

.hp_polovicni_title { margin: 5px 0; font-size: 2vw; color: #265640; margin: 0.3em 0.5em 0.2em 0.5em; font-weight: 900; text-align: center; }
.hp_polovicni_title A { color: #71bf44!important; text-decoration: none; font-weight: bold; }
.hp_polovicni_title A:hover { color: #1f5632!important; text-decoration: underline; }

.hp_txtframe2 DIV { margin: 0em 2em; font-size: 1.5vw; color: #1f1f1f; display: block; text-align: justify; }
.hp_txtframe2 DIV.perex { margin: 0em 0em; font-size: 1.5vw; color: #1f1f1f; display: block; text-align: justify; }
.hp_txtframe2 DIV.autdat { margin: 0 0.5vw 0 4vw; font-size: 1.1vw; color: #1f1f1f; display: block; text-align: right; color: #3f3f3f; }
.hp_txtframe2 DIV.txt { margin: 1em 0 1em 0vw; font-size: 1.5vw; color: #1f1f1f; display: block; text-align: justify; line-height: 130%; }


.hp_img50_l { float: left; width: 49%; xbackground-color: #afafaf; margin: 0 2% 0 0; }
.hp_img50_r { float: left; width: 49%; xbackground-color: #afafaf; margin: 0 0% 0 0; }
.hp_img50_l IMG { width: 100%; display: block; margin: 1vw 0; border: none; }
.hp_img50_r IMG { width: 100%; display: block; margin: 1vw 0; border: none; }


/* malomobilni verze */
@media screen and (max-width: 639px) {
  .hp_img50_l { float: left; width: 100%; margin: 0; }
  .hp_img50_r { float: left; width: 100%; margin: 0; }
  .hp_imgframe
  {
    width: 100%;
    float: none;
  }
  .hp_txtframe
  {
    width: 100%;
    margin: 5px auto 0 auto;
    float: none;
  }
  .hp_txtframe DIV { margin: 0.2em 0 0 0; font-size: 3.5vw; color: #1f1f1f; display: block; text-align: justify; }
  .hp_txtframe2 DIV { margin: 0.2em 0 0 0; font-size: 3.5vw; color: #1f1f1f; display: block; text-align: justify; }
  .hp_frame H1 { font-size: 4.6vw; color: #265640; margin: 0em 0 0.2em 0; font-weight: 900; }
  .hp_frame { padding: 0.5em 0; margin: 0 5%; width: 90%; }
  .hp_imgframe2img { width: 48%; margin: 0 2% 0 0; }
  .hp_imgframe2img_prava { width: 48%; margin: 0 0 0 2%; }
  .hp_link { margin-top: 0.8em!important; float: left; padding: 0.5em 1.2em 0.5em 0; color: #9fcc5a!important; font-size: 3.5vw!important;   border-radius: 3px; }
  .hp_txtframe DIV.perex { margin: 0.2em 0 0 0; font-size: 3.5vw; color: #1f1f1f; display: block; text-align: justify; }
  .hp_txtframe DIV.autdat { margin: 0 0.5vw 0 4vw; font-size: 2.9vw; color: #1f1f1f; display: block; text-align: right; color: #3f3f3f; }
  .hp_txtframe DIV.txt { margin: 1em 0 1em 3vw; font-size: 3.5vw; color: #1f1f1f; display: block; text-align: justify; line-height: 130%; }
  .hp_txtframe2 H1 { font-size: 4.6vw; color: #265640; margin: 0em 0 0.2em 0; font-weight: 900; }
  .hp_txtframe2 DIV.perex { margin: 0.2em 0 0 0; font-size: 3.5vw; color: #1f1f1f; display: block; text-align: justify; }
  .hp_txtframe2 DIV.autdat { margin: 0 0.5vw 0 4vw; font-size: 2.9vw; color: #1f1f1f; display: block; text-align: right; color: #3f3f3f; }
  .hp_txtframe2 DIV.txt { margin: 1em 0 1em 3vw; font-size: 3.5vw; color: #1f1f1f; display: block; text-align: justify; line-height: 130%; }
  .hp_imgframe IMG { margin: 0 auto; border: none; width: 100%; display: block; }
    
}


/* .hp_txtframe DIV { margin: 0em 2em; font-size: 1.5vw; color: #265640; display: block; } */










#hp_subfoto { margin: 15px 0; }
#hp_subfoto img.f1 { width: 48%; float: left; margin-bottom: 20px; xborder: 1px solid #afafaf; }
#hp_subfoto img.f2 { width: 48%; float: right; margin-bottom: 20px; xborder: 1px solid #afafaf; }
.hp_subfoto_clear { clear: both; }
.hp_subfoto_clear_mobile { clear: none; }

/* malomobilni verze -ukaze jich jen par na jednom radku, pidi */
@media screen and (max-width: 639px) {
  #hp_subfoto { margin: 10px 0; background-color: #efefef; font-size: 3vw; position: relative; left: 10%; height: 4.1em; width: 80%; overflow: hidden; }
  #hp_subfoto img.f1 { width: auto; height: 4em; float: left; margin-bottom: 10px; margin-right: 10px; xborder: 1px solid #afafaf; }
  #hp_subfoto img.f2 { width: auto; height: 4em; float: left; margin-bottom: 10px; margin-right: 10px; xborder: 1px solid #afafaf; }
  .hp_subfoto_clear { clear: none; }
  .hp_subfoto_clear_mobile { clear: both; }
}



/* Homepage Icons */

.hpicons_div { border: 0px solid #ffffdf; background-color: #f3f9ed; padding: 1.7em 0 1.5em 0;}
.hpicons_icon_div { float: left; width: 25%; text-align: center; background-color: #transparent; }
.hpicons_icon_div:hover { background-color: #ffffff; }

.hpicons_icon_div IMG { border: 0; width: 30%; }
.hpicons_icon_text { font-size: 1.5vw; margin: 0.2em 0 0.3em 0; color: #1a5632; font-weight: bold; height: 2.7em;  }
.hpicons_icon_div A { color: #1a5632; text-decoration: none; }
.hpicons_icon_div A:hover { color: #1a5632; text-decoration: none; }



/* v mobilni verzi je to zcela nadbytecne */
/*
@media screen and (max-width: 1023px) {
 .hpicons_div { display: none; }
}
*/
@media screen and (max-width: 1023px) {
 .hpicons_div { border: 0px solid #ff0000; }
 .hpicons_icon_div { float: left; width: 50%; text-align: center; }
 .hpicons_icon_div IMG { border: 0; width: 40%; }
 .hpicons_icon_text { font-size: 2.7vw; margin: 0.2em 0 0.3em 0; color: #1a5632; font-weight: bold; height: 3em;  }
}
/*
@media screen and (max-width: 639px) {
 .hpicons_div { border: 0px solid #ff0000; }
 .hpicons_icon_div { float: left; width: 100%; text-align: center; }
 .hpicons_icon_div IMG { border: 0; width: 50%; }
 .hpicons_icon_text { font-size: 4vw; margin: 0.2em 0 0.3em 0; color: #1a5632; font-weight: bold; height: auto;  }
}
*/





/* SortIcons */

.soicons_div { border: 0px solid #ffffdf; background-color: #f3f9ed; padding: 1.7em 0 1.5em 0;}
.soicons_icon_text { font-size: 1.5vw; margin: 0.2em 0 0.3em 0; color: #1a5632; font-weight: bold; height: 2.7em;  }
.soicons_icon_div { float: left; width: 25%; text-align: center; background-color: #transparent; }
.soicons_icon_div:hover { background-color: #ffffff; }
.soicons_icon_div IMG { border: 0; width: 40%; }
.soicons_icon_div A { color: #1a5632; text-decoration: none; }
.soicons_icon_div A:hover { color: #1a5632; text-decoration: none; }
.soicons_icon_div2 { width: 80%; text-align: center; background-color: #transparent; margin: 0em auto; }
.soicons_icon_div2a { width: 80%; text-align: center; background-color: #ffffff; margin: 0em auto; }

@media screen and (max-width: 1023px) {
  .soicons_div { border: 0px solid #ffffdf; background-color: #f3f9ed; padding: 1.7em 0 1.5em 0;}
  .soicons_icon_text { font-size: 2.5vw; margin: 0.2em 0 0.3em 0; color: #1a5632; font-weight: bold; height: 2.7em;  }
  .soicons_icon_div2 { width: 85%; text-align: center; background-color: #transparent; margin: 0em auto; }
  .soicons_icon_div2a { width: 85%; text-align: center; background-color: #ffffff; margin: 0em auto; }
}




/* mobile pouze logo */
#mobile_logo_div
{
  display: none;
}
.mobile_logo
{
  display: none;
}

@media screen and (max-width: 767px) {
  #mobile_logo_div { display: block;  }
  #mobile_logo_div .mobile_logo { display: block; width: 40%; margin: 1em auto; }
}


#prehead_mobile
{
  display: none;
}
#prehead_mobile .prehead_mobile_logo { display: none; }
@media screen and (max-width: 767px) {
	#prehead_mobile
	{
	  display: block;
	}
	#prehead_mobile .prehead_mobile_logo { display: block; width: 40%; margin: 1em auto;  border: 0; }

}

.hp19tab
{
  line-height: auto;
  font-size: 100%;
  margin: 10px 0px 10px 5px;
}
.hp19tab TD { padding: 2px 8px; background-color: #dfefdf; margin: 0px; }
.hp19tab TR.tabzahlavi TD { padding: 1px 8px; text-align: center; font-size: 75%; background-color: #1b5732; margin: 0px; color: #efffef; }







/* video */

.curpointer { cursor: pointer; }
.centerit {
  border: 1px solid #7f7f7f;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
}
.video-close
{
  width: 2em;
  height: 2em;
  background-image: url('img/close3.png');
  background-size: 2em;
  position: absolute;
  top: -1em;
  right: -1em;
  z-index: 3100;
  cursor: pointer;
}

.runvideo { cursor: pointer; }
#video-player { display: none; }

#video-player.show { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 3000; background-color: rgba(0,0,0,0.9); min-height: 100%; }

.video-player-close { }

.botico_fb { xposition: relative; top: 2px; margin: 10px 5px 0 15px; height: 1.5em; }
.botico_yt { xposition: relative; top: 2px; margin: 10px 5px 0 15px; height: 1.5em; }
.botico_in { xposition: relative; top: 2px; margin: 10px 5px 0 15px; height: 1.6em; }

@media screen and (max-width: 767px) {
.botico_fb { xposition: relative; top: 2px; margin: 10px 5px 0 15px; height: 3em; }
.botico_yt { xposition: relative; top: 2px; margin: 10px 5px 0 15px; height: 3em; }
.botico_in { xposition: relative; top: 2px; margin: 10px 5px 0 15px; height: 3.2em; }
}



/* nova FG */
#fotoga-100f
{
  width: 100%;
  margin: 0;
}
#fotoga_img33_l { float: left; width: 31.6666%; xbackground-color: #afafaf; margin: 0 2% 0 0; }
#fotoga_img33_s { float: left; width: 31.6666%; xbackground-color: #afcfaf; margin: 0 2% 0 0; }
#fotoga_img33_p { float: left; width: 31.6666%; xbackground-color: #afafdf; margin: 0 0 0 0; }
#fotoga_img33_l IMG { width: 100%; display: block; margin: 0 0 1.6vw 0; border: none; }
#fotoga_img33_s IMG { width: 100%; display: block; margin: 0 0 1.6vw 0; border: none; }
#fotoga_img33_p IMG { width: 100%; display: block; margin: 0 0 1.6vw 0; border: none; }



/* malomobilni verze */
@media screen and (max-width: 639px) {
  #fotoga_img33_l { float: none; width: 98%; xbackground-color: #afafaf; margin: 0 1%; }
  #fotoga_img33_s { float: none; width: 98%; xbackground-color: #afafaf; margin: 0 1%; }
  #fotoga_img33_p { float: none; width: 98%; xbackground-color: #afafaf; margin: 0 1%; }
  #fotoga-100f { width: 98%; margin: 0 1%; }
  #fotoga_img33_l IMG { width: 100%; display: block; margin: 0 0 3vw 0; border: none; }
  #fotoga_img33_s IMG { width: 100%; display: block; margin: 0 0 3vw 0; border: none; }
  #fotoga_img33_p IMG { width: 100%; display: block; margin: 0 0 3vw 0; border: none; }
}









.vidonleft
{
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  xborder: 1px solid #afafaf;
}
.vidonleft iframe
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


#clandet { xborder: 1px solid #efefef; }
#clandet IMG { width: 48%; margin-bottom: 1em; margin-right: 1em; }
#clandet DIV.fotky2 { margin: 0; text-align: left; }
#clandet DIV.fotky3 { margin: 0; text-align: left; }
#clandet DIV.fotky4 { margin: 0; text-align: left; }
#clandet DIV.fotky5 { margin: 0; text-align: left; }

#clandet DIV.fotky2 IMG { width: auto; height: 18em; margin-right: 1em; margin-bottom: 1em; }
#clandet DIV.fotky3 IMG { width: auto; height: 11.3em; margin-right: 1em; margin-bottom: 1em; }
#clandet DIV.fotky4 IMG { width: auto; height: 8.1em; margin-right: 1em; margin-bottom: 1em; }
#clandet DIV.fotky5 IMG { width: auto; height: 6.2em; margin-right: 1em; margin-bottom: 1em; }

#clandet IMG.left { float: left; width: 48%; margin-right: 1em; margin-bottom: 1em; }
#clandet IMG.right { float: right; width: 48%; margin-left: 1em; margin-bottom: 1em; }
#clandet H1 { margin-bottom: 0.7em; margin-top: 0.4em; }

#clandet A { color: #1a5632; text-decoration: underline; }
#clandet A:hover { color: #000000; text-decoration: none; }

#clandet DIV.video1fr { x-border: 1px solid #afafaf; width: 48%; margin: 1em 0 1em 0; }
#clandet DIV.video1 { width: 100%; position: relative; padding-bottom: 56.25%; height: 0; xborder: 1px solid #afafaf; margin: 0; }
#clandet DIV.video1 iframe {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%; }

#clandet DIV.video2fra { xborder: 1px solid #af0000; width: 48%; margin: 1em 3.7% 1em 0; float:left; }
#clandet DIV.video2frb { xborder: 1px solid #af0000; width: 48%; margin: 1em 0% 1em 0; float:left; }
#clandet DIV.video2 { width: 100%; position: relative; padding-bottom: 56.25%; height: 0; xborder: 1px solid #afafaf; margin: 0; }
#clandet DIV.video2 iframe {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%; }

/* malomobilni verze */
@media screen and (max-width: 639px) {
  #clandet H1 { font-size: 4vw; }
  #clandet IMG { width: 100%; }
  #clandet IMG.left { float: none; width: 100%; margin-right: 0; }
  #clandet IMG.right { float: none; width: 100%; margin-left: 0; }

  #clandet DIV.fotky2 IMG { width: 100%; height: auto; margin-right: 0; margin-bottom: 1em; }
  #clandet DIV.fotky3 IMG { width: 100%; height: auto; margin-right: 0; margin-bottom: 1em; }
  #clandet DIV.fotky4 IMG { width: 100%; height: auto; margin-right: 0; margin-bottom: 1em; }
  #clandet DIV.fotky5 IMG { width: 100%; height: auto; margin-right: 0; margin-bottom: 1em; }

  #clandet DIV.video1fr { width: 100%; margin: 1em 0 0.5em 0; }
  #clandet DIV.video1 { width: 100%; position: relative; padding-bottom: 56.25%; height: 0; xborder: 1px solid #afafaf; margin: 0; }
  #clandet DIV.video1 iframe {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%; }
  
  #clandet DIV.video2fra { width: 100%; margin: 1em 0 0.5em 0; float:none; }
  #clandet DIV.video2frb { width: 100%; margin: 1em 0 0.5em 0; float:none; }
  #clandet DIV.video2 { width: 100%; position: relative; padding-bottom: 56.25%; height: 0; xborder: 1px solid #afafaf; margin: 0; }
  #clandet DIV.video2 iframe {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%; }
  .vidonleft iframe
  {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
  }
}

