.filter {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(40,102,100,0.50);}
.burger {display: none;}

header {width: 100%; float: left;}
header .inner {width: 100%; float: left; justify-content: space-between;}
header .inner .logo {padding: 20px 0;}
header .inner .logo a {display: block;}
header .inner .logo a img {display: block;}
header .inner .right {flex-direction: column; justify-content: space-between;}
header .inner .right .info {padding: 20px 0 0 0; text-align: right; font-size: 16px; color: #00a79d;}
header .inner .right .info .phone {padding: 0 0 0 20px; background-image: url('/images/icon-phone.png'); background-repeat: no-repeat; background-position: left center;}
header .inner .right .info .email {padding: 0 0 0 25px; margin: 0 0 0 40px; background-image: url('/images/icon-email.png'); background-repeat: no-repeat; background-position: left center;}
header .inner .right .menuFrame {justify-content: flex-end;}

header .inner .right .menuFrame .menu ul {list-style: none url(); padding: 0; margin: 0;}
header .inner .right .menuFrame .menu ul li {padding: 0 20px;}
header .inner .right .menuFrame .menu ul li a {align-items: center; padding: 10px 0; font-size: 18px; font-weight: 400; color: #286664; border-top: 5px solid transparent; border-bottom: 5px solid transparent; text-transform: uppercase;}
header .inner .right .menuFrame .menu ul li a:hover {color: #00a79d; border-bottom-color: #00a79d; text-decoration: none;}
header .inner .right .menuFrame .menu ul li a.active {color: #00a79d; border-bottom-color: #00a79d;}
header .inner .right .menuFrame .menu ul li:last-child {padding-right: 0;}
header .inner .right .menuFrame .menu ul li a img {display: block;}
header .inner .right .menuFrame .menu ul li:first-child a:hover {border-bottom-color: transparent;}


#mainBanner {width: 100%; height: auto; margin: 0px; float: left;}
#mainBanner .slide {width: 100vw; height: 700px; display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center center; color: #FFF; position: relative;}
#mainBanner .slide .filter {}
#mainBanner .slide .text {width: 1200px; margin: 0 auto 40px auto; z-index: 1; text-align: center;}
#mainBanner .slide .text h2 {position: relative; margin: 0 0 25px 0; padding: 50px 0 0 0; font-size: 3vw; text-transform: uppercase; text-shadow: 0px 0px 10px rgba(0,0,0,0.5); text-align: center;}
#mainBanner .slide .text h2:before {position: absolute; content: ''; left: calc(50% - 139px / 2); top: 0; width: 139px; height: 23px; background-image: url('/images/vlnky-bile.png'); background-position: center top; background-repeat: no-repeat;}
#mainBanner .slide .text p {margin: 0 0 25px 0; font-size: 2vw; font-weight: 500;}
#mainBanner .slide .buttonMore {display: inline-block; padding: 15px 50px; background-color: #c49a6c; color: #fff; font-weight: 500; font-size: 18px; border-radius: 0px; margin: 0px 0px 0px 0px; transition: all 200ms; text-transform: uppercase;}
#mainBanner .slide .buttonMore:hover {background-color: #916d47; text-decoration: none;}


#homeText {width: 100%; height: auto; margin: 0px; padding: 80px 0; float: left; justify-content: flex-end;}
#homeText .text {width: calc(50% - (50% - 600px)); padding: 0; font-size: 16px; font-weight: 400;}
#homeText .text h1 {position: relative; width: 100%; margin: 0; padding: 40px 0 0 0; color: #286664; font-size: 30px; font-weight: 700; text-transform: uppercase;}
#homeText .text h1:before {position: absolute; content: ''; left: 0; top: 0; width: 139px; height: 23px; background-image: url('/images/vlnky-zelene.png'); background-position: center top; background-repeat: no-repeat;}
#homeText .text .perex {width: 100%; margin: 0; padding: 0; color: #286664; font-size: 30px; font-weight: 400; text-transform: uppercase;}
#homeText .text p {padding: 10px 0; margin: 0;}
#homeText .photos {width: 50%; padding: 0 0 0 80px;}
#homeText .photos img {display: block; max-width: 100%;}
#homeText .photos .photo1 {width: 240px; background-repeat: no-repeat; background-position: center; background-size: cover;}
#homeText .photos .photo2 {flex: 1; margin-left: 20px; background-repeat: no-repeat; background-position: center; background-size: cover;}


#mapKontakt {width: 100%; height: auto; margin: 0px; padding: 0; float: left;}
#mapKontakt .map {width: calc(50% + 80px);}
#mapKontakt .map iframe {width: 100%; height: 100%; display: block;}
#mapKontakt .kontakt {flex: 1; padding: 80px; background-color: #286664; color: #fff; font-size: 17px; font-weight: 300;}
#mapKontakt .kontakt h2 {position: relative; margin: 0 0 25px 0; padding: 40px 0 0 0; font-size: 30px; text-transform: uppercase; text-shadow: 0px 0px 10px rgba(0,0,0,0.5); text-align: left;}
#mapKontakt .kontakt h2:before {position: absolute; content: ''; left: 0; top: 0; width: 139px; height: 23px; background-image: url('/images/vlnky-bile.png'); background-position: center top; background-repeat: no-repeat;}
#mapKontakt .kontakt .adresa {width: 100%; float: left; height: auto; margin: 0px; padding: 0 0 0 30px; line-height: 1.4; background-image: url('/images/icon-map.png'); background-repeat: no-repeat; background-position: left top 3px;}
#mapKontakt .kontakt .user {width: 100%; float: left; height: auto; margin: 30px 0 0 0; padding: 0 0 0 30px; background-image: url('/images/icon-user.png'); background-repeat: no-repeat; background-position: left top;}
#mapKontakt .kontakt .user .name {font-weight: 700; margin-bottom: 5px;}
#mapKontakt .kontakt .btn {width: 100%; height: auto; margin: 40px 0 0 0; padding: 0; float: left;}


#mainText {width: 100%; float: left; margin: 60px 0;}
#mainText .inner {width: 100%; float: left; margin: 0;}


#rezervace {width: 100%; float: left;}
#rezervace img {max-width: 100%; display: block;}
#rezervace .inner {width: 100%; float: left;}
#rezervace .inner .left {width: calc(50% - 20px); float: left;}
#rezervace .inner .right {flex: 1; width: calc(50% - 20px); float: left; margin-left: 40px; padding: 0 0 0 80px; color: #00a79d; font-size: 17px; font-weight: 300; flex-direction: column;}
#rezervace .inner .right .adresa {width: 100%; float: left; height: auto; margin: 0px; padding: 0 0 0 30px; line-height: 1.4; background-image: url('/images/icon-map.png'); background-repeat: no-repeat; background-position: left top 3px;}
#rezervace .inner .right .user {width: 100%; float: left; height: auto; margin: 30px 0 0 0; padding: 0 0 0 30px; background-image: url('/images/icon-user.png'); background-repeat: no-repeat; background-position: left top; flex-direction: column;}
#rezervace .inner .right .user .name {font-weight: 700; margin-bottom: 5px;}
#rezervace .inner .right .btn {width: 100%; height: auto; margin: auto 0 0 0; padding: 0; float: left;}
#rezervace .inner .right .btn .btn-zelena {margin-top: 20px;}



#apartman {width: 100%; float: left; margin: 60px 0 60px 0;}
#apartman p {padding: 10px 0; margin: 0; font-size: 16px; font-weight: 300;}
#apartman h1 {position: relative; width: 100%; margin: 0 0 10px 0; padding: 40px 0 0 0; color: #286664; font-size: 30px; font-weight: 700; text-transform: uppercase;}
#apartman h1:before {position: absolute; content: ''; left: 0; top: 0; width: 139px; height: 23px; background-image: url('/images/vlnky-zelene.png'); background-position: center top; background-repeat: no-repeat;}
#apartman img {max-width: 100%; display: block;}
#apartman .inner {width: 100%; float: left;}
#apartman .inner .row1 {width: 100%; float: left; margin-bottom: 60px;}
#apartman .inner .row1 .left {width: 50%; float: left; align-items: center;}
#apartman .inner .row1 .right {width: 50%; float: left; padding: 0 0 0 40px; align-items: center;}
#apartman .inner .row2 {width: 100%; float: left;}
#apartman .inner .row2 .left {width: 50%; float: left; padding: 0 0 0 0; flex-direction: column; justify-content: center;}
#apartman .inner .row2 .left .item {width: 100%; float: left; height: 66px; padding: 15px 0 15px 100px; font-size: 16px; color: #286664; text-transform: uppercase; align-items: center;}
#apartman .inner .row2 .left .item.checkin {background-image: url('/images/icon-check-in.png'); background-repeat: no-repeat; background-position: left center;}
#apartman .inner .row2 .left .item.nekuracke {background-image: url('/images/icon-nekuracke.png'); background-repeat: no-repeat; background-position: left center;}
#apartman .inner .row2 .left .item.zvirata {background-image: url('/images/icon-zvirata.png'); background-repeat: no-repeat; background-position: left center;}
#apartman .inner .row2 .left .item.vecirky {background-image: url('/images/icon-vecirky.png'); background-repeat: no-repeat; background-position: left center;}
#apartman .inner .row2 .right {width: 50%; float: left; align-items: center;}
#apartman .inner h2 {width: 100%; float: left; margin: 60px 0 40px 0; font-size: 30px; font-weight: 500; color: #286664; text-transform: uppercase;}


#navig {width: 100%; float: left; background-color: #00a79d; color: #fff; font-weight: 300;}
#navig .inner {width: 100%; float: left; height: 50px; align-items: center;}
#navig .inner a:last-child {font-weight: 700;}


footer {width: 100%; float: left; padding: 20px 0; background-color: #c49a6c; color: #fff; font-size: 16px; font-weight: 300;}
footer .inner {width: 100%; float: left; justify-content: space-between; align-items: center;}