body {position: relative;}

.template-download, .template-upload {text-align:center; background-color:rgba(200,200,200,0.5); padding:5px; position:relative; display:inline-block; float:left; margin:10px;}
.template-download button, .template-upload button {margin-top:1%;}
.images .template-download .name, .images .template-upload .name{position:absolute; z-index:5; background-color:rgba(200,200,200,1); display:none; top:0px; min-width:100%; left:0px;}
.images .template-download:hover .name, .images .template-upload:hover .name{display:block;}

.panel-heading {position: relative;}
.panel-heading .heading-filter {position: absolute; top: 3px; right: 3px; width: 250px;}
.low_padding {padding:3px !important;}
#add_button {cursor:pointer;}

.custom-input-group-2-first, .custom-input-group-2-last {width:49%; float:left; }
.custom-input-group-2-first > label, .custom-input-group-2-last > label {font-weight:normal;}
.custom-input-group-2-first {margin-right:1%;}
.custom-input-group-2-last {margin-left:1%;}

.center_form {max-width: 350px; padding: 15px; margin: 0 auto;}

.ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text {padding-left:0.5em;}

#statements .statement-placeholder {height:100px; background-color:rgba(0,0,0,0.05); box-shadow:inset 0px 0px 1px 1px rgba(0,0,200,0.3)!important;}
.ui-sortable-helper {background-color:white; box-shadow:inset 0px 0px 1px 1px rgba(0,0,200,0.3)!important;}
#statements .statement {box-shadow:inset 0px 0px 1px 1px rgba(0,0,0,0.2); padding-top:10px; margin:5px 0px; position: relative;}

#elements_container {position:relative;}
#input_group_elements {width:250px; position:absolute; top:3px; right:3px;}
#add_selected_button {cursor:pointer;}
#accordion_elements {min-width:280px; width:auto; position:absolute; top:0px; right:0px; background-color:white;}
.ui-draggable-handle {position:relative; cursor:move;}
#elements_sh {border:1px solid #ccc; padding:9px; position:absolute; top:3px; right:3px; border-radius:3px; cursor:pointer;}
#elements_all {border:1px solid #ccc; padding:9px; position:absolute; top:3px; right:40px; border-radius:3px; cursor:pointer;}
#elements_sites {border:1px solid #ccc; padding:9px; position:absolute; top:3px; right:77px; border-radius:3px; cursor:pointer;}


.page {background-size:contain; box-shadow:0px 0px 1px 1px #000; position:relative; overflow:hidden;}

.element_outer {position: relative;}
.element_outer > .element_item {display:none;}
.element_outer > .element_name {padding: 5px; border: 1px solid #ccc; border-radius: 3px; position:relative; padding-right:70px;}
#element_list .element-placeholder {height:30px; background-color:rgba(0,0,0,0.05); box-shadow:inset 0px 0px 1px 1px rgba(0,0,200,0.3)!important; }
#element_list .ui-sortable-helper, #element_list .ui-sortable-helper .ui-sortable-handle {padding-left:0px !important;}
#edit_element {width:500px; background-color:white; height:auto; position:absolute; right:285px; top:0px; z-index:50; display: none;}
#edit_element .btn {margin:10px 20px;}

#elem_buttons {position: absolute; top: 0px; right: 0px;}
#elem_buttons #del_button, #elem_buttons #dup_button, #elem_buttons #fold_button_if, #elem_buttons #fold_button_layer {padding: 4px 8px;}

.preview_elem {position:absolute; display:inline-block;}

#element_list > .type_if {color:blue; }
#element_list > .type_elseif {color:royalblue;}
#element_list > .type_else {color:royalblue;}
#element_list > .type_endif {color:blue; }
#element_list > .type_while {color:blue; }
#element_list > .type_endwhile {color:blue; }
#element_list > .type_layer {color:green; }
#element_list > .type_endlayer {color:green; }
#element_list .layer .element_name {border-top-left-radius: 0px; border-bottom-left-radius: 0px; border-left-color: green;}
#element_list .type_layer .element_name {border-top-left-radius: 5px;}
#element_list .type_endlayer .element_name {border-bottom-left-radius: 5px;}

#element_list .hide_elem {height:0px; overflow:hidden;}
#element_list .show_elem {height:auto !important;}


.page .type_image {background-color:rgba(0,0,0,0.2);}
.page .type_qrcode {box-shadow: inset 0px 0px 1px 1px rgba(0,0,0,0.2);}
.page .type_image {text-align:left !important;}
.page .type_barcode128 {width:60mm; 
background: -moz-linear-gradient(left, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.5) 1%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.5) 1%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.5) 1%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */}

.page .type_cell, .page .type_checkbox, .page .type_datetime, .page .type_timestamp, .page .type_multicell, .page .type_switchparam{padding:0px 2px;}


#add_column, #add_image {cursor: pointer;}

@media (max-width: 767px) 
{
  .only-mobile {display:inline-block; line-height:45px; font-weight:bolder;}
  .files .btn span {display:inline-block !important;}

  .navbar_home {margin-right:-15px; padding: 0px 15px; margin-top:5px;}
  .panel_home {text-align:center;}
}


@media (min-width: 767px) { 
  #sidenavi{
      position: fixed;
  }
}

#save_layer, #load_layer, #check_layer {cursor:pointer;}


.check_info
{
    cursor: help;
    color:green;
}
.check_error
{
    cursor: help;
    color: red;
}

.statement_buttons .btn {margin-left:15px; margin-bottom:10px;}

.navbar_no_bottom {margin-bottom:0px;}

@media (min-width: 768px) {
    .navbar_second  li > a, .navbar_second .navbar-brand {
      padding-top: 10px;
      padding-bottom: 10px;
    }
  }
  .navbar_second  li > a, .navbar-brand {
    padding-top:8px !important; 
    padding-bottom:4 !important;
    height: 36px;
}
.navbar_second {min-height:32px !important;}


.database_collapse > a {display:block; color: #333; font-weight: 700; line-height:30px; outline:none;}
.database_collapse > a:hover {text-decoration:none;}
.database_collapse > a:before {padding-right: 10px; content:"\f105"; font-family: 'Font Awesome 5 Pro';}
.database_collapse > a[aria-expanded="true"]:before {padding-right: 10px; content:"\f107"; font-family: 'Font Awesome 5 Pro';}

.add_column {cursor:cell;}
.add_column.no_click {color:grey; cursor:not-allowed;}



#edit_element .help-block {margin-bottom: 0px;}


#folders_container {border:1px solid #ccc; padding:10px;}
#folders_container legend {font-size: 15px; margin-bottom:10px;}
.folder_select {margin-bottom:5px; padding:5px; cursor: pointer;}
.folder_select:hover {background-color:#eee;}

.table-overview td {vertical-align:middle !important;}

.img_popup {display:none; max-width:202px; max-height:202px; position:absolute; border:1px solid black; top:0px; left:30px; z-index:100;}
.img_popup img {max-width:200px; max-height:200px;}
.img_name {cursor:pointer; position:relative;}
#upload_container {border:1px solid #ccc; line-height:30px; text-align:center; cursor: pointer;}


.image_select {display: flex; flex-wrap: wrap; align-items: stretch;}
.image_select img {max-width:150px; max-height:150px;}
.image_select .image {opacity: 0.8; cursor: pointer;}
.image_select .image:hover {opacity: 1;}
.image_select .image {padding:5px; margin:5px; border: 1px solid #ccc; position: relative;}
.image_select .image_name {width:100%; text-align:center; overflow:hidden; position: absolute; bottom:0px; left:0px; background-color:#fff;}

.doku {position: relative;}
.doku .affix {top:20px;}
.doku #sidenavi {background-color:white; }
.doku #sidenavi a {padding:5px 15px;}
.doku #sidenavi .active a {text-decoration:underline;}

.ui-widget-overlay {background-color: rgba(255,255,255,0.8);}
.no-close .ui-dialog-titlebar-close {display:none;}
.no-title .ui-dialog-titlebar {display:none;}


table.dataTable tbody td  {
  padding: 3px 7px;
}
table.dataTable thead th  {
  padding-left: 7px;
  padding-right: 7px;
}
.dataTables_info {padding-left:5px;}