body {background-color: #131315; color: #9f9f9f; font-family: Open Sans, Calibri, Arial; margin: 0px; }
p, table, .text ul, .text ol {text-align: center; font-size: 95%; line-height: 190%; max-width: 67em; margin-left: auto; margin-right: auto; }
a:link, a:visited    {text-decoration: none; color: #F79239; }
a:hover {color: silver;}
b {color: #cccccc;}
h1 {color: #ffffff; font-weight: 300; text-align: center;

 }
h4 {color: #ffffff; font-weight: 300; text-align: center;

 }
h2 {color: #dddddd; font-weight: 300; text-align: center;

 }
h3 {color: #dddddd; font-weight: 300; text-align: center;

 }
img {
width: 100%; height: auto; box-sizing: border-box; border: 0; border: none; 
}
.img-right {
width: 35%; float: right; clear: right; padding: .5em; padding-left: 1em; padding-right: 0em; }
.img-left {
width: 35%; float: left; clear: left; padding: .5em; padding-left: 0em; padding-right: 1em; }

.slideshow {
    width: 100%;
    position: relative;
    max-width: 100%;
}

.slideshow img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    opacity: 0;
    filter: alpha(opacity=0);
    transition: opacity 3s;
}

.slideshow .show {
    opacity: 1;
    filter: alpha(opacity=100);
}

.slideshow .stoped {
    z-index: 1;
}

.slideshow :first-child {
    position: relative; 
    display: block;
}





.logo {width: 300px; padding: 2.5em; position: absolute; top: 0; left: 0; z-index: 110; }

.menu {position: absolute; top: 0; left: 0; width: 100%; padding: 1.5em; z-index: 100; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; -ms-transition: all .5s; transition: all .5s; }
.menu li {float: right; }
.menu li li {display: block; float: none; margin: 0px; }
.menu a, .menu a:link, .menu a:visited {color: #fff; padding: 1em; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; -ms-transition: all .5s; transition: all .5s;}
.menu ul ul a {width: 100%; display: inline-block; text-align: left; }
.menu li a:hover {color: silver; }
/* submenu */
.menu ul ul {position: absolute; top: 150%; width: auto; height: auto; padding-left: 20; padding-right: 20; background: rgba(0, 0, 0, 0.6); border-top: 2px solid #888888; z-index: 100; display: none; }
.menu li {position: relative;  left: -1em; }
.menu ul {padding: 0; margin: 0; list-style: none; }
/* rozbalení */
.menu li:hover ul {display: block; }

.menu-button {position: relative; top: -2em; text-align: right; cursor: pointer;
 z-index: 102; color: #fff; -webkit-transition: color .5s; -moz-transition: color .5s; -o-transition: color .5s; -ms-transition: color .5s; transition: color .5s; 
}


.menu-button:hover, menu-button:focus {color: silver;
}

.menu-mobile {width: 100%; position: absolute; top: 2em; left: -1em; padding: 1em; display: none; z-index: 101; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; -ms-transition: all .5s; transition: all .5s; }
.menu-mobile a {color: #fff; text-align: left; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; -ms-transition: all .5s; transition: all .5s; }
.menu-mobile a:hover {color: silver; }
.menu-mobile ul {
display: none;
 list-style: none; }
.menu-mobile.zobrazit ul {display: block; position: relative; left: 1em; padding: 1em; width: 100%; background-color: rgba(0, 0, 0, 1); }
.menu-mobile li {padding: 1em; border-top: 1px solid #444444; }
.menu-mobile li li {position: relative; left: -2em; padding: 1em; }


.foto {width: 100%; height: 100%; background-color: black; background-position: center; background-repeat: no-repeat; background-size: contain; animation: anim_foto 1.3s ease; }
.uvodni_foto {width: 100%; height: 100%;  background-position: center; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; animation: anim_foto 1.3s ease; }

@keyframes anim_foto {
  0%   {opacity: 0; filter: alpha(opacity=0); }
  100% {opacity: 1; filter: alpha(opacity=100);} 
}


video {
width: 100%; height: auto; }

.banner {width: 100%; height: 50%; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; animation: anim_foto 1.3s ease; }


.nadpis_anim {text-align: center; width: 100%; animation: animnadpis 1.3s ease .4s backwards; position: absolute; top: 40vh; }
@keyframes animnadpis {
  0%   {top: 50vh; opacity: 0; filter: alpha(opacity=0); }
  100% {top: 40vh; opacity: 1; filter: alpha(opacity=100); }
}

.nadpis {display: inline-block; font-size: 150%; padding-left: 30px; padding-right: 30px;}
.nadpis h4 {position: relative; top: -1em; text-align: center; }
.nadpis_pozadi {background: rgba(0, 0, 0, 0.2); padding-left: 100px; padding-right: 100px; margin-bottom: 2em}

.tlacitko_pokracovat_vpravo {position: relative; top: 0px; border: 2px solid #fff; border-radius: .2em; padding: 10; text-decoration: none; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.tlacitko_pokracovat_vpravo:hover {border: 2px solid rgba(250, 250, 250, 0); padding-left: 20; padding-right: 20; }
.tlacitko_pokracovat_vpravo span {color: #fff; position: relative; left: 7px;  -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.tlacitko_pokracovat_vpravo:hover span {color: #fff; left: -5px; }
.tlacitko_pokracovat_vpravo span+span {color: #fff; opacity: 0;  filter: alpha(opacity=0); left: -5px; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.tlacitko_pokracovat_vpravo:hover span+span {color: #fff; opacity: 1;  filter: alpha(opacity=100); left: 7px; }

.tlacitko_pokracovat_vlevo {position: relative; top: 0px; border: 2px solid #fff; border-radius: .2em; padding: 10; text-decoration: none; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.tlacitko_pokracovat_vlevo:hover {border: 2px solid rgba(250, 250, 250, 0); padding-left: 20; padding-right: 20; }
.tlacitko_pokracovat_vlevo span {color: #fff; position: relative; right: 7px;  -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.tlacitko_pokracovat_vlevo:hover span {color: #fff; right: -5px; }
.tlacitko_pokracovat_vlevo span+span {color: #fff; opacity: 0;  filter: alpha(opacity=0); right: -5px; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.tlacitko_pokracovat_vlevo:hover span+span {color: #fff; opacity: 1;  filter: alpha(opacity=100); right: 7px; }

.tlacitko_pozadi {background: rgba(0, 0, 0, 0.2); }

.sipka {width: 50px; height: 50px; color: #fff; background: rgba(0, 0, 0, 0.2); border: 2px solid #555; border-radius: .2em; padding: 10; text-decoration: none; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.sipka:hover {background: rgba(60, 60, 60, 1); border: 2px solid rgba(250, 250, 250, 0); }
.nahoru {position: absolute; right: 0em; }
.cela {position: absolute; bottom: 1em; right: 14.2em; }
.vlevo {position: absolute; bottom: 1em; right: 10.9em; }
.vpravo {position: absolute; bottom: 1em; right: 7.6em; }
.info {position: absolute; bottom: 1em; right: 4.3em; }
.krizek {position: absolute; bottom: 1em; right: 1em; }






.foto_popis {text-align: center; width: 100%; animation: animpopis 1.3s ease; position: absolute; bottom: 0em; }
@keyframes animpopis {
  0%   {bottom: 2em; opacity: 0; filter: alpha(opacity=0); }
  100% {bottom: 0em; opacity: 1; filter: alpha(opacity=100); }
}



.foto-ovladani-zavrit {position: absolute; top: 0em; width: 100%; text-align: right; }
.foto-ovladani-zavrit a {color: #fff; font-size: 200%; padding: .5em; text-decoration: none; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.foto-ovladani-zavrit a:hover {color: silver; }
.foto-ovladani-vlevo {position: absolute; bottom: .5em; width: 45%; text-align: right; }
.foto-ovladani-vlevo a {color: #fff; font-size: 200%; padding-left: 1em; padding-right: 1em; text-decoration: none; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s;  }
.foto-ovladani-vlevo a:hover {color: silver; }
.foto-ovladani-vpravo {position: absolute; bottom: .5em; width: 59%; text-align: right; }
.foto-ovladani-vpravo a {font-size: 200%; padding-left: 1em; padding-right: 1em; color: #fff; text-decoration: none; -webkit-transition: all .25s; -moz-transition: all .25s; -o-transition: all .25s; -ms-transition: all .25s; transition: all .25s; }
.foto-ovladani-vpravo a:hover {color: silver; }


.odsazeni {position: relative; top: -1em; }

.vanoce {display: none; }
.vanoce p {max-width: 45em;}

.text, .vanoce {padding: 1em; padding-left: 3em; padding-right: 3em; }
.text h2 {text-align: center;
 }
.text p {text-align: justify;
 }
.text ul, .text ol {text-align: justify;
 }


.poukazy-misto {text-align: center; }
.poukazy-container {display: inline-block; width: 100%; max-width: 72em; padding: 2em; }
.poukazy { width: 50%; float: right; padding: 2em; }
.poukazy h3 {text-align: left; }
.poukazy p {text-align: left; }
.poukazy form {text-align: left; }


.sedy {max-width: 65em; margin: auto; margin-right: auto; padding: 1em; background-color: #222; }

.poukaz-objednavka {width: 100%; display: inline-block; text-align: center; }
.poukaz-objednavka-container {width: 33.3333333%; width: calc(100% / 3 - 0.01px); width: -webkit-calc(100% / 3);  float: left; padding: 1em; text-align: center; }
.popis-pole-container {display: inline-block; width: 100%; }
.popis, .pole {width: 50%; float: left; padding: .5em; }
.popis {text-align: right; }
.pole {text-align: left; }
@media screen and (max-width: 1180px)
{
.poukazy-container { max-width: 600px;}
.poukazy {width: 100%; padding: 0em; }
.poukazy h3 {text-align: center; }
.poukazy p {text-align: center; }
.poukazy form {text-align: center; }
.sedy {margin: 2em; }
.poukaz-objednavka-container h4 {text-align: left; }
.popis, .pole {width: 100%; text-align: left; }
}
@media screen and (max-width: 740px)
{
.sedy {padding: 0em; padding-bottom: 1em; }
.poukaz-objednavka-container {width: 100%; }
.poukaz-objednavka-container h4 {text-align: center; }
.popis, .pole {text-align: center; }
}

.rezervace-misto {margin-left: auto; margin-right: auto; text-align: center;}
.rezervace-container {display: inline-block; margin: 1em}
.rezervace-box {width: 200; height: auto; float: left; padding: 1em; border: 1px solid #aaa; margin: .5em; }
.rezervace-box p {text-align: center; }
.rezervace-box form {text-align: center; }

.rezervace-tlacitka {width: 100%; }
.rezervace-tlacitko-zpet {width: 33.3333333%; width: calc(100% / 3 - 0.01px); width: -webkit-calc(100% / 3); text-align: left; float: left; }
.rezervace-tlacitko-dnes {width: 33.3333333%; width: calc(100% / 3 - 0.01px); width: -webkit-calc(100% / 3); text-align: center; float: left; }
.rezervace-tlacitko-vpred {width: 33.3333333%; width: calc(100% / 3 - 0.01px); width: -webkit-calc(100% / 3); text-align: right; float: left; }
.rezervace-tyden {width: 100%; }
.rezervace-den {width: 13.3%; display: inline-block; background-color: #222; margin: .25em; }
.rezervace-nahled  {width: 100%; text-align: center; float: left; padding: 1em; }
.rezervace-program {width: 100%; text-align: center; float: left; padding: 1em; }
.rezervace-tlacitko-rezervovat {width: 100%; text-align: center; padding: 1em; }



* {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}

.box-container {display: inline-block;
 padding: 7em; width: 100%; }
.box {width: 33.3333333%; width: calc(100% / 3 - 0.01px); width: -webkit-calc(100% / 3); float: left; padding: 2em; }
.box h3 {text-align: center;
 }
.box p {text-align: center;
 }


.box-foto {width: 25%; width: -webkit-calc(100% / 4); float: left; padding: 1em; }

.zvyraznit {color: white; background-color: orange; }

.nenechte-si-ujit-banner {width: 100%; text-align: center; color: #ffffff; padding: 4em; background-position: right; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.nenechte-si-ujit-banner h1 {text-align: center; }
.nenechte-si-ujit-banner p {text-align: center; font-size: 120%; }

.darujte-zazitek-banner {width: 100%; text-align: center; color: #ffffff; padding: 4em; background-position: right; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.darujte-zazitek-banner h1 {text-align: center; }
.darujte-zazitek-banner p {text-align: center; font-size: 120%; }



.spoluprac {background-color: #1b1b1b; padding: 0.5em; text-align: center; }

.copy {width: 100%; background-color: #000000; padding: 0.25em; padding-left: 1em; padding-right: 1em; }
.copy p {text-align: center; }









@media screen and (max-width: 1366px)
{
.logo {width: 250px; }
.menu ul {font-size: 90%; }
.menu li li {font-size: 105%; }
.nadpis {font-size: 125%; }

.box {padding: 2em; }
.box-container-foto {padding: 4em; }
.box-foto {width: 33.3333333%; width: calc(100% / 3 - 0.01px); width: -webkit-calc(100% / 3); }

.rezervace-den {width: 100%; display: inline-block; }
.rezervace-nahled  {width: 25%; text-align: left; float: left; }
.rezervace-program {width: 75%; text-align: left; float: left; }
.rezervace-tlacitko-rezervovat {width: 100%; text-align: right; }

}




@media screen and (max-width: 1024px)
{
.menu {display: none; }
.menu-mobile {
display: block;
 }
.menu-mobile.zobrazit {display: block; }
.box-container {padding: 0em; }
.box {width: 100%; padding: 5em; }
.box p {max-width: 40em; }
.box-container-foto {padding: 2em; }
.box-foto {width: 50%; width: -webkit-calc(100% / 2); }
}






@media screen and (max-width: 740px)
{
.img-right {
width: 50%; }
.img-left {
width: 50%; }
.nadpis {font-size: 100%; }
.nadpis h4 {font-size: 125%; }
.nadpis_anim {position: absolute; top: 30%; }
@keyframes animnadpis {
  0%   {position: absolute; top: 40%; }
  100% {position: absolute; top: 30%; }
}

.box {padding: 3em; }
}




@media screen and (max-width: 640px)
{
.nadpis {padding-left: 40px; padding-right: 40px; font-size: 90%; }
.box-container-foto {padding: 1em; }
.box-foto {width: 100%; }
}


@media screen and (max-width: 600px)
{
.foto-ovladani-zavrit a {color: #fff; font-size: 125%; padding: .5em; }
.foto-ovladani-vlevo a {color: #fff; font-size: 150%; padding: .5em; }
.foto-ovladani-vpravo a {font-size: 150%; padding: .5em; }

.rezervace-nahled  {width: 100%; text-align: center; float: left; }
.rezervace-program {width: 100%; text-align: center; float: left; }
.rezervace-tlacitko-rezervovat {width: 100%; text-align: center; }

}


@media screen and (max-width: 570px)
{
.img-right {
width: 100%; float: none; padding: 1em;  padding-left: 0em;  padding-right: 0em;}
.img-left {
width: 100%; float: none; padding: 1em;  padding-left: 0em;  padding-right: 0em;}
.menu-mobile {padding: .2em; }
.logo {width: 200px; padding: 1.5em; }
.text, .vanoce {padding-left: 2em; padding-right: 2em; }
.box {padding: 2em; }
}



@media screen and (max-width: 420px)
{
.logo {width: 180px; padding: 1.7em; }
.text, .vanoce {padding-left: 1.5em; padding-right: 1.5em; }
.box {padding: 1.5em; }
.nadpis {padding-left: 10px; padding-right: 10px; }
}
