/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Open+Sans');

html, body {
	margin:0px auto;
	padding:10px;
	font-family: 'Open Sans', Calibri, Tahoma, sans-serif;
	font-size:16px;
}

div, fieldset {
	box-sizing:border-box;
	margin:0px;
}

fieldset{
	border-radius:5px;
	border:2px solid #666;
	background:#ddd;
	margin-bottom:10px;
	padding:20px;
}


.save_button, .upload_field_datei{
	border:1px solid #666;
	border-radius:5px;
	background:#292;
	color:#fff;
	margin:10px 0px 10px 0px;
	padding:10px;
	min-width:300px;
	width:auto;
}
.save_button {
	font-weight:bold;
	cursor:pointer;
}
.upload_submit{
	border:0px solid #4a4;
	margin-left:20px;
	background:#4a4;
	color:#fff;
}
#vor_absenden {
	background:#4a4;
	border:2px solid #222;
	color:#000;
}

#absenden {
	background:#4a4;
	border:2px solid #222;
	color:#fff;
}


.fieldset_ok {
	border:2px solid #282;
	background-color: #9c9;
}




legend {
	background:#fff;
	border:1px solid #222;
	color:#222;
	border-radius:5px;
	padding:3px 5px;
	font-size:1em !important;
}
legend .fa {
	font-size:1em !important;
}
input, textarea, select, option {
	border:1px solid #666;
	border-radius:5px;
	font-size:16px;	
	padding:5px;
	font-family: 'Open Sans', Calibri, Tahoma, sans-serif;
	margin:5px 0px;
}
select {
	background:#eee;
	padding:0px;
	font-size:13px;	
}
hr {
	height:1px;
	border:0px;
	color:#888;
	background-color:#888;
}
/* Definition alle Links */
a, a:link {
	text-decoration:none;
	/* font-weight:bold; */
	color:#222;
	-webkit-transition: all 0.5s ease-in-out;
  	-moz-transition: all 0.5s ease-in-out;
  	-o-transition: all 0.5s ease-in-out;
  	transition: all 0.5s ease-in-out;
}
a:hover {
	color:#888; 
	-webkit-transition: all 0.5s ease-in-out;
  	-moz-transition: all 0.5s ease-in-out;
  	-o-transition: all 0.5s ease-in-out;
  	transition: all 0.5s ease-in-out;
}
a:active {
	color:#000;
}
.show_fieldset {
	display:block;
}
.hide_fieldset {
	display:none;
}
.hide_from_print {
}

#reg_container, .titlefield {
	max-width:900px;
	margin:auto;
}
.padding20 {
	padding:20px;
}
.update_input_field {
	background-color:#4a4;
	min-width:300px;
}

.ok_active {
	opacity:1 !important;
}
.ok_icon {
	opacity:0.1;
	margin-left:8px;
	font-size:1em;
}

.back_title {
	background-color: #ccc;
	color:#111;
	border-radius:2px;
	padding:2px 5px 2px 5px;
}

.back_lightred {
	background-color: #Fcc;
	border:1px solid #f00;
}

.clearfix {
	clear:both;
	height:1px;
	width:100%;
}
.min_hoehe_80 {
	height:80px;
	min-height:80px;
}
.min_hoehe_70 {
	height:70px;
	min-height:70px;
}
.centered_60 {
	text-align:center;
	margin:10px auto;
	width:50%;
	min-width:400px;
	max-width:500px;
}
.centered_60 .g-recaptcha {
	background-color:#fefefe;
	border:1px solid #999;
	margin:10px auto;
}
.form_aus {
	display:none;
}
.form_ok {
	background:#ddd;
	}
.form_bad {
	/*background:#f99;*/
	border:2px solid #822;
	}
.green {
	color:#282;
}
.icon_inaktiv {
	opacity:0.3;
}
.filteraktiv{
	color:#fff;
	background:#282;
	padding:0px 5px;
}
.info_fieldset{
	background:#282;
	color:#fff;
	font-size:0.8em;
	text-align:center;
}
.textarea_field_small{
	width:75%;
}
.test_fieldset{
	background:#99c;
}
.text_normal {
	font-size:1em;	
}
.text_mittel {
	font-size:1.1em;	
}
.text_gross {
	font-size:1.2em;	
}
.text_centered {
	text-align:center;
}
.text_right {
	text-align:right;
}
.title_logo {
	height:15px;
}
.title_logo_start {
	height:60px;
	vertical-align: middle;
}
.title_logo_main {
	float:left;
	height:60px;
}
#project_details {
	background:#888;	
	color:#fff;
	border-radius:5px;
}
.white {
	color:#fff !important;
}
.lightgrey {
	color:#bbb !important;
}
.red {
	color:#822;
}
.highlight {
	background:#FFF756;
}
.kursiv {
	font-style:italic;
}
.kleinrot { /* Für Info ToDo*/
	color:#a88;
	font-size:0.7em;
}
.kleinertextklammer{
	font-size:0.9em;
	opacity:0.8;
	margin-left:3px;
}

.kleininfo { 
	font-size:0.7em;
}


/* ZONEN PREVIEW IN CM FREIGABE */
/* ZONEN PREVIEW IN CM FREIGABE */
/* ZONEN PREVIEW IN CM FREIGABE */
.zone_release_container{
	margin-right:2px;
	border:1px solid #000;
	border-radius:2px;
	width:69px;
	text-align:center;
	font-size:0.8em;
	float:left;
}
.zone_release_container_small_text{
	clear:both;
	font-size:0.8em;
	line-height:0.7em;
	text-align:center;
}
.zone_check_top {
	display:table-cell;
	vertical-align:middle;
	border-bottom:1px solid #000;
	height:30px;
	width:70px;
}
.zone_check_top_checkbox {
	border:2px solid #f00 !important;
	margin:0px;
}
.zone_check_bottom {
	display:table-cell;
	vertical-align:middle;
	height:40px;
	width:70px;
}
.zonepreview100{
	border:0px solid #f00;
	width:auto;
}
/* ZONEN PREVIEW IN CM FREIGABE */
/* ZONEN PREVIEW IN CM FREIGABE */
/* ZONEN PREVIEW IN CM FREIGABE */


/* BADGE PRINT PREVIEW IN BADGE EDIT */
/* BADGE PRINT PREVIEW IN BADGE EDIT */
/* BADGE PRINT PREVIEW IN BADGE EDIT */

#badgecontainer_frame{ /* Nur zur Anzeige im System */
	background:#fff;
	box-shadow: 1px 1px 6px 1px rgba(33,33,33,0.5);
	border:1px solid #ccc;
	border-radius:5px;
	margin:10px auto;
	padding:3px;
	width:320px;
}
/* Folgende Definitionen werden gedruckt! */
#badgecontainer {
	font-size:0.8em;
	background:#fff;
	color:#000;	
	/*border:1px solid #eee;*/
	margin:0px;
	height:175px; /* 190px  275px*/
	width:310px; /* 310px 438px  */
	padding:0px; /* 5px */
}
.badgecontainer_100 {
	width:100%;
	padding:2px; /* 5px */
}
.badgecontainer_l {
	float:left;
	width:68%; /* 65% */
	height:100%;
	min-height:100px; /* 132px 192px */
	position:relative;
}
.badgecontainer_r {
	float:right;
	text-align:right;
	width:32%; /* 35% */
}


.symbol_badge_list {
	padding:4px;
	border-radius:2px;
	width: 20px;
	border:1px solid #333;
}
.zone_klein_preview { /* Bei BadgePreview */
	font-size:0.7em !important;
	font-weight:normal !important;
	padding:2px;
}
.zone_klein {
	border:1px solid #000;
	border-radius:2px;
	width:40px;
	font-size:0.7em;
	float:left;
	text-align:center;
	margin:0px 3px 3px 0px;
}
.zone_inaktiv{
	opacity:0.2;
}

.badge_titel {
	font-size: 1.3em;
	font-weight: bold;
	display:block;
	margin-bottom: 12px; /* 12px */
}
.badge_text {
	display:block;
}
.badge_ID {
	border:1px solid #f00;
	position:absolute;
	bottom:0px;
}
.badge_icons {
	position:absolute;
	top:35px; /* 0px */
	right:-8px;
}
.badge_icons img {
	width:18px;
}
.badge_logo {
	max-width:50px; /* 80px */
	/* max-height:35px; /* 45px */
}
.badge_logo_container {
	height:35px; /* 80px */
}
.badge_foto {
	width:80px;/* 90px */
	height:105px;/* 115px */
}
.badge_zone { /* In Anzeige Badge Edit */
	float:left;
	padding:2px; /*5px 5px; */
	margin:0 4px 4px 0;
	width:60px;
	border:1px solid #000;
	font-size:0.8em;
	font-weight: bold;
	word-break: keep-all;
}
.badge_zone_small { /* in Badge Preview */
	float:left;
	padding:2px; /*5px 5px; */
	margin:0 4px 4px 0;
	width:30px;
	border:1px solid #000;
	font-size:0.8em;
	font-weight: bold;
}

.badge_special_text {
	font-size:1.2em;
	font-weight: bold;
}
.resetBadgeInput {
	display:none;
}
.qualification_icon {
	width:20px; /* 25 */
}
.qualification_text {
	font-size:0.5em;
}

/* BADGE PRINT PREVIEW IN BADGE EDIT */
/* BADGE PRINT PREVIEW IN BADGE EDIT */
/* BADGE PRINT PREVIEW IN BADGE EDIT */





/* UPDATE ICONS SPEICHERN */
/* UPDATE ICONS SPEICHERN */
/* UPDATE ICONS SPEICHERN */

.update_icons, .update_zonen_icons   {
	background:#4a4;
	border:1px solid #666;
	color:#fff;
	border-radius:5px;
	height:24px !important;
	padding:5px !important;
}
.update_icons fa, .update_zonen_icons fa {
	box-shadow:1px 1px 2px 2px rgba(33,33,33,0.2);
}
.update_icons .fa-times, .update_zonen_icons .fa-times {
	color:#822;
}
.update_icons .fa-floppy-o, .update_zonen_icons .fa-floppy-o {
	color:#fff;
}

/* UPDATE ICONS SPEICHERN */
/* UPDATE ICONS SPEICHERN */
/* UPDATE ICONS SPEICHERN */




/* DATE PICKER */
/* DATE PICKER */
/* DATE PICKER */
.DatePick {
	border:1px solid #ccc;
	float:left;
	width:220px;
	padding:1px;
}
.DateIcons { 
	float:left;
	height:32px;
	padding-top:4px;
}
/* DATE PICKER */
/* DATE PICKER */
/* DATE PICKER */





.input_small {
	min-width:120px;
	width:30%;
}
.input_medium {
	min-width:200px;
	width:50%;
}
.width80{
	/*border:1px solid #f00;*/
	width:380px !important;
	padding:4px;
}
.width90{
	width:90%;
	min-width:200px;
}
.width100{
	display:block;
	width:100%;
}
.input_large {
	min-width:300px;
	width:70%;
}


.foto_float_left {
	float:left;
	margin:4px 10px 2px 0px;
	max-height:120px;
}
.foto_float_right {
	float:right;
	margin-left:10px;
	max-height:140px;
}
.upload_iframe {
	border:1px solid #555;
	/*box-shadow:0px 0px 2px 2px rgba(11,11,11,0.3) inset;*/
	background:rgba(0,0,0,0.1);
	border-radius:5px;
	padding:0px !important;
	margin:5px 0px !important;
	height:50px; /* 80px */
	width:100%;
}
.upload_iframe_body {
	padding:0px !important;
	margin:0px !important;
	font-size:0.8em;
}
.upload_iframe_body input{
	font-size:0.9em !important;
	border-radius:5px;
	padding:3px !important;
	margin:2px 0px !important;
}
.upload_button {
	font-size:1em !important;
	padding:3px !important;
	margin:2px 0px !important;
}

.upload_button_submit {
	font-size:1em !important;
	background:rgba(255,0,0,0.8);
	color:#fff;
	padding:3px !important;
	margin:2px 0px !important;
}


#upload_iframe_progress {
	background:rgba(0,0,0,0.8);
	padding:20px;
	margin:0px;
	color:#aaa;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	text-align:center;
}


.inaktiv {
	background:#ccc;
	color:#444;
	font-style:italic;
	opacity:0;
}
.fa-big {
	font-size:1.1em;
}
.fa-xxl {
	font-size:1.6em;
}
.hidden {
	display:none;
}
.element_hidden {
	display:none;
	margin-left:10px;
	font-size:1em;
}
.edit_active {
	background:#4a4;
	border:1px solid #282;
	font-size:1em;
}
.update_input_field::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color:#666;
	opacity:0.8;
}
.update_input_field:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:#666;
	opacity:0.8;
}
.update_input_field::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:#666;
	opacity:0.8;
}
.update_input_field:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:#666;
	opacity:0.8;
}

#webcam_snapshot {
	display:none;
	width:100%;
	height:auto;
	padding:4px;
	background:#fff;
	border:1px solid #333;
	border-radius:5px;
}
#webcam_snapshot_close{
	width:100%;
}
#camera-test {
}
#suchformular select{
	font-size:0.85em;
	float:left;
	height:24px;
	max-width:260px;
}
.field_short {
	width:120px;
}
.search_field{
	width:220px;
}
.small_symbol{
	max-height:22px;
	margin:0px 3px -6px 0px;
}
.small_text{
	font-size:0.8em !important;
}
.normal_text{
	font-size:1em;
}
.xsmall_symbol{
	max-height:16px;
	margin:0px 3px -2px 0px;
}
.block100{
	display:block;
	clear:both;
	width:100%;
}
.linie_links {
	border-left:1px solid #aaa;
	padding-left:10px;
}
.div_bewilligung{
	border:1px solid #999;
	border-radius:5px;
	width:auto;
	float:left;
	padding:5px;
	padding-right:8px;
	margin-right:8px;
	opacity:1;
}
.div_radio{
	border:1px solid #999;
	border-radius:5px;
	width:auto;
	float:left;
	padding:5px;
	padding-right:8px;
	margin-right:8px;
	opacity:1;
}
.div_selected{
	border:1px solid #ccc;
	background:rgba(255,255,255,0.8);
	opacity:1;	
}

.titlebar {
}
/* ============ TABELLENDARSTELLUNG ============ */
.header{
	background:#666;
	color:#fff;
}
.header a{
	color:#fff !important;
}
.tablerow {
	border-left:1px solid #999;
	display:table;
	width:100%;
	-webkit-transition: all 0.2s ease-in-out;
  	-moz-transition: all 0.2s ease-in-out;
  	-o-transition: all 0.2s ease-in-out;
  	transition: all 0.2s ease-in-out;
}
.tablerow:nth-child(odd) {
	background:#fff;
}
.tablerow:hover {
	background:#aaa;
	-webkit-transition: all 0.2s ease-in-out;
  	-moz-transition: all 0.2s ease-in-out;
  	-o-transition: all 0.2s ease-in-out;
  	transition: all 0.2s ease-in-out;
}


.tablecell {
	display:table-cell;
	padding:6px 3px;
	text-align:center;
}
.table_xxlarge {
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	width:500px;
	min-width:500px;
}
.table_xlarge {
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	width:350px;
	min-width:350px;
}
.table_large {
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	width:250px;
	min-width:250px;
}
.table_medium {
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	width:90px;
}
.table_small {
	border-right:1px solid #999;
	border-bottom:1px solid #999;
	width:55px;
}


.fa_big_button {
	padding:4px;
	border-radius:2px;
	font-size:1.1em;
	border:1px solid #333;
}

.back_red {
	background-color: #FF4447;
}
.back_orange {
	background-color: #FFBA54;
}
.back_yellow {
	background-color: #eee645; /* FFF756 */
	color:#333;
}
.back_green {
	background-color: #A1DA72;
}

.back_bordeaux {
	background-color: #D32547;
}
.back_darkgrey {
	background-color: #777777;
}
.back_lightgrey {
	background-color: #999;
}
.back_white {
	background-color: #eee;
}
.back_lightgrey {
	border-radius:2px;
	padding:2px 5px 2px 5px;
}

/* ============ TABELLENDARSTELLUNG ============ */

.text_left {
	text-align:left;
}
.text_right{
	text-align:right;
}
.left10margin {
	margin-left:1%;
}
.left20margin {
	margin-left:2%;
}
.left20{
	float:left;
	width:20%;
}
.left25{
	float:left;
	width:25%;
}
.left30{
	float:left;
	width:30%;
}
.left35{
	float:left;
	width:35%;
}
.left40{
	float:left;
	width:38%;
}
.left45{
	float:left;
	width:42%;
}
.left50{
	float:left;
	width:48%;
}
.left55{
	float:left;
	width:52%;
}
.left60{
	float:left;
	width:58%;
}
.left70{
	float:left;
	width:70%;
}
.right30{
	float:right;
	width:30%;
}
.right40{
	float:right;
	width:38%;
}
.right50{
	float:right;
	width:48%;
}
.right55{
	float:right;
	width:60%;
}
.right60{
	float:right;
	width:60%;
}
.right62{
	float:right;
	width:63%;
}

.width50 {
	width:50%;	
}
.width70 {
	width:70%;	
}
.block{
	
}
.navigation {
	background:#999;
	color:#fff;
	font-size:1em;
	vertical-align:middle;
}
.navigation:hover {
	color:#fff;
}
.navigation a:hover {
	color:#fff;
}
.menu_nav {
	float:left;
	border-right:1px solid #333;
	text-align:center;
	width:210px !important;
	min-width:210px !important;
	white-space:nowrap !important;
}

.menu_nav_aktiv {
	background:#fff;
}
.nav_aktiv {
	color:#fff;
}



/* ========== TOOLTIP ==========*/

.info_tip, .warning_tip,  .detail_tip, .badge_tip {
	cursor:help;
}
#show_info_tip, #show_warning_tip, #show_details_tip, #show_badge_tip  {
	cursor:zoom-out;
	display:none;
	border-radius:5px;
	border:1px solid #333;
	box-shadow: 1px 1px 8px 2px rgba(80,80,80,0.6);
	font-size:0.9em;
	padding:10px;
	position:absolute;
	top:0px;
	left:0px;
	height:auto;
	width:auto;
	min-height:50px;
	min-width:160px;
	z-index:33;
}
#show_info_tip{
	background:rgba(140,222,140,0.9);
}

#show_warning_tip{
	background:rgba(222,140,140,0.9);
}
#show_details_tip{
	background:rgba(240,240,240,0.9);
}
#show_badge_tip{
	background:rgba(255,255,255,0.95);
	width:250px;
	height:auto;
}
#show_badge_tip img{
	height:80px;
	margin-top:5px;
	margin-right:5px;
	float:left;
}











#statistik {
	
}
#statistik a {
	color:#9fbcdd;
}
#statistik a:hover,
#statistik a.activo {
	color:#9fbcdd;
	text-decoration:underline;
}
.stat-info-klein {
	font-size:9px;
	font-weight:normal;
}
.stat-box {
	display:table;
	width:100%;
	font-size:9px;
	text-align:center;
	height:200px;
}
.stat-col {
	padding:.5%;
	height:100%;
	vertical-align:bottom;
	display:table-cell;
}
.stat-col:hover:not(:first-child) {
	cursor:pointer;
	background-color:#eee;
}
.stat-col-heute {
	background-color:#FEFFDB;
}
.stat-bar {
	background-color:#9fbcdd;
	position:relative;
}
	.stat-bar span {
	}
	.stat-bar span.stat-wert-unten {
		position:absolute;
		left:0;
		bottom:0;
		width:100%;
	}
.stat-bottom {
	border-top:#000 solid 1px;
}
.stat-bottom, .stat-left-bottom {
	height:10%;
}
.stat-left-0 {
	height:10%;
}
.stat-left-top {
	height:80%;
}
.stat-nav {
	padding:0 5px 20px 5px;
}

.stat-liste {
	padding:0 5px 20px 5px;
}
.stat-liste {
	width:100%;
	display:table;
}
.stat-liste .zeile {
	display:table-row;
}
.stat-liste .zeile.kopf {
	font-weight:bold;
}
.stat-liste .zeile.kopf:hover {
	background-color:#fff;
}
.stat-liste .zeile:hover {
	background-color:#eee;
}
.stat-liste .zeile .spalte {
	display:table-cell;
	padding:2px 5px;
}
.stat-print {
	padding:0 5px 5px 5px;
	text-align:right;
}


.back_none {
	background: none !important;
	border: none !important;
}
.border_simple {
	border:1px solid #666 !important;
}


/* ========================================= RESPONSIVE ==================================================== */
/* ========================================= RESPONSIVE ==================================================== */
/* ========================================= RESPONSIVE ==================================================== */
/* ========================================= RESPONSIVE ==================================================== */
/* ========================================= RESPONSIVE ==================================================== */
/* ========================================= RESPONSIVE ==================================================== */
@media all and (max-width: 900px) {
	.block{
		clear:both;
		float:left;
		display:block;
		width:100%;
	}
	.min_hoehe_80 {
	height:auto;
	min-height:auto;
	}
	.min_hoehe_60 {
	height:auto;
	min-height:auto;
	}
	.titlebar {
		display:block !important;
		width:100% !important;
		text-align:center !important;
	}
	.tablecell {
		font-size:0.8em;
		padding:3px;
		text-align:center;
	}
	.tableresp{
		display:inline-table;
		width:100%;
	}
	.tableresp:nth-child(odd){
			background-color: #999;
			color:#fff;
	}
	.tableresp:nth-child(odd) .tablecell{
			font-size:1em;
	}
	
}