HTML {height: 100%; min-height: 100%;}
BODY {font-family: arial; height: 2000px; font-size: 14px; color: #5a5a5a; background-image: url('../images/bg.gif'); background-position: top; background-repeat: repeat-x; background-color: #00a6e0; margin: 0px;}
A {color: inherit; text-decoration: none;}
P {line-height: 1.4; margin: 0px;}
INPUT, TEXTAREA, SELECT {padding: 0px; margin: 0px; border: 1px #ccc solid; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; font-family: inherit; font-size: inherit; color: inherit; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
INPUT:FOCUS, TEXTAREA:FOCUS, SELECT:FOCUS {box-shadow: inset 0 0 4px rgba(0,0,0,0.15);}
INPUT[type=submit] {cursor: pointer;}
INPUT[type=checkbox] {cursor: pointer;}
UL {list-style: none; margin: 0px; padding: 0px;}
UL LI {margin: 0px; padding: 0px;}
H2 {font-size: 24px; font-weight: 700; margin: 20px 0px 15px 0px;}
HR {width: 100%; height: 0px; margin: 10px 0px 20px 0px; float: left; border: 0px; border-bottom: 1px solid #f7f7f7;}

.box {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
.hidden {display: none;}
.line {width: 100%; float: left;}
.lineRight {width: 100%; float: right;}
.flo-r {float: right !important;}

.flexbox {display: -webkit-flex; display: -webkit-box; display: -moz-flex; display: -moz-box; display: -ms-flexbox; display: flex;}

/* LOADER */
#mainpage-loader {}
#mainpage-loader .overlay {width: 100%; height: 100%; background-color: #000; opacity: 0.5; position: fixed; z-index: 99;}
#mainpage-loader .content {width: 100%; height: 100%; position: fixed; z-index: 100; display: flex; justify-content: space-around; align-items: center; color: #FFF;}
#mainpage-loader .content I {margin: 0px 0px 10px 0px; }

/* TOP */
#topFrame {width: 100%; height: 50px; padding: 0px 10px; float: left; position: fixed; background-image: url('../images/top-bg.gif'); background-repeat: repeat-x; background-size: 100% 100%; z-index: 100;}
#topFrame .left {width: 50%; height: 100%; padding: 0px 0px 0px 60px; float: left; background-image: url('../images/simple-admin.png'); background-size: auto 30px; background-position: left center; background-repeat: no-repeat;}
#topFrame .left .links {width: auto; float: left;}
#topFrame .right {width: 50%; height: 100%; padding: 0px 0px 0px 0px; float: left;}
#topFrame .right .links {width: auto; float: right;}
#topFrame .link {width: auto; height: 30px; padding: 9px 15px; margin: 10px 0 0 0; font-size: 11px; float: left; display: block; border-left: 1px #ccc dotted;}
#topFrame .link I {font-size: 12px; margin: 0px 5px 0px 0px;}
#topFrame .submenuCont {width: auto; float: left; position: relative;}
#topFrame .submenuCont .submenu {display: none; width: 150px; float: left; position: absolute; top: 40px; right: 0px; background-color: #FFF; border: 1px #ccc solid; -webkit-box-shadow: 4px 4px 5px -4px rgba(0,0,0,0.38); -moz-box-shadow: 4px 4px 5px -4px rgba(0,0,0,0.38); box-shadow: 4px 4px 5px -4px rgba(0,0,0,0.38); border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;}
#topFrame .submenuCont .submenu A {width: 100%; float: left; padding: 8px 15px; border-bottom: 1px #f7f7f7 solid;}
#topFrame .submenuCont .submenu A:last-child {border-bottom: 0px;}
#topFrame .submenuCont .submenu A:HOVER {box-shadow: inset 0 0 4px rgba(0,0,0,0.15);}
#topFrame .submenuCont:HOVER .submenu {display: block;}
#topFrame .submenuCont:HOVER .link, #topFrame A.link:HOVER {box-shadow: inset 0 0 4px rgba(0,0,0,0.15);}

/* MAIN */
#mainFrame {width: 100%; min-height: calc(100vh - 60px); float: left; margin: 60px 0px 0px 0px;}

/* LEFT MENU */
#mainFrame #leftMenu {width: 200px; height: auto; float: left; margin: 0px 0px 0px 10px;}
#mainFrame #leftMenu .u1 {width: 100%; padding: 0px; float: left; font-size: 14px; font-weight: bold;}
#mainFrame #leftMenu .u1 LI {width: calc(100% - 10px); padding: 0px; margin: 0px 10px 0px 0px; float: left; border-bottom: 1px #d1ebf5 solid; background-color: #cbe1f2;}
#mainFrame #leftMenu .u1 LI.on {background-color: #f9fdff; width: 100%; margin: 10px 0px 10px 0px;}
#mainFrame #leftMenu .u1 LI.on:first-child {margin-top: 0px;}
#mainFrame #leftMenu .u1 LI.on .u2 {display: block;}
#mainFrame #leftMenu .u1 LI A {width: 100%; float: left; padding: 8px 15px;}
#mainFrame #leftMenu .u1 LI:HOVER A {text-decoration: underline;}
/* #mainFrame #leftMenu .u1 LI:HOVER .u2 {display: block;} */
#mainFrame #leftMenu .u1 LI .u2 LI:HOVER A {text-decoration: underline;}
#mainFrame #leftMenu .u2 {width: 100%; float: left; display: none;}
#mainFrame #leftMenu .u2 LI {width: 100%; float: left; font-size: 12px; margin: 0px; font-weight: normal; border-top: 1px #e7f6fb solid; border-bottom: 0px; background-color: #f2fafd;}
#mainFrame #leftMenu .u1 .u2 LI A {padding-left: 25px; text-decoration: none;}
#mainFrame #leftMenu .u1 .u2 LI A I {float: left; margin: 0px 5px 0px 0px; color: #8cbc32;}

/* MAIN CONTENT */
#mainFrame #contentFrame {width: calc(100% - 220px); min-height: calc(100vh - 60px); margin: 0px; float: left; background-color: #f9fdff;}
#mainFrame #contentFrame .inner {width: 100%; height: 100%; float: left; padding: 15px 30px;}
#mainFrame #contentFrame H2.pageTitle {margin: 0px; width: auto; float: left;}
#mainFrame #contentFrame H2 .small {font-size: 14px; font-weight: 300; color: #808080;}
#mainFrame #contentFrame .buttonsFrame {width: auto; float: right; padding: 2px 0px 0px 0px;}
#mainFrame #contentFrame .headerFrame {width: 100%; float: left; padding: 0px 0px 10px 0px; margin: 0px 0px 10px 0px; border-bottom: 1px #f7f7f7 solid;}

/* SEARCH */
.searchFrame {width: 100%; float: left; padding: 0px 0px 10px 0px; margin: 0px 0px 10px 0px; border-bottom: 1px #f7f7f7 solid;}
.searchFrame INPUT[type=text] {width: 200px; float: left; padding: 5px 10px; font-size: 14px; margin: 0px 10px 0px 0px;}
.searchFrame INPUT[type=submit] {width: auto; float: left; padding: 4px 10px; font-size: 14px; background-color: #8cbc32; border: 1px #80af26 solid; color: #FFF; font-weight: 700;}

/* PAGING */
.pagingFrame {width: 100%; float: left; font-size: 12px;}
.pagingFrame .leftFrame {width: 50%; float: left;}
.pagingFrame .rightFrame {width: 50%; float: left;}
.pagingFrame .rightFrame P {margin: 5px 0px 0px 0px; float: right;}
.pagingFrame .rightFrame P A {color: #0068bd; text-decoration: underline;}

/* TABLES */
.table-1 {width: 100%; float: left; margin: 15px 0px; border-collapse: collapse; font-size: 14px;}
.table-1 TH {padding: 7px 10px; border-bottom: 2px solid #7cb3dd; text-align: left; font-weight: 700; color: #7cb3dd; }
.table-1 TD {padding: 7px 10px; border-bottom: 1px solid #ececec; text-align: left;}
.table-1 TD:first-child, .table-1 TH:first-child {width: 12px;}
.table-1 TD INPUT[type=checkbox] {float: left; margin: 2px 0 0 0;}
.table-1 TR {border-left: 2px transparent solid; border-right: 2px transparent solid;}
.table-1 TR:nth-child(even) {background-color: #f7f7f7;}
.table-1 TR:HOVER {box-shadow: inset 0 0 3px rgba(0,0,0,0.1); background-color: #ffffec; border-left: 2px #8cbc32 solid; border-right: 2px #8cbc32 solid;}
.table-1 .buttonsCont {width: auto; float: right;}
.table-1 .buttonsCont a {position: relative;}
.table-1 .buttonsCont a span {position: absolute; top: -4px; right: 0; min-width: 8px; padding: 1px 2px; background-color: #d9001a; color: #fff; text-decoration: none; text-align: center; font-size: 8px; border-radius: 5px;}
.table-1 .order {width: 45px;}
.table-1 .orderCont {width: 100%; float: left; overflow: hidden; background-image: url('../images/button-1-bg.jpg'); border: 1px solid #ddd; color: #555; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; position: relative;}
.table-1 .orderCont .caretDown {position: absolute; top: 4px; right: 4px; font-size: 12px; color: #9e9e9e;}
.table-1 .order SELECT {width: calc(100% + 22px); padding: 0px 20px 0px 0px; border: 1px solid #ddd; background-color: transparent; border: 0px; cursor: pointer; text-align: right;}
.table-1 .desc {width: auto; float: left; margin: 3px 0px 0px 5px;}
.table-1 TD A {text-decoration: underline;}
.table-1 TD.marker {width: 20px;}
.table-1 TD.sort {width: 20px; text-align: center;}
.table-1 TD.sort I {font-size: 16px; cursor: pointer;}
.table-1 TD.editable INPUT {padding: 3px 5px; margin-right: 5px; float: left;}
.table-1 TD.editable .iconFrame {float: left; margin: 4px 0px 0px 0px;}
.table-1 .tip {border-bottom: 1px #ccc dotted; cursor: help;}
.table-1.size-1 {font-size: 10px;}
.table-1 TD .switch {float: left; margin: 3px 5px 0px 0px; font-size: 16px;}
.table-1 TD .fa-toggle-off {color: #adadad;}
.table-1 TD .fa-toggle-on {color: #8cbc32;}
.table-1 .font-small {font-size: 12px; color: #888;}

/* LISTS */
.list-1 {width: 100%; float: left; margin: 10px 0px 0px 0px;}
.list-1 LI {width: 100%; float: left; border-top: 1px #ddd dotted; padding: 10px 0px;}
.list-1 .li-u1 {font-weight: bold;}
.list-1 .u2 {width: 100%; float: left; padding: 0px 0px 0px 20px;}
.list-1 .u2 LI {width: 100%; float: left; border-top: 0px; padding: 3px 0px;}
.list-1 .u2 LI I {color: #8cbc32;}
.list-1 A:HOVER {text-decoration: underline;}

/* BUTTONS */
.button-1 {background-image: url('../images/button-1-bg.jpg'); border: 1px solid #ddd; color: #555; float: left; font-size: 12px; margin-left: 5px; padding: 3px 5px; width: auto; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; text-decoration: none !important;}
.button-1 I {float: left; font-size: 14px; margin: 2px 5px 0 0;}
.button-1 .text {float: left; margin: 1px 0px 0px 0px;}
.button-1:HOVER {box-shadow: inset 0 0 3px rgba(0,0,0,0.1);}
.button-1.margin-right {margin-left: 0px; margin-right: 5px;}
.button-1.right {float: right;}
.button-1.right I {float: right; font-size: 14px; margin: 2px 0 0 5px;}

.button-2 {background-image: url('../images/button-1-bg.jpg'); border: 1px solid #ddd; color: #555; float: left; font-size: 12px; margin-left: 5px; padding: 3px 5px; width: auto; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;}
.button-2 I {float: left; font-size: 14px; margin: 0;}
.button-2:HOVER {box-shadow: inset 0 0 3px rgba(0,0,0,0.1);}
.button-2.disabled {background-image: none; background-color: #f1f1f1; color: #ccc;}

/* PHOTO GALLERY */
.photosFrame {width: 100%; float: left; display: flex; margin: 0px 0px 20px 0px; flex-wrap: wrap;}
.photosFrame .photoFrame {width: auto; max-width: 200px; float: left; padding: 5px; margin: 10px 10px; border: 1px #e8e8e8 solid; border-radius: 3px; position: relative; transition: background 500ms ease-out; }
.photosFrame .imageFrame {width: 100%; height: calc(100% - 25px); float: left; display: flex; align-items: center; justify-content: space-around; clear: both;}
.photosFrame .imageFrame A {float: left; max-width: 100%; max-height: 100%;}
.photosFrame .imageFrame IMG {float: left; max-width: 100%; max-height: 100%;}
.photosFrame .descFrame {height: auto; float: left; padding: 5px 0px 5px 0px; color: #FFF; display: none; background-color: #000; opacity: 0.9; text-align: center; overflow: hidden; position: absolute; top: 0px; left: 0px; right: 0px;}
.photosFrame .descFrame P {font-size: 10px; margin: 0px 5px;}
.photosFrame .photoFrame:HOVER .descFrame {display: block;}
.photosFrame .controlsFrame {width: 100%; height: 25px; float: left; padding: 3px 0px 0px 0px;}
.photosFrame .controlsFrame .marker {width: auto; height: 22px; padding: 1px 5px 0px 5px; margin: 0px 0px 0px 0px; float: left; border-right: 1px #ccc solid; }
.photosFrame .controlsFrame INPUT[type=checkbox] {width: auto; float: left; margin: 3px 0px 0px 0px; }
.photosFrame .controlsFrame .button-2 {float: right;}
.ui-state-highlight {height: auto; width: auto; min-width: 50px; min-height: 50px; border-color: #dad55e; background-color: #fffa90;}


/* Module Kontakt - zařazeníá do skupin */
#kontaktSkupiny {}
#kontaktSkupiny .row {justify-content: space-between; align-items: center; margin: 3px 0;}
#kontaktSkupiny .row.hlavicka {padding: 6px 0; font-size: 14px; font-weight: 700; border-bottom: 1px solid #f7f7f7; margin-bottom: 10px;}
#kontaktSkupiny .row div {position: relative;}
#kontaktSkupiny .row div .insideIcon {position: absolute; top: 8px; right: 8px; font-size: 14px; color: #9e9e9e;}
#kontaktSkupiny .row .col1 {width: 10%; align-items: center;}
#kontaktSkupiny .row .col2 {width: 45%;}
#kontaktSkupiny .row .col3 {width: 45%;}


/* Text & paragraphs styles */
.textFrame P {margin: 15px 0px;}

/* POSITIONING */
.pos-right {width: auto; float: right;}

/* MARGERS */
.marger-10 {width: 100%; float: left; margin: 10px 0px;}
.marger-20 {width: 100%; float: left; margin: 20px 0px;}

/* MARGINS */
.mt-10 {margin-top: 10px;}
.mb-20 {margin-bottom: 20px;}
.ml-0 {margin-left: 0;}

/* FLOAT */
.float-r {float: right;}

/* TEXT-ALIGN */
.ta-c {text-align: center !important;}

/* COLORS */
.c-red {color: #d9001a;}
.c-green {color: #8cbc32;}
.c-gray {color: #ccc;}

/* CURSORS */
.cursor-help {cursor: help;}

/* FONT SIZE */
.fs-12 {font-size: 12px;}

/* FONT STYLE */
.fs-italic {font-style: italic;}