HTML, BODY {height: 100%;}
BODY {font-family: 'Open Sans', sans-serif; font-size: 13px; margin: 0px; padding: 0px; color: #555;}
A {color: inherit; text-decoration: none;}
UL {list-style: none; margin: 0px; padding: 0px;}
INPUT {font-family: 'Open Sans', sans-serif;}
TEXTAREA {font-family: 'Open Sans', sans-serif; font-size: 13px;}
BUTTON {font-family: 'Open Sans', sans-serif;}
INPUT:FOCUS {border-color: #3c9d3c !important;}
INPUT:REQUIRED:FOCUS {border-color: #e95847 !important;}

.box {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.flex {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
.flex.space-around {justify-content: space-around;}
.flex.space-between {justify-content: space-between;}
.flex.flex-start {align-items: flex-start;}
.flex.direction-row {flex-direction: row;}
.hidden {display: none !important;}
.hidden2 {display: none;}


h2.poradi {align-items: center; justify-content: space-between;}


/* login */
#loginCont {width: 100%; height: 100%; float: left; position: relative;}
#loginCont .loginFrame {width: 400px; height: auto; padding: 0px 0px 0px 0px; float: left; position: absolute; left: calc(50% - 200px); top: calc(20%); z-index: 100; box-shadow: 0px 0px 20px 5px #555; overflow: hidden;}
#loginCont .loginFrame H1 {width: 100%; float: left; margin: 0px 0px 0px 0px; font-weight: 600; text-align: center; color: #515151;}
#loginCont .loginFrame .appName {width: 100%; float: left; font-size: 14px; margin: 0px; padding: 15px 20px 15px 20px; line-height: 12px; border-bottom: 1px #3c9d3c solid; background-color: #5db85c; color: #FFF;}
#loginCont .loginFrame .appName .version {font-weight: 200; font-size: 11px;}
#loginCont .loginFrame IMG {width: 100%; float: left;}
#loginCont .loginFrame .inner {width: 100%; float: left; padding: 10px 20px 20px 20px; background-color: #FFF;}
#loginCont .loginFrame .inner INPUT[type=text], #loginCont .loginFrame .inner INPUT[type=password] {width: 100%; float: left; padding: 8px 10px; margin: 5px 0px; border: 1px #ddd solid;}
#loginCont .loginFrame .inner INPUT[type=submit] {width: 100%; float: left; padding: 8px 10px; margin: 5px 0px; border: 1px #3c9d3c solid; background-color: #5db85c; color: #FFF; cursor: pointer; }
#loginCont .loginFrame .inner INPUT[type=submit]:HOVER {background-color: #3c9d3c;}
#loginCont .loginFrame .inner SELECT {width: 100%; float: left; padding: 8px 10px; margin: 5px 0px; border: 1px #ddd solid;}

/* main left panel */
#mainLeftFrame {width: 220px; height: auto; margin-top: 70px; float: left; padding: 0px 0px 0px 0px; margin-left: 20px; font-size: 15px; background-color: #FFF;}
#mainLeftFrame .borderCont {width: 220px; height: auto; float: left; border: 1px solid #ececec;}
#mainLeftFrame H1 {width: 100%; height: auto; float: left; font-size: 20px; font-weight: 600; text-align: center; padding: 0px 0px 10px 0px; margin: 0px;}
#mainLeftFrame .u1 {float: left; width: 100%; border-top: 1px #ececec solid;}
#mainLeftFrame .u1 LI {width: 100%; height: auto; float: left; border-bottom: 1px #ececec solid;}
#mainLeftFrame .u1 LI:HOVER {color: #000;}
#mainLeftFrame .u1 LI:last-child {border-bottom: 0px;}
#mainLeftFrame .u1 A {padding: 10px 15px; float: left; display: block; width: 100%; }
#mainLeftFrame .u2 {float: left; width: 100%; background-color: #eee; color: #555; padding: 0px 0px; font-size: 14px;}
#mainLeftFrame .u2 LI {border: 0px; border-bottom: 1px #ddd solid;}
#mainLeftFrame .u2 LI:last-child {border-bottom: 0px;}
#mainLeftFrame .u2 LI:HOVER {color: #000;}
#mainLeftFrame .u2 A {padding: 7px 15px;}
#mainLeftFrame A .circle {min-width: 15px; text-align: center; background-color: #e95847; color: #ebebeb; border-radius: 50%; padding: 3px; font-size: 10px; float: right;}
#mainLeftFrame A I {font-size: 14px; margin: 0px 10px 0px 0px;}
#mainLeftFrame A I.arrow {float: right; margin: 5px 0px 0px 0px; font-size: 10px;}
#mainLeftFrame .mainLogo {width: 100%; height: auto;}
#mainLeftFrame .waitingLongCnt {width: 100%; height: auto; padding: 8px 10px; float: left; background-color: #e95847; color: #FFF; margin: 0px 0px 0px 0px; font-size: 12px;}
#mainLeftFrame .waitingLongCnt P {float: left; margin: 0px;}
#mainLeftFrame .waitingLongCnt I {float: left; font-size: 16px; margin: 0px 5px 10px 0px;}
#mainLeftFrame .errorFrame {width: 100%; padding: 0px 0px; margin: 10px 0px 0px 0px; float: left; color: #FFF; font-size: 12px;}
#mainLeftFrame .errorFrame .item {width: 100%; float: left; padding: 10px 15px; margin: 0px; border: 1px transparent solid; border-bottom: 0px;}
#mainLeftFrame .errorFrame .item:last-child {border-bottom: 0px;}
#mainLeftFrame .errorFrame .item.red {background-color: #e95847; border-color: #d4402f;}
#mainLeftFrame .errorFrame .item.red:HOVER {background-color: #d4402f;}
#mainLeftFrame .errorFrame .item.orange {background-color: orange; border-color: #ea9700;}
#mainLeftFrame .errorFrame .item.orange:HOVER {background-color: #ea9700;}
#mainLeftFrame .errorFrame I {width: 12px; float: left; margin: 1px 10px 0px 0px;}
#mainLeftFrame .errorFrame .text {width: 165px; float: left;}

/* avatar */
.avatarFrame {width: 100%; padding: 15px 15px 10px 15px; float: left;}
.avatarFrame IMG {width: 100%; float: left; border-radius: 20%; border: 3px #ececec solid;}
.avatarFrameLogin {width: 100%; padding: 15px; float: left; background-color: #eee; border-bottom: 1px #ccc solid;}
.avatarFrameLogin IMG {width: 100%; float: left; border-radius: 50%; border: 3px #ccc solid;}
.avatarFrameLogin .centerer {width: 100%; float: left; padding: 20px 20%;}

/* main right panel */
#mainRightFrame {width: auto; height: 100%; margin: 0px 0px 0px 240px;}
#mainRightFrame.full {width: 100%; margin: 0px;}

/* main top panel */
#mainTopFrame {width: 100%; height: 50px; float: left; position: relative; position: fixed; z-index: 80; background-image: url('../images/top-menu-bg.jpg'); background-repeat: repeat-x;}
#mainTopFrame .appName {width: auto; float: left; font-size: 14px; margin: 12px 0px 0px 20px; line-height: 12px; }
#mainTopFrame .appName .version {font-weight: 200; font-size: 11px;}
#mainTopFrame .controls {float: right; width: auto; height: 50px; padding: 15px 20px 0px 0px; position: relative; margin: 0px 0px 0px 0px; border-left: 0px #cecece solid;}
#mainTopFrame .controls I {font-size: 20px; margin: 0px 10px 0px 0px; padding: 0px 0px 0px 10px; float: left; border-left: 1px solid #cecece;}
#mainTopFrame .controls:HOVER {background-color: #f7f7f7;}
#mainTopFrame .controlsDhtml {width: 100%; float: left; position: absolute; top: 50px; right: 0px; display: none; background-color: #f7f7f7; z-index: 100;}
#mainTopFrame .controlsDhtml .line {border-top: 1px #cecece solid; padding: 8px 10px; margin: 0px;}
#mainTopFrame .controlsDhtml .line:HOVER {background-color: #ececec;}
#mainTopFrame .controlsDhtml .line I {font-size: 16px; margin: 2px 5px 0px 0px; float: left;}
#mainTopFrame #appStatus A:HOVER {text-decoration: underline;}
#mainTopFrame #appStatus {width: auto; float: left; padding: 15px 0px 0px 0px;}
#mainTopFrame #appStatus P {margin: 0px 0px 0px 10px; float: left; border-left: 1px #cecece solid; padding: 0px 0px 0px 10px;}
#mainTopFrame #appStatus .circle {min-width: 15px; text-align: center; background-color: #e95847; color: #ebebeb; border-radius: 50%; padding: 3px; font-size: 10px; float: left; margin: 0px 5px 0px 0px; font-weight: 900;}

/* main content frame */
#mainContentFrame {width: 100%; float: left; padding: 20px; margin: 35px 0px 0px 0px;}

/* navigation */
#navigFrame {width: 100%; float: left; padding: 7px 20px; /*background-color: #0b8aa1; color: #FFF;*/ background-color: #eee; border-bottom: 1px solid #ddd;}
#navigFrame P {font-size: 12px; margin: 0px;}
#navigFrame P A:HOVER {text-decoration: underline;}
#navigFrame .sepr {color: #ccc;}

.fullHeight {min-height: 100%; height: 100%; display: flex; flex-direction: column;}

/* fotogalerie */
.photoGallery {width: 100%; float: left;}
.photoGallery .photo {width: 24%; float: left; margin: 0 1% 1% 0;}
.photoGallery A IMG {width: 100%; float: left; cursor: move;}

/* google map */
#fullMapFrame {width: 100%; height: 500px;}

/* ceník */
#pricesFrame {width: 100%; float: left;}
#pricesFrame .row {width: 100%; float: left;}
#pricesFrame .b-t {outline-top: 1px #ddd solid;}
#pricesFrame .b-b {outline-bottom: 1px #ddd solid;}
#pricesFrame .b-l {border-left: 1px #ddd solid;}
#pricesFrame .b-r {border-right: 1px #ddd solid;}
#pricesFrame .cell {width: 100%; height: 30px; float: left; padding: 5px 10px; float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
#pricesFrame .head {background-color: #f9f492; font-size: 12px; font-weight: 600; padding: 0px 10px 0px 10px;}
#pricesFrame .head .date {margin: 5px 0px 0px 0px; float: left;}
#pricesFrame .roomtype {width: 250px; float: left;}
#pricesFrame .roomtype .roomtypeName {width: 160px; float: left;}
#pricesFrame .roomtype .roomtypePersons {width: 70px; float: left; font-size: 12px; text-align: right;}
#pricesFrame .roomtype .foodtypeName {width: 100px; float: left;}
#pricesFrame .roomtype .foodtypePersons {width: /*130px*/100%; float: left; font-size: 12px; text-align: right;}
#pricesFrame .seasonsFrame {width: auto; height: 100%; margin: 0px 0px 0px 250px; overflow-x: scroll;}
#pricesFrame .season {min-width: 155px; max-width: 250px;}
#pricesFrame .season INPUT {width: 45px; float: left; text-align: right; font-size: 11px; cursor: help; position: relative; border: 1px #999 solid;}
#pricesFrame .season INPUT.discount {background-color: #ffc7cd;}
#pricesFrame .season .currency {float: left; font-size: 11px; margin: 2px 10px 0px 3px; color: #909090;}
#pricesFrame .season .closedroomsIcon {float: left; margin: 0px 10px 0px 3px; vertical-align: top; color: #d9001a;}
#pricesFrame .season.active {background-color: #f9f492;}
#pricesFrame .season.empty {background-color: #ffe7e9; background-image: url('../images/empty.png'); background-position: left top; background-repeat: repeat;}
#pricesFrame .grayLine {background-color: #f3f4f5; background-color: #eee;}
#pricesFrame .grayLine.active {background-color: #e8e271 !important;}
#pricesFrame .grayLine.empty {background-color: #ffdee0 !important;}
#pricesFrame .foodtype {background-color: #e1faff;}
#pricesFrame .foodtype {background-color: #e1faff;}
#pricesFrame .foodtype.grayLine {background-color: #bce6ee;}
#pricesFrame .foodtype .grayLine {background-color: #bce6ee;}
#pricesFrame .fa-toggle-off {font-size: 18px;}
#pricesFrame .fa-toggle-on {font-size: 18px; color: #5db85c;}

/* tip frame */
.tipFrame {width: 100%; float: left; padding: 8px 15px; margin: 15px 0px 20px 0px; background-color: #e95847; border: 2px solid #d54130; color: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}
.tipFrame I.main {font-size: 14px; float: left; margin: 2px 10px 0px 0px;}
.tipFrame P {width: 100%; float: left; margin: 0px 0px 0px 0px;}
.tipFrame P A:HOVER {text-decoration: underline;} 

.button-s {float: right; padding: 0px 2px; margin: 5px 0px 0px 3px; border: 1px #ccc solid; background-color: #f3f4f5; border-radius: 2px; font-size: 12px; font-weight: 600;}