
.burger {display: none;}

#webWrapper {width: 100%; float: left; overflow-x: hidden;}

#webWrapper .webWrapperContent {position: relative; width: 100vw; left: 0; transition: left 0.4s ease;}
#webWrapper.active .webWrapperContent {left: 300px;}

#menuMobileCloser {position: fixed; top: 0; left: 0; width: 100%; height: 100%;}

#web {width: 100%; float: left; position: relative; overflow: hidden;}

#bannerContainer {width: 100%; height: 100vh; align-items: center; justify-content: center;}

#banner {width: 100%; height: 100%;}
#banner .inner {width: 100%; height: 100%;}
#banner .inner .bannerList {width: 100%; height: 100%;}
#banner .inner .bannerList .cover {width: 100%; height: 100%;}
#banner .inner .bannerList .cover .photo {width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover;}

#banner .swiper-button-next {right: 20px;}
#banner .swiper-button-prev {left: 20px;}
#banner .swiper-button-next, #banner .swiper-button-prev {color: #ffffff; opacity: 0.4; transition: opacity 0.3s ease; z-index: 99999 !important;}
#banner .swiper-button-next:hover, #banner .swiper-button-prev:hover {opacity: 1;}

#header {position: absolute; z-index: 777; left: 0; top: 0; width: 100%; height: 146px; justify-content: center;}

.menuFrame {position: absolute; z-index: 777; right: 20px; top: 0; width: auto; height: 146px; align-items: center;}
.menuFrame .menu {}
.menuFrame .menu ul {}
.menuFrame .menu ul li {}
.menuFrame .menu ul li a {margin: 0 15px; padding: 4px 0; color: #ffffff; font-size: 16px; font-weight: bold; border: 2px solid transparent; border-left: 0; border-right: 0;}
.menuFrame .menu ul li a:hover {border-bottom-color: #ffffff;}



#webWrapper .menuMobile {position: fixed; width: 300px; height: 100%; top: 0; z-index: 999999999; padding: 50px; background-color: #ffffff; left: -300px; overflow-y: scroll; overflow-x: hidden;}
#webWrapper .menuMobile {align-items: center; justify-content: flex-start; transition: left 0.4s ease;}
#webWrapper .menuMobile ul {margin: 0; padding: 0; flex-direction: column;}
#webWrapper .menuMobile ul li {}
#webWrapper .menuMobile ul li a {margin: 20px 0; font-size: 18px; font-weight: 300;}

#webWrapper.active .menuMobile {left: 0;}


#homeText {width: 100%; float: left; color: #313131;}
#homeText .inner {width: 100%; float: left; padding: 30px 0; align-items: center; justify-content: space-between;}
#homeText .inner .left {width: auto; margin-right: 50px;}
#homeText .inner .left h1 {margin: 0; padding: 0; font-size: 35px; font-weight: 900;}
#homeText .inner .left p {font-weight: 300; font-size: 30px; font-style: italic;}
#homeText .inner .right {flex: 1; font-size: 16px; line-height: 1.2;}


#rezervaceFrame {position: relative; width: 100%; float: left; height: 400px; align-items: center; justify-content: center; flex-direction: column; background-size: cover; background-position: center;}
#rezervaceFrame {color: #ffffff;}
#rezervaceFrame .filter {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(0,0,0,0.35);}
#rezervaceFrame h2 {margin: 0; padding: 0; position: relative; z-index: 999; font-size: 35px; font-weight: 900;}
#rezervaceFrame a {position: relative; z-index: 999; margin-top: 20px; padding: 10px 40px; font-size: 20px; font-weight: 700; border: 2px solid #ffffff; text-transform: uppercase;}
#rezervaceFrame a:hover {background-color: #333333;}


#recenzeHome {width: 100%; float: left; background-color: #eeeeee;}
#recenzeHome .inner {width: 100%; float: left; padding: 60px 0;}
#recenzeHome .inner .left {width: calc(33.33333% - 30px); margin-right: 30px; color: #313131; justify-content: center; flex-direction: column;}
#recenzeHome .inner .left h2 {margin: 0; padding: 0; font-size: 35px; font-weight: 900;}
#recenzeHome .inner .left .perex {font-weight: 300; font-size: 30px; font-style: italic;}
#recenzeHome .inner .right {flex: 1;}
#recenzeHome .inner .right .item {width: calc(50% - 15px); margin: 15px 30px 15px 0;}
#recenzeHome .inner .right .item:nth-child(2n) {margin-right: 0;}

.recenzeItem {padding: 40px 40px; background-color: #ffffff; flex-direction: column;}
.recenzeItem .text {font-size: 16px; color: #6d6d6d; font-weight: 300;}
.recenzeItem .text p:first-of-type::before {content: url("/images/uvozovky.png"); margin-right: 4px; vertical-align: middle;}
.recenzeItem .text p:last-of-type::after {content: url("/images/uvozovky.png"); margin-left: 4px; vertical-align: middle;}
.recenzeItem .name {margin-top: 30px; padding: 10px 0 0 0; font-size: 17px; color: #313131; font-weight: 700; background-image: url("/images/dots.png"); background-repeat: no-repeat; background-position: left top;}


#recenze {width: 100%; float: left; padding: 0 0 40px 0;}
#recenze .inner {width: 100%; float: left; flex-wrap: wrap;}
#recenze .inner .item.recenzeItem {width: calc(33.33333% - 20px); margin: 15px 30px 15px 0; background-color: #eeeeee;}
#recenze .inner .item.recenzeItem:nth-child(3n) {margin-right: 0;}


#mainText {width: 100%; float: left; padding: 0 0 40px 0; overflow: hidden;}
#mainText .inner {width: 100%; float: left;}
#mainText .inner .subText {width: 100%; float: left;}
#mainText .inner .subText h2 {width: 100%; float: left; padding: 0 0 0 0; text-align: center;}

.carousel {width: 100%; float: left;}
.carousel img { height: 650px; width: auto; display: block; margin: 0 auto; border-radius: 0px;}
.carousel .slick-slide {display: flex !important; justify-content: center; align-items: center; height: auto !important;}
.carousel .slick-slide > div {display: flex; justify-content: center;}
.carousel .slick-slide {padding: 0 5px;}
.slick-prev {left: 10px !important; z-index: 999; width: 30px !important; height: 30px !important;}
.slick-prev:before {content: "‹"; font-size: 30px !important; color: black;}
.slick-next {right: 10px !important; z-index: 999; width: 30px !important; height: 30px !important;}
.slick-next:before {content: "›"; font-size: 30px !important; color: black;}
.slick-slide.slick-current {padding-left: 0;}


#footer {width: 100%; float: left; background-color: #242424; color: #ffffff;}
#footer a:hover {text-decoration: underline;}
#footer .inner {width: 100%; float: left; padding: 60px 0; justify-content: space-between; align-items: center;}
#footer .inner .links {font-size: 16px; font-weight: 400; color: #f1f1f1;}
#footer .inner .links ul {margin: 0; padding: 0; list-style: none;}
#footer .inner .links ul li {margin: 0; padding: 0;}
#footer .inner .links ul li a {margin: 5px 30px 5px 0;}
#footer .inner .right {font-size: 16px; font-weight: 300; font-style: italic;}
#footer .inner .right .social {display: flex; margin: 0 0 15px 0; justify-content: flex-end;}
#footer .inner .right .social img {height: 50px;}