
#topFrame {width: 100%; float: left; padding: 20px 0; color: #626262;}
#topFrame .inner {width: 100%; float: left; justify-content: flex-end;}
#topFrame .inner span {margin-right: 5px;}
#topFrame .inner .langs {align-items: center;}
#topFrame .inner .langs img {width: 25px; height: 25px; border: 1px solid #969696; border-radius: 50%;}
#topFrame .inner .currency {margin-left: 20px; align-items: center;}


#navigFrame {width: 100%; float: left; padding: 30px 0; background: #f5f5f5; font-size: 16px; text-transform: uppercase; color: #737373;}
#navigFrame .inner {width: 100%; float: left; justify-content: space-between;}
#navigFrame .inner .item {align-items: center;}
#navigFrame .inner .item svg {margin-right: 5px;}


#datesFrame {width: 100%; float: left; padding: 40px 0;}
#datesFrame .inner {width: 100%; float: left; flex-wrap: wrap;}
#datesFrame .inner .date {position: relative; width: 285px; height: 60px; padding: 2px; margin: 0 20px 30px 0; background-image: url('../images/background/dashed-border.png'); background-size: 100% 100%;}
#datesFrame .inner .date label {padding: 0 10px; align-items: center;}
#datesFrame .inner .date input {flex: 1; border: 0; outline: 0; background-color: transparent; font-size: 15px; font-weight: 700; color: #626262;}
#datesFrame .inner .date .icon {position: absolute; z-index: -1; top: 2px; right: 2px; width: 80px; height: calc(100% - 4px); align-items: center; justify-content: center; background-color: #f5f5f5;}



/* pokoje */ 
#roomsFrame {width: 100%; float: left; padding: 0;}
#roomsFrame .room { width: 100%; min-height: 200px; float: left; padding-bottom: 25px; margin: 0 0 30px 0; border-bottom: 1px #b1b1b1 dashed; color: #747474; }
#roomsFrame .room .price.active {background-color: #0a4d92; color: #fff; border-color: #fff;}
#roomsFrame .room h2 {margin: 0; padding: 0;}
#roomsFrame .room:first-child { padding-top: 25px; border-top: 1px #b1b1b1 dashed; }
#roomsFrame .room:last-child { margin-bottom: 0; }
#roomsFrame .room .left { width: calc(100% - 390px); float: left; display: flex; }
#roomsFrame .room .left .image { width: 200px; position: relative; margin-right: 20px; }
#roomsFrame .room .left .text {}
#roomsFrame .room .left .text .head {margin: 0 0 20px 0; align-items: center;}
#roomsFrame .room .left .text .head .braces {margin-left: 5px;}
#roomsFrame .room .left .text .description {margin: 0 0 20px 0;}
#roomsFrame .room .left .text .price {flex-direction: column; padding: 13px 22px 15px 13px; font-size: 18px; font-weight: 400; border: 1px #b1b1b1 dashed;}
#roomsFrame .room .left .text .price .select {position: relative; margin-top: 10px; font-size: 14px;}
#roomsFrame .room .left .text .price .select .label {background: url('../images/icon/arrow-down.png') right center no-repeat;}
#roomsFrame .room .left .text .price.active .select .label {background: url('../images/icon/arrow-down-white.png') right center no-repeat;}
#roomsFrame .room .left .text .price .select .label .value {margin-left: 5px; font-weight: 700;}
#roomsFrame .room .left .text .price .select .options {display: none; position: absolute; left: 0; top: 100%; z-index: 101; margin: 0; list-style: none; padding: 0; background: #f9f9f9; border: 1px #ebebeb solid;}
#roomsFrame .room .left .text .price .select .options.active {display: block;}
#roomsFrame .room .left .text .price .select .options LI { min-width: 100%; float: left; margin: 0; padding: 10px; font-size: 13px; font-weight: 500; color: #424242; border-bottom: 1px rgba(0,0,0,.05) solid; transition: background .2s; white-space: nowrap; }
#roomsFrame .room .left .text .price .select .options LI:last-child { border-bottom: 0; }
#roomsFrame .room .left .text .price .select .options LI:hover, .options LI.active { background: rgba(0,0,0,.05); }


/* služby */
#servicesFrame {width: 100%; float: left; padding: 0;}
#servicesFrame .inner {width: 100%; float: left; padding: 0;}
#servicesFrame .inner .line {padding: 20px 0; border-bottom: 1px #b1b1b1 dashed;}
#servicesFrame .inner .line.total {justify-content: space-between;}
#servicesFrame .inner .line .cena {font-size: 25px; font-weight: 500; color: #0a4d92;}
#servicesFrame .inner .line .info {text-align: right; font-size: 12px; font-weight: 300; color: #878787;}
#servicesFrame .inner .line .left .row {width: 100%; float: left; padding: 5px 0;}
#servicesFrame .inner .line .left .row .name {display: inline-block; width: 75px; text-transform: uppercase;}
#servicesFrame .inner .line .left .row .value {margin-left: 10px;}
#servicesFrame .inner .line .right {flex-direction: column; justify-content: center;}


#servicesFrame .pokojeList {width: 100%; float: left; padding: 0; margin: 20px 0 0 0;}
#servicesFrame .pokojeList .pokoj {position: relative; width: 100%; float: left; padding: 0 0 0 0; margin-bottom: 20px; border: 1px #dcdcdc solid;}
#servicesFrame .pokojeList .pokoj h3 {width: 100%; float: left; height: 55px; margin: 0; align-items: center; justify-content: center; padding: 0 10px; background: #eee; font-size: 16px; color: #424242;}
#servicesFrame .pokojeList .pokoj h3 span {margin-left: 5px; font-weight: 100; font-size: 14px;}
#servicesFrame .pokojeList .pokoj .data {width: 100%; float: left; padding: 15px 0; font-size: 14px;}
#servicesFrame .pokojeList .pokoj .data .typyHostu {width: 300px;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row {width: 100%; float: left; padding: 0 0 0 20px; margin: 4px 0;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .type {width: 200px; align-items: center;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .input {width: 40px; border: 1px #e6e6e6 dashed; justify-content: center; align-items: center;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .control {flex: 1; background: #f5f5f5;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .control a {width: 24px; height: 24px; margin: 0; padding: 5px; font-weight: 700; color: #000; justify-content: center; align-items: center;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .control a:hover {background-color: #0a4d92; color: #fff;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .control a.off {cursor: not-allowed; color: #ccc;}
#servicesFrame .pokojeList .pokoj .data .typyHostu .row .control a.off:hover {background-color: inherit; color: inherit;}
#servicesFrame .pokojeList .pokoj .data .sluzbyHostu {}
#servicesFrame .pokojeList .pokoj .pokojOverlay {position: absolute; left: 0; top: 0; width: 100%; height: 100%; font-size: 16px; color: #fff; background-color: rgba(0,0,0,0.3); align-items: center; justify-content: center;}
#servicesFrame .pokojeList .pokoj .pokojOverlay.hide {display: none;}


.buttons {width: 100%; float: left; margin-top: 30px; justify-content: space-between;}
.buttons .button { width: 300px; padding: 23px 40px; background-color: #ebebeb; background-repeat: no-repeat; font-size: 15px; font-weight: bold; text-transform: uppercase; color: #545454; }
.buttons .button.next { float: right; padding-right: 50px; background-image: url('../images/icon/arrows-right.png'); background-position: calc(100% - 40px) center; cursor: pointer; }
.button.next.fixed { position: fixed; right: 0; bottom: 20px; float: none; background-color: #0a4d92; background-image: url('../images/icon/arrows-right-white.png'); color: #fff; }
.button.next.valid { background-color: #0a4d92; background-image: url('../images/icon/arrows-right-white.png'); color: #fff; }
.button.prev { float: left; padding-right: 50px; background-image: url('../images/icon/arrows-left.png'); background-position: calc(40px) center; text-align: right; }












