body { position: relative; font-family: 'Roboto', sans-serif; line-height: 1.6; color: #454545; font-size: 14px; font-weight: 400;}

/* zlatá z loga: #b88812 */

body, h1, h2, h3, ul, ol, p, hr { margin: 0; }
ul { padding: 0; list-style: none url();}
ol { padding: 0 0 0 0px; list-style: none;}
ol li {counter-increment: item;}
ol li:before {margin-right: 10px; content: counter(item); background: #007ac3; border-radius: 50%; color: #fff; width: 24px; text-align: center; display: inline-block; font-weight: bold;}

.mainBorderRadius {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}

* { box-sizing: border-box; }

a { text-decoration: none; color: inherit;}
a:hover {text-decoration: underline;}
img { max-width: 100%; max-height: 100%; }
a img { display: block; }
hr { width: 100%; height: 2px; float: left; border: 0; }

.full-frame, .container, .row { width: 100%; float: left; }

.main-frame {width: 1200px; margin: 0px auto;}

.flexbox {display: -webkit-flex; display: -webkit-box; display: -moz-flex; display: -moz-box; display: -ms-flexbox; display: flex;}

IFRAME {max-width: 100%;}
/* tinymce */

/* tinymce */

.mainBorderRadius {-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
.mainBorderRadiusTR {-webkit-border-top-right-radius: 3px; -moz-border-top-right-radius: 3px; border-top-right-radius: 3px;}
.mainBorderRadiusBR {-webkit-border-bottom-right-radius: 3px; -moz-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;}


#social-icons {position: fixed; width: 90px; right: 0; top: 35vh; z-index: 30000;}
#social-icons A IMG {display: inline-block;}
#social-icons A:HOVER {text-decoration: none;}
#social-icons .fb {width: 100%; background-color: #0c9bd0; display: inline-block; padding: 30px 0 24px 0; justify-content: center; text-align: center;}
#social-icons .camera {width: 100%; background-color: #0e8cba; display: inline-block; padding: 20px 0 14px; justify-content: center; text-align: center; line-height: 1.2; color: #fff; font-size: 14px;}


/* Hlavicka */
HEADER {width: 100%; height: auto; background-color: #fff; z-index: 10; font-size: 15px;}
HEADER.shadow {/*-webkit-box-shadow: 0px 6px 17px -1px rgba(204,204,204,1); -moz-box-shadow: 0px 6px 17px -1px rgba(204,204,204,1); box-shadow: 0px 6px 17px -1px rgba(204,204,204,1);*/}
HEADER .inner {width: 100%; height: auto; float: left; justify-content: space-between;}
HEADER .inner .left {width: 130px; padding: 18px 0;}
HEADER .inner .left .logo {width: 100%; display: block;}
HEADER .inner .left .logo IMG {display: block;}
HEADER .inner .center {align-items: stretch; justify-content: flex-end; flex-wrap: wrap;}
HEADER .inner .center .email {width: 100%; text-align: right; align-items: center; justify-content: flex-end; color: #b88812;}


/* Menu */
NAV {align-items: center;}
NAV UL {width: 100%; height: 100%; align-items: center;}
NAV UL LI {position: relative; height: 100%; align-items: center;}
NAV UL LI {background: none;}
NAV UL LI A {position: relative; height: auto; font-weight: 400; display: block; padding: 6px 30px 6px 22px; margin: 0; transition: none;}
NAV UL LI A:after {content: '/'; position: absolute; right: 0; top: 0; height: 100%; line-height: 1; align-items: center; text-align: left; font-weight: bold; display: flex; color: #b88812;}
NAV UL LI:last-child A {padding-right: 0;}
NAV UL LI:last-child A:after {display: none;}
NAV UL LI:last-child A {margin-right: 0;}
NAV UL LI A:HOVER, NAV UL LI A.active {text-decoration: none; color: #b88812;}
NAV UL LI:last-child {margin-right: 0;}
NAV UL LI A.arrow-down {background-image: url('/images/icon-arrow-down.png'); background-position: right center; background-repeat: no-repeat;}

UL.submenu {width: 100%; height: auto; float: left; display: none; position: absolute; left: 0; top: 100%; background-color: #b88812; color: #fff; z-index: 100; padding: 0; flex-wrap: wrap;}
UL.submenu LI {width: 100%; height: auto; float: left; margin: 0; border: 0;}
UL.submenu LI A {width: 100%; height: 100%; padding: 20px; white-space: nowrap; border: 0;}
UL.submenu LI A:after {}
UL.submenu LI A:HOVER {text-decoration: underline; color: #fff; background-color: #b88812;}

#hamburger {display: none;}

/* paralax */
.parallax {width: 100%; height: 100%; bottom: 0; left: 0; position: fixed; z-index: -1;}
.parallax .slide {width: 100%; height: 100%; background-position: center; background-size: cover;}
.parallax-text {position: relative; width: 100%; height: calc(100vh - 121px); min-height: 400px; float: left; color: #fff; flex-wrap: wrap; justify-content: center; align-items: center;}
.parallax-text .inner {text-align: center; font-size: 22px; font-weight: 700; flex-direction: column; text-transform: uppercase;}
.parallax-text .inner P {font-size: 48px; font-weight: 900; text-align: center; font-style: italic; text-transform: uppercase;}
.parallax-text .inner .line .btn {width: 300px; margin: 10px 0; padding: 0 50px; display: inline-block; font-size: 16px; text-transform: none;}
.parallax-text .inner .line .btn SPAN {padding: 14px 0; display: inline-block;}
.parallax-text .inner .line .btn.video {background-color: #00bce4;}
.parallax-text .inner .line .btn.virtual {background-color: #007db1;}
.parallax-text .inner .line .btn.virtual SPAN {padding-left: 40px; background-image: url('/images/icon-virtual.png'); background-repeat: no-repeat; background-position: left center;}


#mainBanner {position: relative; width: 100%; height: auto; margin: 0px; float: left;}
#mainBanner .slide {width: 100vw; height: 700px; display: flex; align-items: center; justify-content: space-around; background-size: cover; background-position: center center; color: #FFF; position: relative;}
#mainBanner .slide .overlay {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: rgba(0,0,0,0.3);}
#mainBanner .slide .centerer {display: flex; flex-direction: column; align-items: center; z-index: 1;}
#mainBanner .slide H2 {margin: 0px; font-size: 60px; text-align: center; font-weight: 700;}
#mainBanner .slide P {margin: 0px; font-size: 20px; text-align: center; font-weight: 100;}
#mainBanner .slide .buttonMore {padding: 20px 40px; background-color: #000; font-weight: 300; font-size: 16px; margin: 30px 0px 0px 0px; transition: all 200ms;}
#mainBanner .slide .buttonMore:HOVER {background-color: rgba(226,33,28,1);}
#mainBanner .slide HR {width: 300px; height: 6px; background-color: #FFF; border: 0px; margin: 100px 0px 30px 0px;}
#mainBanner .logo {position: absolute; left: 0; top: 0; width: 100%; height: 100%; align-items: flex-start; justify-content: center;}


/* Dlaždice */
#dlazdice {width: 100%; height: auto; float: left; padding: 60px 0; background-color: #fff; background-image: url('/images/dlazdice_bg.png');}
#dlazdice .inner {width: 100%; height: auto; float: left; justify-content: space-between;}
#dlazdice .inner .item {width: 19%; padding: 30px; background-color: #fff; flex-wrap: wrap; transition: 0.5s;}
#dlazdice .inner .item:HOVER {text-decoration: none; -webkit-box-shadow: 0px 0px 7px 0px rgba(153,153,153,0.4); -moz-box-shadow: 0px 0px 7px 0px rgba(153,153,153,0.4); box-shadow: 0px 0px 7px 0px rgba(153,153,153,0.4); transition: 0.5s;}
#dlazdice .inner .item .icon {width: 100%; height: 80px; justify-content: center; align-items: flex-end;}
#dlazdice .inner .item .name {width: 100%; padding: 20px 0; text-align: center; font-size: 18px; font-weight: 700; color: #007db1; text-transform: uppercase; line-height: 1.1;}
#dlazdice .inner .item .perex {width: 100%; text-align: center; color: #20b8d8; font-size: 14px;}
#dlazdice .inner .item .vice {width: 100%; margin-top: 20px; text-align: center; color: #20b8d8; font-size: 14px; font-weight: 700;}
#dlazdice .inner .item .vice SPAN {padding-top: 6px; border-top: 2px solid #20b8d8;}


/* Aktuality */
#news {width: 100%; height: auto; float: left; padding: 0; background-color: #fff; margin-top: 10px;}
#news .title {width: 100%; height: auto; float: left; justify-content: space-between; align-items: center;}
#news .title H3 {width: 100%; padding: 20px 0 0 0; margin: 40px 0 20px 0; text-align: center; font-size: 28px; background-image: url('/images/nadpis-tecky.png'); background-repeat: no-repeat; background-position: center top;}
#news .inner {width: 100%; height: auto; float: left; margin: 20px 0; flex-wrap: wrap;}
#news .inner .item {width: 32%; margin: 0 2% 25px 0; background-color: #faf8f2; flex-wrap: wrap; transition: 0.5s; border-radius: 5px; -webkit-box-shadow: 4px 4px 5px 0px rgba(204,204,204,1); -moz-box-shadow: 4px 4px 5px 0px rgba(204,204,204,1); box-shadow: 4px 4px 5px 0px rgba(204,204,204,1);}
#news .inner .item.red {padding: 40px 20px; background-color: #e35151; color: #fff;}
#news .inner .item:nth-child(3n) {margin-right: 0;}
#news .inner .item:HOVER {text-decoration: none;}
#news .inner .item .aktualne {width: 100%; margin-bottom: 5px; font-weight: bold; text-transform: uppercase; border-bottom: 2px solid #fff;}
#news .inner .item .name {width: 100%; padding: 30px 20px 10px 20px; font-size: 20px; font-weight: 700; text-transform: uppercase; line-height: 1.3; text-align: center;}
#news .inner .item .photo {background-color: #fff;}
#news .inner .item .photo IMG {border-top-left-radius: 5px; border-top-right-radius: 5px;}
#news .inner .item .perex {padding: 0 20px; text-align: center; font-weight: 100;}
#news .inner .item.red .perex {padding: 0; text-align: left;}
#news .inner .item .vice {width: 100%; margin: 40px 0; text-align: center; font-size: 15px; font-weight: 500;}
#news .inner .item .vice SPAN {padding: 8px 26px; color: #b88812; border: 2px solid #b88812; border-radius: 3px;}
#news .inner .item:HOVER .vice SPAN {color: #fff; background-color: #b88812;}


/* Výlety */
#vylety {width: 100%; height: auto; float: left; padding: 0 0 40px 0; margin-top: 40px; background-color: #fff;}
#vylety .title {width: 100%; height: auto; float: left; justify-content: space-between; align-items: center;}
#vylety .title H3 {width: 100%; padding: 20px 0 0 0; margin: 0 0 20px 0; text-align: center; font-size: 28px; background-image: url('/images/nadpis-tecky.png'); background-repeat: no-repeat; background-position: center top;}
#vylety .inner {width: 100%; height: auto; float: left; margin: 20px 0; flex-wrap: wrap;}
#vylety .inner .item {width: 24%; margin: 0 1.33333% 25px 0; background-color: #faf8f2; flex-wrap: wrap; transition: 0.5s; border-radius: 5px; -webkit-box-shadow: 4px 4px 5px 0px rgba(204,204,204,1); -moz-box-shadow: 4px 4px 5px 0px rgba(204,204,204,1); box-shadow: 4px 4px 5px 0px rgba(204,204,204,1);}
#vylety .inner .item:nth-child(4n) {margin-right: 0;}
#vylety .inner .item:HOVER {color: #fff; text-decoration: none; background-color: #b88812;}
#vylety .inner .item .name {width: 100%; padding: 30px 20px; font-size: 18px; font-weight: 500; text-transform: uppercase; line-height: 1.3; text-align: center;}
#vylety .inner .item .photo {background-color: #fff; border-radius: 5px;}
#vylety .inner .item .photo IMG {border-top-left-radius: 5px; border-top-right-radius: 5px;}


/* Text na úvodní stránce */
#hpText {width: 100%; height: auto; float: left; padding: 70px 0; margin-bottom: 30px; background-color: #fff; background-image: url('/images/hp-text-bg.png'); background-size: cover;}
#hpText .inner {width: 100%; height: auto; float: left;}
#hpText .inner H1 {width: 100%; padding: 20px 0 0 0; text-align: center; background-image: url('/images/nadpis-tecky.png'); background-repeat: no-repeat; background-position: center top;}
#hpText .inner .icons {width: 100%; margin: 50px 0 0 0; justify-content: space-between;}
#hpText .inner .icons .item {width: 90px; height: auto;}
#hpText .inner .icons .item .ikona {width: 100%; height: 90px; background-position: center center; background-repeat: no-repeat;}
#hpText .inner .icons .item .ikona.wifi {background-image: url('/images/info/wifi.png');}
#hpText .inner .icons .item .ikona.vybavena-kuchyne {background-image: url('/images/info/vybaveni-kuchyne.png');}
#hpText .inner .icons .item .ikona.terasa {background-image: url('/images/info/terasa.png');}
#hpText .inner .icons .item .ikona.bazen {background-image: url('/images/info/bazen.png');}
#hpText .inner .icons .item .ikona.sauna {background-image: url('/images/info/sauna.png');}
#hpText .inner .icons .item .ikona.gril {background-image: url('/images/info/gril.png');}
#hpText .inner .icons .item .ikona.detske-postylky {background-image: url('/images/info/detske-postylky.png');}
#hpText .inner .icons .item .ikona.herna-pro-deti {background-image: url('/images/info/herna-pro-deti.png');}
#hpText .inner .icons .item .ikona.wifi:hover {background-image: url('/images/info/wifi-on.png');}
#hpText .inner .icons .item .ikona.vybavena-kuchyne:hover {background-image: url('/images/info/vybaveni-kuchyne-on.png');}
#hpText .inner .icons .item .ikona.terasa:hover {background-image: url('/images/info/terasa-on.png');}
#hpText .inner .icons .item .ikona.bazen:hover {background-image: url('/images/info/bazen-on.png');}
#hpText .inner .icons .item .ikona.sauna:hover {background-image: url('/images/info/sauna-on.png');}
#hpText .inner .icons .item .ikona.gril:hover {background-image: url('/images/info/gril-on.png');}
#hpText .inner .icons .item .ikona.detske-postylky:hover {background-image: url('/images/info/detske-postylky-on.png');}
#hpText .inner .icons .item .ikona.herna-pro-deti:hover {background-image: url('/images/info/herna-pro-deti-on.png');}
#hpText .inner .icons .item .name {width: 100%; height: 50px; justify-content: center; align-items: center; text-align: center;}


/* Hlavní text */
MAIN {width: 100%; float: left; padding: 0; margin: 0 0 20px 0;}
MAIN .inner {width: 100%; float: left; padding: 20px 0;}
MAIN .inner .image {width: 40%; float: left;}
MAIN .inner .imageForMobile {display: none; width: 100%; float: left;} 
MAIN .inner .data {width: 60%; float: left; padding: 0 0 0 30px;}
MAIN .inner .data .links {width: 100%; float: left; margin-top: 15px;}
MAIN .inner .data .links A {transition: 0.5s;}
MAIN .inner .data .links A:HOVER {-webkit-box-shadow: 4px 4px 5px 0px rgba(153,153,153,0.7); -moz-box-shadow: 4px 4px 5px 0px rgba(153,153,153,0.7); box-shadow: 4px 4px 5px 0px rgba(153,153,153,0.7); transition: 0.5s;}
MAIN .inner .data .links .poptavka {width: auto; float: left; padding: 14px 30px 14px 50px; background-color: #f9e1b6; background-position: left 15px center; background-size: 30px auto; background-repeat: no-repeat; background-image: url('/images/hp-icon-3.png');}
MAIN .inner .data .links .soubor {width: auto; float: left; padding: 14px 30px 14px 40px; margin-left: 20px; background-color: #f2f2f2; background-position: left 15px center; background-repeat: no-repeat; background-image: url('/images/icon-pdf.png');}
MAIN .inner H1 {padding: 10px 0 20px; margin: 0; font-size: 34px; text-transform: uppercase; font-weight: 700; line-height: 1;}
MAIN .inner H2 {padding: 10px 0 20px; margin: 0; font-size: 28px; text-transform: normal; font-weight: 400; line-height: 1;}
MAIN .inner UL LI {position: relative; padding: 2px 0 2px 16px;}
MAIN .inner UL LI::before {position: absolute; content: '■'; left: 0; top: 6px; width: 100%; height: 100%; width: 10px; font-size: 12px; color: #b88812; line-height: 1;}
MAIN .inner P {padding: 10px 0;}
MAIN .inner .text-left {width: 50%; float: left;}
MAIN .inner .map {width: 50%; min-height: 300px; float: left;}
MAIN .inner P IMG {padding: 10px;}

#kontaktPage {width: 100%; float: left;}
#kontaktPage .left {width: 35%; float: left;}
#kontaktPage .right {width: 65%; float: left;}


/* Ubytování LIST */
#ubytovaniList {width: 100%; height: auto; float: left; padding: 0; background-color: #fff;}
#ubytovaniList .inner {width: 100%; height: auto; float: left; padding: 40px 0 0 0;}
#ubytovaniList .inner .item {width: 24%; padding: 0 0 20px 0; margin: 0 1.333% 25px 0; background-color: #f5f7f7; flex-wrap: wrap; transition: 0.5s;}
#ubytovaniList .inner .item:nth-child(4n) {margin-right: 0;}
#ubytovaniList .inner .item:HOVER {text-decoration: none; -webkit-box-shadow: 0px 0px 7px 0px rgba(153,153,153,0.4); -moz-box-shadow: 0px 0px 7px 0px rgba(153,153,153,0.4); box-shadow: 0px 0px 7px 0px rgba(153,153,153,0.4); transition: 0.5s;}
#ubytovaniList .inner .item .image {width: 100%;}
#ubytovaniList .inner .item .data {width: 100%; padding: 0 20px;}
#ubytovaniList .inner .item .data H3 {width: 100%; padding: 20px 0; text-align: center; font-size: 18px; font-weight: 700; color: #484848; text-transform: uppercase; line-height: 1.1;}
#ubytovaniList .inner .item .data .perex {width: 100%; text-align: center; color: #484848; font-size: 14px;}
#ubytovaniList .inner .item .data .vice {width: 100%; margin-top: 20px; text-align: center; color: #20b8d8; font-size: 14px; font-weight: 700;}
#ubytovaniList .inner .item .data .vice SPAN {padding-top: 6px; border-top: 2px solid #20b8d8;}


MAIN .videos {width: 100%; float: left; padding: 40px 20px; background-color: #fff;}
MAIN .videos .item {position: relative; width: 49%; height: 500px; float: left; margin: 0 2% 25px 0; background-size: cover;}
MAIN .videos .item:nth-child(2n) {margin-right: 0;}
MAIN .videos .item .link {position: absolute; top: 0; left: 0; width: 100%; height: 100%; align-items: center; justify-content: center;}
MAIN TABLE {border-collapse: collapse;}
MAIN TABLE THEAD TR TD {padding: 3px 8px; border: 1px solid #007db1; background-color: #007db1; color: #fff; font-weight: 700; font-size: 18px;}
MAIN TABLE TBODY TR TD {padding: 3px 8px; border: 1px solid #007db1;}


/* Navigace */
#navigation {width: 100%; height: auto; float: left; text-align: left; list-style: none; background-image: url('/images/nav-bg.png'); font-weight: 300;}
#navigation .inner {width: 100%; height: auto; float: left; padding: 0; font-size: 14px;}
#navigation .divider::after {content: ' / '; position: relative; margin: 0 10px;}
#navigation UL {height: 46px; align-items: center;}
#navigation UL LI {background: none;}
#navigation UL LI A {color: inherit;}
#navigation UL LI A:HOVER {color: inherit;}


/* Patička */
FOOTER {width: 100%; height: auto; float: left; background-color: #b88812; color: #fff; font-size: 16px;}
FOOTER A:HOVER {text-decoration: underline;}
FOOTER .inner {padding: 0;}

FOOTER .inner .left {width: 60%;}

FOOTER .inner .right {width: 40%; flex-wrap: wrap; padding: 40px 0 40px 3%;}
FOOTER .inner .right .top {width: 100%;}
FOOTER .inner .right .social {width: 100%; float: left; margin-top: 35px;}
FOOTER .inner .right .social a {display: inline-block; width: 60px; margin-right: 10px;}
FOOTER .inner .right .top H2 {padding: 0 0 10px 0; margin-bottom: 20px; font-size: 24px; font-weight: 400; background-image: url('/images/nadpis-footer-tecky.png'); background-repeat: no-repeat; background-position: left bottom;}
FOOTER .inner .right .bottom {width: 100%; flex-wrap: wrap;}
FOOTER .inner .right .bottom .link:after {content: '/'; padding: 0 10px; text-decoration: none;}
FOOTER .inner .right .bottom .link:last-child:after {content: '';}
FOOTER .inner .right .bottom .link A:after {}

#arrowUp {width: 43px; height: 42px; margin: 40px 0; background-image: url('/images/arrow-up.png'); background-repeat: no-repeat; z-index: 90000000; cursor: pointer;}




