body{
    margin: 0;
    padding: 0;
    font-family: 'Ubuntu', sans-serif;
}

a{
    color: #444444;
    text-decoration: none;
}

a:hover{
    color: #000000;
    text-decoration: underline;
}

.mob-menu{
    display: none;
}

.top{
    top: 50px;
    left: 0%;
    width: 100%;
    position: fixed;
    background: #F2F1F0;
    outline: 1px solid #ccc;
    z-index: 1000;
}

.top a{
    color: #333;
    text-decoration: none;
}

.top a:hover{
    color: #000;
}

.top .item{
    padding-left: 20px;
    padding-right: 20px;
    height: 25px;
    padding-top: 10px;
    padding-bottom: 5px;
    display: inline-block;
    z-index: 9;
}
.top .item:hover{
    background: #F8F7F6;
}

.label{
    color: #1E6EBB;
    font-size: 18pt;
    position: fixed;
    padding-top: 15px;
    padding-left: 1%;
    z-index: 99;
    background: #fff;
    width: 100%;
    height: 36px;
    background: -moz-linear-gradient(left, #ffffff 0%, #f6f6f6 23%, #000000 56%, #000000 100%);
}

.logo{
    color: #fff;
    font-weight: bold;
    font-size: 18pt;
    position: fixed;
    top: 0px;
    right: 200px;
    z-index: 0;
    height: 50px;
}
.logo2 {
left: 140px;
position: absolute;
z-index: 100;
width: 151px;
}
.logo img{
    height: 100%;
}

.logout{
    font-size: 10pt;
    position: fixed;
    top: 17px;
    right: 2px;
    z-index: 99;
}
.logout a {
    color: #fff;
    text-decoration: none;
}
.logout a:hover{
    color: #000;
}

.left a{
    color: #666;
    text-decoration: none;
}

.left a:hover{
    color: #000000;
    text-decoration: none;
}

table{
    border-collapse: collapse;
}

td{
    font-size: 9pt;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top: 1px solid #eeeeee;
}

h1{
    font-size: 14pt;
}

.left{
    background-color:rgba(255,255,255,1);
    width: 100%;
    top:90px;
    position:fixed;
    z-index:0;
    height: 205px;
    overflow: hidden;
}

.leftside{
    top: 90px;
    left: 0%;
    width: 20%;
    position: fixed;
    z-index:-1;
    height: calc(100% - 75px);
    overflow: auto;
}

.leftitem{
    font-size: 10pt;
    padding: 5px;
}

.leftitem:hover{
    color: #222;
}

.main{
    padding-top:95px;
    z-index: -1;
    width: 100%;
    top: 90px;
    left: 0%;
    position: absolute;
    background: rgba(255,255,255,0.8);
}

.mainside{
    z-index: -1;
    width: 70%;
    top: 90px;
    left: 20%;
    position: absolute;
    background: rgba(255,255,255,0.8);
}

.status{
    text-align: left;
    width: 100%;
    height: 15px;
    background: #eeeeee;
    position: fixed;
    left: 0px;
    bottom: 0px;
    z-index: 999;
    background: #EFEFEF;
    padding: 5px;
    border-top: 1px solid #CCCCCC;
}

@media (max-width: 500px) {
    .top{
        position: static;
    }
    .left{
        position: static;
        width: 100%;
        border-bottom: 3px solid #ccc;
        background: #eee;
    }
    .main{
        position: static;
        width: 100%;
    }
    .menu{
        position: static;
    }
    body{
        z-index: -2;
    }
    .label{
        position: absolute;
    }
}
table{
    padding: 2%;
    margin: 2%;
    font-family: helvetica;
    font-size: 9pt;
    border-collapse: collapse;
    vertical-align: top;
}

table td{
    margin: 0px;
    padding: 5px;
    border: 1px solid #dddddd;
}

table tr:nth-child(even){
    background: #eeeeee;
}

table big{
    font-size: 15pt;
}

table thead th{
    background: #cccccc;
    background: linear-gradient(#bbbbbb, #cccccc);
    *background: #cccccc;
    padding: 10px;
}

table tfoot td:nth-child(odd){
    background: #C1CD20;
    text-align: right;
    color: #000000;
}

table tfoot td:nth-child(even){
    background: #909917;
    color: #ffffff;
    font-weight: bold;
}

/* AWESOME */
span.fa.fa-fw{
    font-size: 1.5em;
    color: #555;
}
span.fa:hover{
    color: black;
    cursor: pointer;
}

.wait{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ffffff;
}
#napoveda{
    height: 0px;
}

.bubble {
    position: relative;
    width: 300px;
    padding: 5px;
    background: #EFEFEF;
    border: #aaaaaa solid 1px;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(97, 97, 97, 0.2);
    -moz-box-shadow: 0px 2px 5px 0px rgba(97, 97, 97, 0.2);
    box-shadow: 0px 2px 5px 0px rgba(97, 97, 97, 0.2);
}

.bubble:after {
    content: "";
    position: absolute;
    top: -10px;
    left: 12px;
    border-style: solid;
    border-width: 0 10px 10px;
    border-color: #EFEFEF transparent;
    display: block;
    width: 0;
    z-index: 1;
}

.bubble:before {
    content: "";
    position: absolute;
    top: -11px;
    left: 12px;
    border-style: solid;
    border-width: 0 10px 10px;
    border-color: #aaaaaa transparent;
    display: block;
    width: 0;
    z-index: 0;
}

.helpbubble{
    position: relative;
    width: 400px;
    min-height: 50px;
    padding: 10px;
    background: #FFEFBD;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-size: 10pt;
    color: #333333;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(97, 97, 97, 0.2);
    -moz-box-shadow: 0px 2px 5px 0px rgba(97, 97, 97, 0.2);
    box-shadow: 0px 2px 5px 0px rgba(97, 97, 97, 0.2);
}

.helpbubble:after {
    content: "";
    position: absolute;
    top: 20px;
    left: -20px;
    border-style: solid;
    border-width: 15px 20px 15px 0;
    border-color: transparent #FFEFBD;
    display: block;
    width: 0;
    z-index: 1;
}

input.invisible{
    padding: 5px;
    border: 0px none;
    background: transparent none repeat scroll 0% 0%;
}

/*mobil nebo tablet*/
@media (max-width:800px){
    .mob-menu{
        display: inline-block;
        cursor: pointer;
        padding: 10px;
        color: #333;
    }

    .label{
        position: static;
        padding: 0px;
        height: 50px;
    }
    .top{
        display: none;
        position: static;
    }
    .top a{
        display: block;
    }
    .left{
        position: static;
        width: 100%;
    }
    .main{
        position: static;
        width: 100%;
    }
}

.access_error {
	color:red;
}


/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display:    none;
    position:   fixed;
    z-index:    10000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('loading.gif') 
                50% 50% 
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}