a,abbr,acronym,address,applet,article,aside,big,blockquote,body,caption,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,footer,form,h1,h2,h3,h4,h5,h6,header,html,iframe,img,input,ins,kbd,label,legend,li,menu,nav,object,ol,p,pre,q,s,samp,section,small,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,ul,var{margin:0;padding:0}a,img,input,textarea{outline:0}

/* obecne definice */

body {font:15px Tahoma;}

body *, body{ box-sizing: border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box}

.center {max-width:1100px; margin:0px auto; text-align:left}

select, textarea, input[type=text],input[type=date],input[type=number],input[type=datetime],input[type=file], input[type=password]{padding:10px 10px; margin:9px 0px; width:100%; border:1px solid grey; font-size:16px; display:block}

input:focus {border-color:red}

.clear {clear:both}

.left {float:left}

.w5{width:5%;display: inline-block}
.w10{width:10%;display: inline-block}
.w15{width:15%;display: inline-block}
.w20{width:20%;display: inline-block}
.w25{width:25%;display: inline-block}
.w33{width:33.3333%;display: inline-block}
.w30{width:30%;display: inline-block}
.w35{width:35%;display: inline-block}
.w40{width:40%;display: inline-block}
.w45{width:45%;display: inline-block}
.w50{width:50%;display: inline-block}
.w55{width:55%;display: inline-block}
.w60{width:60%;display: inline-block}
.w66{width:66%;display: inline-block}
.w65{width:65%;display: inline-block}
.w70{width:70%;display: inline-block}
.w72{width:72%;display: inline-block}
.w75{width:75%;display: inline-block}
.w80{width:80%;display: inline-block}
.w85{width:85%;display: inline-block}
.w90{width:90%;display: inline-block}
.w95{width:95%;display: inline-block}
.w100{width:100%;display: inline-block}

input[type=date], input[type=datetime],input[type=number],input[type=file] {width:30%}

label{display:block; margin:7px 0px; cursor:pointer; font-weight:bold}

.btn {padding:10px 20px; display:inline-block; text-align:center; min-width:150px; border:1px solid #363636; margin:9px 0px; font-size:16px; cursor:pointer; border-radius:2px; max-height:40px}

.btn.btn-grey {background:#363636; color:#767676; border:1px solid #767676}
.btn.btn-grey:hover {background:#767676; color:#363636;}    
.btn.btn-yellow {background:#f39c12; color:#fff; border:1px solid #f39c12}
.btn.btn-yellow:hover {background:#ecb700;}
.btn.btn-orange {background:#d35400; border:1px solid #d35400; color:white}
.btn.btn-orange:hover {background:#e67e22;}
.btn.btn-blue {background:#3498db; color:#fff; border:1px solid #3498db;}
.btn.btn-blue:hover {background:#2980b9;}
.btn.btn-red {background:#c0392b; color:#fff; border:1px solid #c0392b;}
.btn.btn-red:hover {background:#a83428;}
.btn.btn-green {background:#27ae60; color:#fff; border:1px solid #27ae60;}
.btn.btn-green:hover {background:#2ecc71;}
.btn.btn-white {background:#fff; color:#444; border:1px solid #fff;}
.btn.btn-white:hover {background:#444; color:white}

a:link, a:visited, a:active{color:#2980b9; text-decoration: none;}


a img{border:none;}

.text-right {text-align:right}
.text-center {text-align:center}

h1, h2, h3, h4 {font-weight:lighter;margin:20px 0px 20px 0px}

/*hlavicka*/

#header{background:#444; border-bottom:1px solid #7f8c8d; height:50px; line-height:50px; text-align:center}
#header .center .left> ul > li {display:inline-block; float:left}
#header .center .left> ul > li.submenu ul li{list-style: none !important}
#header .center .left> ul > li.submenu.active ul, #header .center .left> ul > li.active .mega-menu{display:block}
#header .center .left> ul > li.active .mega-menu{-webkit-box-shadow: 0px 0px 16px 0px rgba(50, 50, 50, 0.98);-moz-box-shadow:    0px 0px 16px 0px rgba(50, 50, 50, 0.98);box-shadow:         0px 0px 16px 0px rgba(50, 50, 50, 0.98);}
#header .center .left > ul > li > a{display:block; color:white; padding:0px 15px; min-width:100px; text-align:center; color:white; border-right:1px solid #555}
#header .center .left > ul > li > a:hover {background:#555}
#header .center .left > ul > li:last-of-type > a {border:none}
#header .center .left > ul > li > a{color:white}
#header .center .left > ul > li > ul > li > a{color:white; padding:0px 20px}
#header .center .left > ul > li > ul {display:none; z-index:9999}
#header .center .left > ul > li.bg-yellow{background:#f39c12; position:relative; border:none;}
#header .center .left > ul > li.bg-yellow a:hover {background:#f39c12;}
#header .center .left > ul > li.bg-yellow:hover ul li a:hover {background:#f1c40f}
#header .center .left > ul > li.mega{position: static}
#header .center .left > ul > li.bg-blue{background:#6262C4; position:relative; border:none}
#header .center .left > ul > li.bg-blue ul{position:absolute; list-style:none; background:#6262C4;-webkit-box-shadow: 0px 0px 16px 0px rgba(50, 50, 50, 0.98);-moz-box-shadow:    0px 0px 16px 0px rgba(50, 50, 50, 0.98);box-shadow:         0px 0px 16px 0px rgba(50, 50, 50, 0.98);}
#header .center .left > ul > li.bg-blue:hover a {background:#6262C4;}
#header .center .left > ul > li.bg-blue ul li a:hover {background:#7373c9;}
#header .center .left > ul > li.bg-blue ul li a{white-space:nowrap; display:block; width:200px; height:40px; line-height:40px; border-right:none; text-align:left}

#logout {background:#c0392b;  color:white; height:50px; display:inline-block; padding:0px 20px}
#logout:hover {background:#a83428;}

/* hlavni obsah */
#content{padding:20px; min-height:500px;padding:0px 0px 80px 0px }
#content table{width:100%;border-spacing:1px; margin:20px 0px; border:1px solid #7f8c8d}
#content table thead th{padding:10px 10px; background:#7f8c8d; color:white}
#content table tbody td{padding:10px 10px}
#content table tbody td .btn {padding:2px 5px; min-width:50px; margin:1px }
#content table tbody tr:nth-child(odd) td{background:#ecf0f1}
#content h2 {border-bottom:1px solid grey; padding-bottom:10px}

.form-horizontal {padding:15px 25px; background:#ecf0f1;border:1px solid #7f8c8d}

div.navigation a {display:inline-block; background:#3498db; padding:10px 20px; color:white; border-radius:2px; margin:10px 0px}
div.navigation a:hover {background:#2980b9}

div.navigationGreen a {display:inline-block; background:#2ade2a; padding:10px 20px; color:white; border-radius:2px; margin:10px 0px}
div.navigationGreen a:hover {background:#39bf39}

div.navigationRed a {display:inline-block; background:#ed1f0c; padding:10px 20px; color:white; border-radius:2px; margin:10px 0px}
div.navigationRed a:hover {background:#c91c0c}

dl {
    display: grid;
    grid-template-columns: max-content auto;
}

dt {
    grid-column-start: 1;
    padding: 0px 20px;
    margin: 1px 0px;
    font-weight: bold;
    height: 38px;
    line-height: 38px;
    background: #ecf0f1;
}

dd {
    grid-column-start: 2;
    width: 80%;
    padding: 0px 20px;
    margin: 1px 0px;
    float: left;
    border-top: 1px solid #ecf0f1;
    padding: 10px;
    overflow: visible;
}


/*.dl-horizontal dt, .dl-horizontal dd {
    display: flex;
    float: left;
    padding: 0px 20px;
    margin: 1px 0px;
    height: 38px;
    line-height: 38px;
    flex-wrap: wrap;
    overflow: visible;
    text-overflow: ellipsis;
}
.dl-horizontal dt {
    width: 20%;
    font-weight: bold;
    background: #ecf0f1;
    flex-flow: row;
}
.dl-horizontal dd {
    width: 80%;
}*/
.form-actions{height:100px; margin:20px 0px}
.form-actions .btn{float:left; margin-right:10px}


/* logovaci formular */

#login-form {text-align:center; margin-top:100px;}
#login-form form {border-top:5px solid #f39c12; width:500px; margin:0px auto; text-align:left; padding:30px; background: #444}
#login-form form h1 {color:white; margin:0px }

/* uspech ci neuspech*/

.action{width:500px; padding:50px; margin:0px auto; border-radius:2px}
.action.action-fail {background:#c0392b; color:white}
.action.action-success {background:#27ae60; color:white}

/* chyby */

.field-validation-error{ color:#ff2929;}
.validation-summary-errors ul{margin:0px}
.validation-summary-errors li{list-style-type:none;color:#ff2929;}
input.input-validation-error{background:#ffdfdf;}
textarea.input-validation-error { border-color: red;}

/* paticka */

#footer {height:40px; background:white; line-height:40px; text-align:center;  width:100%; text-align:right; position:fixed; bottom:0px; border-top:1px solid #dbdbdb}

.symbol { font-size: 0.9em;font-family: Times New Roman;border-radius: 1em;padding: .1em .6em .1em .6em;font-weight: bolder;color: white;background-color: #4E5A56;}

.icon-info { background-color: #3229CF; }
.icon-error { background: #e64943; font-family: Consolas; }
.icon-tick { background: #13c823; }
.icon-excl { background: #ffd54b; color: black; }

.icon-info:before { content: 'i'; }
.icon-error:before { content: 'x'; }
.icon-tick:before { content: '\002713'; }
.icon-excl:before { content: '!'; }

.notify {background-color:#e3f7fc; color:#555; border:.1em solid;border-color: #8ed9f6;border-radius:10px;font-family:Tahoma,Geneva,Arial,sans-serif;font-size:1.1em;padding:10px 10px 10px 10px;margin:10px; cursor: default;}
.notify-yellow { background: #fff8c4; border-color: #f7deae; }
.notify-red { background: #ffecec; border-color: #fad9d7; }
.notify-green { background: #e9ffd9; border-color: #D1FAB6; }

.mega-menu{margin-top: 0px; width:1100px; display: none; position: absolute; background: #f39c12; padding:10px 20px 20px 20px; z-index: 20}
.mega-menu h4{margin:0px; font-weight: 800}
.mega-menu > div{float:left; border-left: 1px solid rgba(255,255,255,0.4);padding:0px 20px;min-height: 260px}
.mega-menu > div:first-child{border:none; }
.mega-menu > div.clear{border:none; min-height: 0px}
.mega-menu > div ul li{display: block; width:100%; float: none}
.mega-menu > div ul li a{border:none; color: white; line-height: 30px; height:30px; width:100%; display:block; padding:0px 10px}

.show-mobile{display:none;}

@media screen and (max-width:1100px){

    .show-mobile{display:block; color:white;  padding: 0px 20px; cursor: pointer;  text-transform: uppercase; background: #6262C4; width: 50%}
    #header .w10 a{width: 50%; position: absolute; top:0; right:0}
    #content{padding: 0px 20px}
    #header .w90 > ul{display:none; background: #444}    
    #header .w90 > ul a{text-align: left !important}
    #header .w90{width: 100%}
    .mega-menu{width:100%}
    .mega-menu .w25{width:50%; min-height: 2px; border: none}
    .mega-menu .w25 ul li{width:100% !important;  }
    #header .w90 > ul > li{ width:50%;  border-bottom:1px solid #555 }
    #header .center .left > ul > li.bg-blue ul li a{width:50%}
    .table-responsive{overflow-x: scroll; border:1px solid grey; margin:0px 0px; width: 100%}
    .table-responsive table{table-layout:fixed; margin:0px !important; width: auto}
    .table-responsive table td,.table-responsive table th{white-space: nowrap !important; text-wrap:  none}
    #header .center .left> ul > li.submenu.active ul, #header .center .left> ul > li.active .mega-menu{width: 100%}
    #header .center .left > ul > li.bg-blue ul li a{width:100%}

}

@media screen and (max-width:600px){
    #header .w90 ul li{ width:100%; line-height: 35px; height:35px}
    .mega-menu .w25 ul li{width:100% !important; height: 35px; line-height: 35px}
    input[type]{width:100%}
    #header .center .left > ul > li.bg-blue ul li{width:100%}

}
