/* HTML Tagy */
BODY {margin: 0px; font-family: 'Roboto', sans-serif; color: #6c757d; font-size: 15px; }
A {color: inherit; text-decoration: none;}
P {line-height: 1.4; margin: 0px;}
HR {width: 100%; height: 1px; border: 0px; margin: 20px 0px; float: left; background-color: #e8e8e8;}



/* Obecná styly */
.box {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.hidden {display: none;}
.line {width: 100%; float: left; display: flex;}
.line.spaceBetween {justify-content: space-between;}
.mainFrame {width: 1200px; margin: 0px auto;}
.flexbox {display: -webkit-flex; display: -webkit-box; display: -moz-flex; display: -moz-box; display: -ms-flexbox; display: flex;}

.material-symbols-outlined {display: block !important;}


/* Nadpisy */
.headingBgGray {width: 100%; min-height: 38px; float: left; background-color: #ccc; color: #FFF; font-weight: 500; display: flex; align-items: center; padding: 0px 20px; margin: 30px 0px 10px 0px;}
.headingBgGray2 {width: 100%; min-height: 30px; float: left; background-color: #f7f7f7; color: #404040; font-weight: 500; display: flex; align-items: center; justify-content: center; padding: 0px 20px; margin: 30px 0px 10px 0px;}
.headingBgBlue {width: 100%; min-height: 38px; float: left; background-color: #30c08b; color: #FFF; font-weight: 500; display: flex; align-items: center; padding: 0px 20px; margin: 30px 0px 10px 0px;}
.headingBgDarkGray {width: 100%; min-height: 38px; float: left; background-color: #666; color: #FFF; font-weight: 500; display: flex; align-items: center; padding: 0px 20px; margin: 30px 0px 10px 0px;}


/* Tlačítka */
.button-1 {position: relative; display: flex; align-items: center; padding: 3px 5px; margin: 0px 0px 0px 5px; font-size: 13px; font-weight: 300; color: #555; border: 1px #ddd solid; border-radius: 2px; background-image: linear-gradient(#FFF, #f6f6f6);}
.button-1 I {font-size: 13px; margin: 0px 5px 0px 0px;}
.button-1:HOVER {background-image: linear-gradient(#f7f7f7, #fff);}
.button-1.disabled {background-color: #ececec; background-image: none;}
.button-1.disabled:HOVER {background-image: none;}
.button-1.size-s {font-size: 12px;}
.button-1.size-s I {font-size: 12px;}
.button-1.w-auto {display: inline;}

.button-1.left {margin-left: 0;}
.button-1.size-m {padding: 8px 15px; font-size: 15px; font-weight: 500;}
.button-1.size-m I {font-size: 18px; margin: 0px 10px 0px 0px;}

.button-1.small {width: auto; display: inline-block; font-size: 10px;}
.button-1.small I {font-size: 10px; margin: 0;}

.button-1 .pocet {position: absolute; right: -5px; top: -7px; width: 15px; height: 15px; background-color: #30c08b; color: #fff; border-radius: 50%; text-align: center; font-size: 10px; opacity: 1; display: flex; justify-content: center; align-items: center;}


/* Kontejner na tlačítka */
.buttonsContLeft {width: 100%; float: left; display: flex; justify-content: flex-start;}
.buttonsContRight {width: 100%; float: left; display: flex; justify-content: flex-end;}
.buttonsContDown {width: 100%; float: left; display: flex; flex-direction: column; align-items: flex-start;}
.buttonsContDown a {margin-bottom: 10px;}


/* Tabulky */
.table-1 {width: 100%; float: left; margin: 15px 0px; border-collapse: collapse; font-size: 15px;}
.table-1 TH {padding: 7px 10px; border-bottom: 2px solid #000000; text-align: left; font-weight: 600; color: #000000; }
.table-1 TD {padding: 7px 10px; border-bottom: 1px solid #ececec; font-weight: 400;}
.table-1 TD.id {width: 50px;}
.table-1 TD.photo {width: 50px;}
.table-1 TD.photo IMG {width: 50px; float: left;}
.table-1 TR {border-left: 2px transparent solid; border-right: 2px transparent solid;}
.table-1 TR.off {opacity: 0.3;}
.table-1 TR.clickable {cursor: pointer;}
.table-1 TR:nth-child(odd) {background-color: #fff;}
.table-1 TR:nth-child(even) {background-color: #f7f7f7;}
.table-1 TR TD.tdControls {width: 1%; white-space: nowrap;}
.table-1 TR TD.tdControls .controls {display: flex;}
.table-1 TR TH.tdControls {width: 1%; white-space: nowrap;}
.table-1 TR TH.tdControls .controls {display: flex;}
.table-1 TR.sum TD {font-weight: 600; color: #008259;}
.table-1 .tdChecker {width: 20px;}
.table-1 .fontSmall {font-size: 12px; color: #B6B6B6; font-weight: 300;}
.table-1 .centerer {width: auto; white-space: nowrap; display: flex; justify-content: flex-start; align-items: center;}
.table-1 .tdId {width: 40px;}
.table-1 .tdPhoto {width: 50px;}
.table-1 .tdPhoto IMG {width: 100%; height: auto;}  



/* Označené záznamy v tabulce */
.selectedFrame {width: 100%; padding: 5px 10px; float: left; display: flex; align-items: center; justify-content: space-between; font-size: 13px; background-color: #f7f7f7; border: 1px solid #ececec; border-radius: 4px;}
.selectedFrame.alone {justify-content: flex-start;}
.selectedFrame .left {display: flex; align-items: center;}
.selectedFrame .right {display: flex; align-items: center;}


/* Filtr tabulky */
.filterFrame {width: 100%; padding: 5px 20px; float: left; display: flex; align-items: center; flex-wrap: wrap; font-size: 13px; background-color: #eeeeee; border: 1px #f7f7f7 solid; border-radius: 4px;}
.filterFrame .filterLine {width: 100%; float: left; display: flex; justify-content: space-between;}
.filterFrame .filterLine .cell {margin: 0px 10px; flex-grow: 1; flex: 1;}
.filterFrame .filterLine .cell:first-child {margin-left: 0px;}
.filterFrame .filterLine .cell:last-child {margin-right: 0px;}



/* Barevné rozlišení záznamů - kolečka */
.circle-1 {width: 12px; height: 12px; margin-right: 10px; display: block; border-radius: 50%; background-color: #ccc;}



/* Barevné rozlišení záznamů - rámečky */
.color-frame-1 {width: auto; height: auto; padding: 3px 5px; float: left; display: block; border-radius: 2px; background-color: #ccc; font-size: 11px; color: #FFF;}
.color-frame-1.active {background-color: #228B22;}
.color-frame-1.error {background-color: #ff0000;}



/* Barevné rozlišení textových hlášek - chyb */
.font-color-frame-1 {width: auto; height: auto; font-size: 13px; color: #ccc;}
.font-color-frame-1.error {color: #ff0000;}



/* Cursor */
.cursorPointer {cursor: pointer;}
.cursorNotAllowed {cursor: not-allowed;}



/* Margin */
.mt-22 {margin-top: 22px !important;}
.mt-0 {margin-top: 0 !important;}



/* Overlay */
#loaderOverlay {width: 100%; height: 100%; float: left; background-color: rgba(0,0,0,0.3); position: fixed; top: 0px; left: 0px; display: none; z-index: 1000;}
#loaderOverlay .inner {width: 100%; height: 100%; float: left; display: flex; justify-content: space-around; align-items: center;}
#loaderOverlay P {color: #FFF; font-size: 18px !important; font-weight: 500;}



/* Absolutně napozicované zprávy z AJAXu */
#ajaxContentMessages {width: auto; height: auto; position: fixed; right: 0px; bottom: 0px; padding: 20px 20px 20px 20px; z-index: 100;}
#ajaxContentMessages .infoPanel {width: auto; box-shadow: 0px 0px 10px 6px rgba(0,0,0,0.15); margin: 0px;}



/* Font weight */
.f-bold {font-weight: 700 !important;}


/* Font Color */
.c-gray {color: gray;}
.c-red {color: #e95847;}
.c-green {color: green;}
.c-green-damarus {color: #008259;}


/* Text align */
.ta-center {text-align: center !important;}


/* Cursor */
.cursor-pointer {cursor: pointer;}
.cursor-help {cursor: help;}



/* Border */
.noBorder {border: 0 !important;}



/* Height */
.heightAuto {height: auto !important;}