* {
	box-sizing: border-box;
}
  
.row::after {
	content: "";
	clear: both;
	display: table;
}
  

[class*="col-"] {
	float: left;
	padding: 10px;
}

html {
    font-family: 'Open Sans', sans-serif;
	background-color: #bbb;
}

 /* Für Handys: */
[class*="col-"] {
	width: 100%;
}

 /* Small devices (portrait tablets and large phones, 600px and up) */
 @media only screen and (min-width: 600px) {
	.col-s-1 {width: 8.33%;}
	.col-s-2 {width: 16.66%;}
	.col-s-3 {width: 25%;}
	.col-s-4 {width: 33.33%;}
	.col-s-5 {width: 41.66%;}
	.col-s-6 {width: 50%;}
	.col-s-7 {width: 58.33%;}
	.col-s-8 {width: 66.66%;}
	.col-s-9 {width: 75%;}
	.col-s-10 {width: 83.33%;}
	.col-s-11 {width: 91.66%;}
	.col-s-12 {width: 100%;}
}
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {
	.col-m-1 {width: 8.33%;}
	.col-m-2 {width: 16.66%;}
	.col-m-3 {width: 25%;}
	.col-m-4 {width: 33.33%;}
	.col-m-5 {width: 41.66%;}
	.col-m-6 {width: 50%;}
	.col-m-7 {width: 58.33%;}
	.col-m-8 {width: 66.66%;}
	.col-m-9 {width: 75%;}
	.col-m-10 {width: 83.33%;}
	.col-m-11 {width: 91.66%;}
	.col-m-12 {width: 100%;}
}
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {
	.col-l-1 {width: 8.33%;}
	.col-l-2 {width: 16.66%;}
	.col-l-3 {width: 25%;}
	.col-l-4 {width: 33.33%;}
	.col-l-5 {width: 41.66%;}
	.col-l-6 {width: 50%;}
	.col-l-7 {width: 58.33%;}
	.col-l-8 {width: 66.66%;}
	.col-l-9 {width: 75%;}
	.col-l-10 {width: 83.33%;}
	.col-l-11 {width: 91.66%;}
	.col-l-12 {width: 100%;}
}

 /* Extra large devices (large laptops and desktops, 1600px and up) */
 @media only screen and (min-width: 1200px) {
	.col-xl-1 {width: 8.33%;}
	.col-xl-2 {width: 16.66%;}
	.col-xl-3 {width: 25%;}
	.col-xl-4 {width: 33.33%;}
	.col-xl-5 {width: 41.66%;}
	.col-xl-6 {width: 50%;}
	.col-xl-7 {width: 58.33%;}
	.col-xl-8 {width: 66.66%;}
	.col-xl-9 {width: 75%;}
	.col-xl-10 {width: 83.33%;}
	.col-xl-11 {width: 91.66%;}
	.col-xl-12 {width: 100%;}
} 

 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1600px) {
	.col-1 {width: 8.33%;}
	.col-2 {width: 16.66%;}
	.col-3 {width: 25%;}
	.col-4 {width: 33.33%;}
	.col-5 {width: 41.66%;}
	.col-6 {width: 50%;}
	.col-7 {width: 58.33%;}
	.col-8 {width: 66.66%;}
	.col-9 {width: 75%;}
	.col-10 {width: 83.33%;}
	.col-11 {width: 91.66%;}
	.col-12 {width: 100%;}
} 

@media only screen and (min-width: 600px) {
	.col-termine-s-1 {width: 8.33%;}
	.col-termine-s-2 {width: 16.66%;}
	.col-termine-s-3 {width: 25%;}
	.col-termine-s-4 {width: 33.33%;}
	.col-termine-s-5 {width: 41.66%;}
	.col-termine-s-6 {width: 50%;}
	.col-termine-s-7 {width: 58.33%;}
	.col-termine-s-8 {width: 66.66%;}
	.col-termine-s-9 {width: 75%;}
	.col-termine-s-10 {width: 83.33%;}
	.col-termine-s-11 {width: 91.66%;}
	.col-termine-s-12 {width: 100%;}
}
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {
	.col-termine-m-1 {width: 8.33%;}
	.col-termine-m-2 {width: 16.66%;}
	.col-termine-m-3 {width: 25%;}
	.col-termine-m-4 {width: 33.33%;}
	.col-termine-m-5 {width: 41.66%;}
	.col-termine-m-6 {width: 50%;}
	.col-termine-m-7 {width: 58.33%;}
	.col-termine-m-8 {width: 66.66%;}
	.col-termine-m-9 {width: 75%;}
	.col-termine-m-10 {width: 83.33%;}
	.col-termine-m-11 {width: 91.66%;}
	.col-termine-m-12 {width: 100%;}
}
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {
	.col-termine-l-1 {width: 8.33%;}
	.col-terminel-2 {width: 16.66%;}
	.col-termine-l-3 {width: 25%;}
	.col-termine-l-4 {width: 33.33%;}
	.col-termine-l-5 {width: 41.66%;}
	.col-termine-l-6 {width: 50%;}
	.col-termine-l-7 {width: 58.33%;}
	.col-termine-l-8 {width: 66.66%;}
	.col-termine-l-9 {width: 75%;}
	.col-termine-l-10 {width: 83.33%;}
	.col-termine-l-11 {width: 91.66%;}
	.col-termine-l-12 {width: 100%;}
}

 /* Extra large devices (large laptops and desktops, 1600px and up) */
 @media only screen and (min-width: 1200px) {
	.col-termine-xl-1 {width: 8.33%;}
	.col-termine-xl-2 {width: 16.66%;}
	.col-termine-xl-3 {width: 25%;}
	.col-termine-xl-4 {width: 33.33%;}
	.col-termine-xl-5 {width: 41.66%;}
	.col-termine-xl-6 {width: 50%;}
	.col-termine-xl-7 {width: 58.33%;}
	.col-termine-xl-8 {width: 66.66%;}
	.col-termine-xl-9 {width: 75%;}
	.col-termine-xl-10 {width: 83.33%;}
	.col-termine-xl-11 {width: 91.66%;}
	.col-termine-xl-12 {width: 100%;}
} 

 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1600px) {
	.col-termine-1 {width: 8.33%;}
	.col-termine-2 {width: 16.66%;}
	.col-termine-3 {width: 25%;}
	.col-termine-4 {width: 33.33%;}
	.col-termine-5 {width: 41.66%;}
	.col-termine-6 {width: 50%;}
	.col-termine-7 {width: 58.33%;}
	.col-termine-8 {width: 66.66%;}
	.col-termine-9 {width: 75%;}
	.col-termine-10 {width: 83.33%;}
	.col-termine-11 {width: 91.66%;}
	.col-termine-12 {width: 100%;}
} 

@media only screen and (max-width: 1600px) {
    #hide5 {
        display: none;
	}
	#hide4 {
        display: none;
	}
	.zahnschemaRand {
		display: none;
	}
	.zahnschemaRandPadding {
		padding: 10px 0px;
	}
}

@media only screen and (max-width: 1200px) {
	
}

@media only screen and (max-width: 992px) {
    #hide3 {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    #hide2 {
        display: none;
	}
}

div#preload { 
	display: none; 
}

/* Margins */
.mauto {
	margin:auto;
}

.m5 {
	margin: 5px;
}

.m20 {
	margin:20px;
}

.mt5 {
	margin-top:5px;
}

.mt10 {
	margin-top: 10px;
}

.mt-10 {
	margin-top: -10px;
}

.mt15 {
	margin-top: 15px;
}

.mt20 {
	margin-top: 20px;
}

.mt22 {
	margin-top: 22px;
}

.mt35 {
	margin-top: 35px;
}

.mr5 {
	margin-right: 5px;
}

.mr12 {
	margin-right: 12px;
}

.mr20 {
	margin-right: 20px;
}

.mb0 {
	margin-bottom: 0px;
}

.mb15 {
	margin-bottom: 15px;
}

.mb20 {
	margin-bottom: 20px;
}

.ml0 {
	margin-left: 0px;
}

.ml5 {
	margin-left: 5px;
}

.ml5p {
	margin-left: 5%;
}

.ml10 {
	margin-left: 10px;
}

.ml15 {
	margin-left: 15px;
}

.ml-15 {
	margin-left:-15;
}

.ml-20 {
	margin-left:-20;
}

.ml175 {
	margin-left: 175px;
}

/* Paddings */
.p0 {
	padding:0px;
}

.p10 {
	padding:10px;
}

.p20 {
	padding:20px;
}

.pt2 {
	padding-top:2px;
}

.pt5 {
	padding-top:5px;
}

.pt10 {
	padding-top:10px;
}

.pt12 {
	padding-top:12px;
}

.pt20 {
	padding-top:20px;
}

.pt25 {
	padding-top:25px;
}

.pt200 {
	padding-top:200px;
}

.pl5 {
	padding-left:5px;
}

.pl27 {
	padding-left:27px;
}

.pl53 {
	padding-left:53px;
}

.pl80 {
	padding-left: 80px;
}

.pr15 {
	padding-right:15px;
}

.pb0 {
	padding-bottom: 0px;
}

.pb5 {
	padding-bottom: 5px;
}

.pb10 {
	padding-bottom: 10px;
}

/* Positions */
.pabs {
	position: absolute;
}

.prel {
	position: relative;
}

.fleft {
	float: left;
}

.fright {
	float: right;
}

.t0 {
	top:0;
}

.l10 {
	left:10px;
}

/* Heights & Widths */
.h0 {
	height:0px;
}

.h43 {
	height:43px;
}

.h45 {
	height:45px;
}

.w90perc {
	width:90%;
}

.w100perc {
	width:100%;
}

.minw800 {
	min-width: 800px;
}

.minh500 {
	min-height: 500px;
}

.minh700 {
	min-height: 700px;
}

.maxw100 {
	max-width: 100%;
}

.maxh100 {
	max-height: 100%;
}

.dblock {
	display:block;
}

/* Cursors */

.cpointer {
	cursor:pointer;
}

/* Text-Formatierungen */
.u {
	text-decoration:underline;
}

.taright {
	text-align:right;
}

.tacenter {
	text-align:center;
}

.fs12 {
	font-size:12px;
}

.fs22 {
	font-size:22px;
}

.fwb {
	font-weight:bold;
}

.cblack {
	color:black;
}

.cwhite {
	color:white;
}

.nowrap {
	white-space: nowrap;
}

/* Tabellen */
.tr {
	display:table-row;
}

.td {
	display:table-cell;
}

.br0 {
	border-right:0px;
}

.bl0 {
	border-left:0px;
}

.body_details {
	background-color: #fff;
	border:1px solid grey;
	padding: 20px 20px 0px 20px;
}

.hrDashed {
	border: 1px dashed #555;
	padding: 0px 10px 0px 10px;
	margin-top:25px;
}

.header {
	background-color:#4C729F; 
	border-bottom:2px solid grey; 
	padding-top:15px; 
	margin-top:10px;
}

.header_firma {
	text-align:left; 
	width:33.33%; 
	float:left; 
	color:white; 
	white-space: nowrap;
	margin-top:2px;
}

.header_link {
	text-align:center; 
	width:33.34%; 
	float:left;
	margin-top:2px;
}

.header_link_button {
	padding:5px 15px; 
	border: 2px solid black; 
	border-radius: 5px;
	text-decoration:none; 
	font-weight:bold; 
	color:black; 
	background-color:#fff; 
	white-space: nowrap;
}

.header_logo {
	text-align:right; 
	width:33.33%; 
	float:left;
}

.indexOrt {
	float:right; 
	padding:10px; 
	z-index:1000; 
	position:relative; 
	width:100px; 
	height:56px; 
	white-space: nowrap;
}

.detailsHeaderAuftrag {
	color:white;
	font-weight:bold; 
	font-size:20px; 
	padding-left:20px; 
	margin-top:10px;
}

.detailsHeaderAuftragText {
	position: absolute; 
	bottom:34px; 
	left: 40px; 
	font-size:14px;
}

.detailsHeaderAuftragAnr {
	position: absolute; 
	bottom:11px; 
	left: 20px;
}

.detailsHeaderOrteContainer {
	margin-top:-10px; 
	position:relative; 
	padding-top:16px;
}

.detailsHeaderOrteDropdown {
	position: absolute; 
	bottom:29px; 
	left: 93px;
}

.detailsFooter {
	width: calc(100% + 40px); 
	margin: -20px 0px 0px -20px;
}

.details_breit_oben {
	width: calc(100% + 40px); 
	margin: -20px 0px 0px -20px;
	border-bottom:2px solid grey; 
	height:100px; 
	padding: 3px 10px;
}

.details_breit_unten {
	width: calc(100% + 40px); 
	margin: 20px 0px 10px -20px;
}

.detailsSummary {
	font-weight:bold; 
	font-size:20px;
	cursor:pointer; 
	outline:none; 
	position:static;
}

.detailsKachelTerminZeile1 {
	display:table-cell; 
	width:30px; 
	padding:10px;
}

.detailsKachelTerminZeile2 {
	display:table-cell; 
	padding:0px 10px;
}

.kundeIntern {
	width:100%; 
	min-height:32px;
}

.kundeInternButtonContainer {
	width:40px; 
	float:right;
	margin-top: 5px; 
	z-index:100; 
	position: relative;
}

.detailsEditInternText {
	width:100%; 
	height:200px; 
	font-size:18px;
}

.detailsRow {
	width:100%; 
	min-height:32px;
}

.detailsRowBezeichnung {
	width:80px; 
	padding-bottom:10px; 
	float:left; 
	font-weight:bold;
}

.detailsRowText {
	padding-bottom:10px;
}

.zahnschemaTable {
	display:table; 
	margin:auto; 
	padding: 10px 0px;
}

.zahnschemaCell {
	display:table-cell; 
	width:50px; 
	text-align:center;
}

.detailsTechniker {
	position:absolute; 
	margin-top:0px; 
	margin-left:60px; 
	width:45px;
}

.detailsTechnikerMulti {
	float:left; 
	position:absolute; 
	margin-top:5px;
}

.detailsAnzahl {
	text-align:right; 
	width:40px;
}

.detailsLNR {
	width:60px;
}

.detailsLeistung {
	border-right:0px;
}

.detailsInfo {
	border-left:0px; 
	text-align:center; 
	width:110px; 
	padding-right:10px;
}

.detailsTechnikerTable {
	width:120px; 
	padding:10px;
}

.bg_blau {
	background-color:#4C729F;
}

.blau {
	color:#4C729F;
}

.bg_weiss {
	background-color:#FFFFFF;
}

.weiss {
	color:#FFFFFF;
}

.bg_grau1 {
	background-color: #DDDDDD;
}

.grau1 {
	color: #DDDDDD;
}

.kachel {
	color: #000;
	background-color: #7FC9FF;
	border:1px solid #999;
	display:inline-grid;
	width:100%;
	height:200px;
	overflow: hidden;
}

.kachel_termine_details {
	color: #000;
	border:1px solid black; 
	display:grid;
	height:125px;
	overflow:auto;
	background:
		linear-gradient(white 30%, rgba(255,255,255,0)),
		linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
		
		radial-gradient(50% 0, farthest-side, rgba(0,0,0,.2), rgba(0,0,0,0)),
		radial-gradient(50% 100%,farthest-side, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
	background:
		linear-gradient(white 30%, rgba(255,255,255,0)),
		linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
		
		radial-gradient(farthest-side at 50% 0, rgba(127,201,255,1), rgba(0,0,0,0)),
		radial-gradient(farthest-side at 50% 100%, rgba(127,201,255,1), rgba(0,0,0,0)) 0 100%;
	background-repeat: no-repeat;
	background-color: white;
	background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
	background-attachment: local, local, scroll, scroll;
	margin-top:15px;
}

.hide_scrollbar {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.hide_scrollbar::-webkit-scrollbar {
	display: none;
  }

.kachel_link {
	display:block;
	width:100%;
	height:100%;
	text-align:left; 
	color:black; 
	text-decoration:none;
	text-align: left;
	word-wrap: break-word;
}

.kachel_link_inaktiv {
	display:block;
	text-align:left; 
	color:black; 
	text-decoration:none;
	text-align: left;
	word-wrap: break-word;
	cursor: not-allowed;
	position: relative;
	height:100%;
}

.kachel_link_inaktiv:before, .kachel_link_inaktiv:after {
    position: absolute;
    content: '';
    background: rgba(255, 0, 0, 0.2);
    display: block;
    width: 100%;
    height: 10px;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
    left: 0;
    right: 0;
    top: -5px;
    bottom: 0;
    margin: auto;
}

.kachel_link_inaktiv:after {
    -webkit-transform: rotate(30deg);  
    transform: rotate(30deg);
}

.kachel:hover {
	-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	border: 1px solid black;
	background-color: #7FC9FF;
}

.kachel_termine {
	color: #000;
	border:1px solid #999;
	display:block;
	width:100%;
	overflow: hidden;
	padding-top:5px;
	/*height:95px;*/
	height:105px;
}

.termine_zeile1 {
	padding-left:5px;
	padding-top:10px;
	white-space: nowrap;
	font-weight:bold;
	overflow:hidden;
	height:32px;
}

.termine_zeile2 {
	padding: 0 5px;
	white-space: nowrap;
	overflow:hidden;
	height:22px;
}

.termine_zeile3 {
	font-size:13px;
	padding: 2px 5px;
	margin-bottom:1px;
	height:22px;
	background-color: rgba(0, 0, 0, 0.1);
	white-space: nowrap;
	overflow:hidden;
}

.termineWochentag {
	font-weight:bold; 
	text-align:center; 
	border:1px solid grey; 
	padding:5px; 
	background-color:#990000; 
	color:white;
}

.termineOrt {
	float:right; 
	font-size:14px; 
	width:29%; 
	height:32px;
	padding:7px; 
	margin-top:-5px; 
	overflow:hidden; 
	white-space: nowrap;
}

.terminePlatzhalter {
	margin-left:50%; 
	height:15px; 
	width:1px; 
	border:1px solid black;
}

.termineUhrzeit {
	border-bottom:1px solid black; 
	border-right:1px solid black; 
	width:50%; 
	font-weight:bold; 
	padding:5px; 
	margin-top:5px;
}

.kachel_termine:hover {
	-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
	border: 1px solid black;
	background-color: #7FC9FF;
}

.kachel_thumbnail  {
	color: #000;
	background-color: #FFF;
	border:2px solid #4C729F;
	border-radius: 5px;
	display:inline-grid;
	display:-ms-inline-grid;
	margin-right:5px;
	margin-bottom:10px;
	align-content: center;
	padding:10px;
}

.image {
	background-color: #FFF;
	border:1px solid #999;
	padding:15px 15px 10px 15px;
	position:relative;
}

.imageNext {
	width:20%; 
	z-index:1000; 
	position:absolute; 
	margin-top:20%; 
	right:0px; 
	padding:75px 20px 75px 0px; 
	text-align:right;
}

.imagePrev {
	width:20%; 
	z-index:1000; 
	position:absolute; 
	margin-top:20%; 
	padding: 75px 0px;
}

.imageFooter {
	width: calc(100% + 40px); 
	margin: 20px 0px 0px -20px;
}

.imageError {
	text-align: center;
    font-weight: bold;
    font-size: 22px;
    margin-top: 100px;
}

.bg {
	margin-bottom:5px;
}

.bg.head {
	font-size:22px;
	padding: 0px 10px 5px 10px;
	width:90%;
}

.bg.row {
	padding: 5px 10px 0px 10px;
	white-space: nowrap;
	min-height: 27px;
	width:1px;
}

.bg.icon {
	float: right;
	margin-right:10%;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#sucheUL {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#sucheInput {
	background-image: url('../img/icon_suche.png');
	background-position: 10px 12px;
	background-repeat: no-repeat;
	min-width: 230px;
	width:80%;
	font-size: 16px;
	padding: 14px 0px 14px 45px;
	border: 1px solid black;
	margin: 10px 0px 10px 10px;
}

.sucheRahmen {
	border:1px solid #999;
	margin-left:-10px; 
	margin-right:5px; 
	background-color:white;
}

.table_cell {
	padding:10px;
	text-align:left;
}

table, th, td {
	border:1px solid grey;
	border-collapse: collapse;
  }

tr:nth-child(odd) {
	background-color: #A5D9FF;
}

td > a {
	padding:10px;
	text-decoration:none;
	color:black;
}

tr:not(:first-child):hover {
    background-color: #FAFAC8;
}

.close {
	background: #eee;
	width: 50px;
	height: 50px;
	border: 1px solid black;
	cursor: pointer;
	padding: 0px 5px 1px 5px;
	margin-left:10px;
	transition: 0.5s;
}

.close:hover {
	background: #990000;
	transition: 0.5s;
}

.btnBackWeiss {
	background:url(../img/icon_back_weiss.png) no-repeat;
	background-color: transparent;
	display: block;
	height:52px;
	width:110px;
	cursor: pointer;
	position: relative;
}

.btnBackWeissText {
	color: white;
	font-weight:bold;	
	position: absolute;
	top:15px;
	left:35px;
}

.btnBackWeissKlein {
	background:url(../img/icon_back_weiss_klein.png) no-repeat;
	background-color: transparent;
	display: block;
	height:36px;
	width: 46px;
	cursor: pointer;
	position: relative;
}

.btnBackWeissKleinText {
	color: white;
	font-weight:bold;	
	position: absolute;
	top:7px;
	left:17px;
}

.btnWeiterWeissKlein {
	background:url(../img/icon_weiter_weiss_klein.png) no-repeat;
	background-color: transparent;
	display: block;
	height:36px;
	width:46px;
	cursor: pointer;
	position: relative;
}

.btnWeiterWeissKleinText {
	color: white;
	font-weight:bold;	
	position: absolute;
	top:7px;
	left:9px;
}

.btnBackSchwarz {
	background:url(../img/icon_back_schwarz.png) no-repeat;
	background-color: transparent;
	display: block;
	height:52px;
	width:110px;
	cursor: pointer;
	position: relative;
}

.btnBackSchwarzText {
	color: black;
	font-weight:bold;	
	position: absolute;
	top:15px;
	left:35px;
}

.dropdown {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border:2px solid white;
	border-radius: 5px;
	cursor: pointer;
	outline: none;
	width: 100%;
	color: white;
	background-color: #4C729F;
	font-size:20px;
	padding:3px;
	text-align-last:center;
}

.__dropdownTKZ {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border: dashed;
	border-width: 0px 0px 1px 0px;
	cursor: pointer;
	outline: none;
	width: 50px;
	background-color: transparent;
	font-size:16px;
	float:right;
	padding-right: 30px;
}

.dropdownTKZ {
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: -0.4px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: #292929;
	outline: none;
	background-color: transparent;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	appearance: none;
	border: none;
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	width: 100%;
	height: 55px;
	top:-10px;
	padding-right: 10%;
	box-sizing: content-box;
	position: relative;
	z-index: 1;
	cursor:pointer;
  }
  
.labelTKZ {
	position: relative;
	display: block;
	width: 100%;
	background-color: transparent;
	padding-left: 1px;
	cursor:pointer;
	height:34px;
}

.labelTKZ:after {
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* content: url("../img/icon_edit.png"); */
	font-size: 16px;
	padding-right: 10px;
	text-align: right;
	position: absolute;
	right: 0;
	top: 8px;
	background-color: transparent;
	text-rendering: optimizeLegibility;
	
}

.iconLOT {
	border: 2px solid #4C729F;
	border-radius: 5px;
	padding:5px 10px;
	background-color: #fff;;
	display:inline-block;
	height:35px;
}

@keyframes spin {
	0% {
	  transform: rotate(0deg);
	}
	100% {
	  transform: rotate(360deg);
	}
  }

.loading {
	border-radius: 50%;
	width: 50px;
	height: 50px;
	border: .25rem solid #888;
	border-top-color: #333;
	animation: spin 1s infinite linear;
  	&--double {
	border-style: double;
	border-width: .5rem;
  }
}

.loading_text {
	margin:auto; 
	text-align:center; 
	padding-top:10px; 
	font-size:20px;
}

.loadingGifImg {
	height:200px; 
	width:200px; 
	position: fixed; 
	top:30%; 
	left:50%; 
	margin-left:-100px;
}

.loadingGifImgSmall {
	height:100px; 
	width:100px;
}

.obereZeile > div[id^='zahn'] {
	border-bottom: 2px solid grey;
	background-color:#FAFAC8;
}

.untereZeile > div[id^='zahn'] {
	border-top: 2px solid grey;
	background-color:#FAFAC8;
}

div[id^='zahn'] {
	border: 1px solid grey;
}

div[id^='zahn11'] {
	border-right: 4px solid grey;
}

div[id^='zahn41'] {
	border-right: 4px solid grey;
}

.imageZoom-window {
	position: absolute;
	top: 15px;
	left: 15px;
	z-index: 999;
	opacity: 0;
	pointer-events: none;
	display:none;
}

.imageZoom-window:target {
	opacity: 1;
	pointer-events: auto;
	display: unset;
	width:100%;
	height:100%;
}

.modal-window {
	position: fixed;
	background-color: rgba(255, 255, 255, 0.5);
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 999;
	opacity: 0;
	pointer-events: none;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.modal-window:target {
	opacity: 1;
	pointer-events: auto;
}

.modal-window>div {
	min-width: 700px;
	position: relative;
	top: 250px;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #4C729F;
	border:1px solid black;
}

.modal-window-text {
	padding: 20px;
	background: #F6F5F6;
	-webkit-margin-before:0px;
}

.modal-window-padding {
	padding:20px 20px 0px 20px;
}

.modal-window header {
	font-weight: bold;
}

.modal-window-footer {
	padding: 20px;
	font-weight: bold;
	background: #FFF;
}

.modal-close {
	color: white;
	line-height: 50px;
	font-size: 28px;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
	width: 50px;
	text-decoration: none;
	border-left:1px solid black;
	border-bottom:1px solid black;
	background:red;
	transition:0.5s;
}

.modal-window-close {
	height:100%; 
	width:100%; 
	top: 0; 
	left:0; 
	right:0; 
	bottom:0; 
	display:block; 
	cursor:default
}

.modal-close:hover {
	color: #000;
	background:#AB0000;
	transition:0.5s;
}

.modal-window h1 {
	font-size:16px;
	color: #FFF;
	border-bottom: 1px solid black;
	padding-left: 20px;
	padding-bottom:25px;
	padding-top:5px;
	height: 15px;
	margin: 0px;
}

.modal-button {
	color: black;
	line-height:40px;
	float:right;
	text-align: center;
	width: 150px;
	text-decoration: none;
	border:2px solid #4C729F;
	border-radius: 5px;
	font-weight:bold;
	font-size:14px;
	cursor: pointer;
	transition:0.5s;
}

.modal_textarea {
	font-family: 'Open Sans', sans-serif;
	font-size:14px;
	width:100%;
	height:150px; 
	resize: none;
	cursor: default;
	background-color:#fff;
	border:1px solid #aaa;
	overflow:auto;
	padding:5px;
}

.modal-window-cam {
	position: fixed;
	background-color: rgba(255, 255, 255, 0.5);
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 999;
	
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.modal-window-cam:target {
	pointer-events: auto;
}

.modal-window-cam>div {
	position: absolute;
	top: 0px;
	left: 50%;
	transform: translate(-50%, 0%);
	background: #4C729F;
	border:1px solid black;
}

.camButton {
	border:2px solid white; 
	text-align:center; 
	width:100px; 
	display: block; 
	border-radius:5px; 
	background-color:#F0F0F0;	
}

.fileButton {
	border:2px solid white; 
	text-align:center; 
	width:100px; 
	display: block; 
	border-radius:5px; 
	background-color:#F0F0F0;	
	float:left;
}

.textfield_edit {
	padding:5px;
	height:35px;
	border: 1px solid #000;
}

.button_edit {
	background-image: url('../img/icon_edit.png');
	background-repeat: no-repeat;
	background-origin: content-box, padding-box;
	background-color: white;
	border:2px solid #4C729F;
	border-radius: 5px;
	width: 35px;
	height: 35px;
	position:absolute;
	padding-top:7px;
	padding-bottom: 5px;
	margin-left:10px;
	cursor: pointer;
}

.textfield_edit[readonly] {
	background-color: #eee;
	cursor: not-allowed;
	border: 1px solid #aaa;
}

.btnOK{
	background:url('../img/icon_ok.png') no-repeat;
	background-position: 10px 50%;
	background-color:#fff;
	padding-left:20px;
	height: 44px;
}

.btnOK:hover {
	color: white;
	background-color:green;
	transition:0.5s;
}

.btnCancel{
	background:url('../img/icon_cancel.png') no-repeat;
	background-position: 10px 50%;
	background-color:#fff;
	padding-left:20px;
	height: 44px;
}

.btnCancel:hover {
	color: white;
	background-color:#990000;
	transition:0.5s;
}

/* Mengeneingabe */

.btnMengeOK {
	background:url('../img/icon_ok_32.png') no-repeat;
	position:absolute; 
	margin-left:2px; 
	margin-top:-57px;
	height:59px;
	width:59px;
	border: 2px solid #4C729F;
	border-radius: 5px;
	background-color:#fff;
	background-position: 13px;
	cursor: pointer;
}

.btnMengeCancel {
	background:url('../img/icon_cancel_32.png') no-repeat;
	position:absolute; 
	margin-left:63px; 
	margin-top:-57px;
	height:59px;
	width:59px;
	border: 2px solid #4C729F;
	border-radius: 5px;
	background-color:#fff;
	background-position: 13px;
	cursor: pointer;
}

/* Tooltip */

.tooltip {
	position: relative;
	display: inline-block;
	cursor: pointer;
}

.tooltip .tooltiptext {
	visibility: hidden;
	min-width:300px;
	max-width:600px;
	width:max-content;
	background-color: white;
	color: #000;
	border:1px solid black;
	padding: 10px;
	margin-left:10px;

	position: absolute;
	z-index: 1;
	top: -5px;
	left: 105%;
}

.tooltip:hover .tooltiptext {
	visibility: visible;
}

/* Meldung einblenden, bei erfolgreichem Löschen einer Datei */
#aktionsmeldung_erfolg {
	min-width: 340px;
	height: 37px;
	margin-left: 25%;
	text-align: center;
	padding:7px;
	font-size:16px;
	font-weight:bold;
	z-index: 999;
	position: fixed;
	opacity: 0;
	color:white;
	background-color:green;
	border:1px solid white;

	animation:aktionsmeldung 2s 1;
	-webkit-animation:aktionsmeldung 2s 1;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
} 

#aktionsmeldung_fehler {
	min-width: 340px;
	height: 37px;
	margin-left: 25%;
	text-align: center;
	padding:7px;
	font-size:16px;
	font-weight:bold;
	z-index: 999;
	position: fixed;
	opacity: 0;
	color:white;
	background-color:red;
	border:1px solid white;

	animation:aktionsmeldung 2s 1;
	-webkit-animation:aktionsmeldung 2s 1;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
} 

#success {
	display: none;
	min-width: 340px;
	height: 37px;
	margin-left: 25%;
	text-align: center;
	padding:7px;
	font-size:16px;
	font-weight:bold;
	z-index: 999;
	position: fixed;
	opacity: 0;
	color:white;
	background-color:green;
	border:1px solid white;

	animation:aktionsmeldung 2s 1;
	-webkit-animation:aktionsmeldung 2s 1;
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
} 

@keyframes aktionsmeldung{
	0%   {top: -50px; opacity:0; }
	25%  {top: 30px; opacity:1;}
	75%  {top: 30px; opacity:1;}
	100%  {top: -50px; opacity:0;}
}

@-moz-keyframes aktionsmeldung{
	0%   {top: -50px; opacity:0; }
	25%  {top: 30px; opacity:1;}
	75%  {top: 30px; opacity:1;}
	100%  {top: -50px; opacity:0;}
}

@-webkit-keyframes aktionsmeldung{
	0%   {top: -50px; opacity:0; }
	25%  {top: 30px; opacity:1;}
	75%  {top: 30px; opacity:1;}
	100%  {top: -50px; opacity:0;}
}

/* Bilder per Webcam */
#video {
	width:auto;
	max-width:75vw;
	height:auto;
	max-height: calc(100vh - 150px);
	
}

.video{
	height:90vh; 
	position: relative;
}

.videoSource {
	background-color:white;
	padding:10px;
	font-size:30px;
}

.screenshot {
	display:block;
	width: 100vw;
	border-color: transparent;
	background-color: transparent;
	color: transparent;
	float:right;
}

.save_screenshot {
	width: 100px;
	height: 100px;
	
}

.screenshotImage {
	display:none; 
	width:200px; 
	position: absolute; 
	top:100px; 
	left:40px;
}

.d-none {
	display: none;
}

.videoSource {
	font-size:20px;
	padding:5px;
	background-color:white;
}

.ausloeserLinks {
	color: white;
	font-weight: bold;
	font-size: 60px;
	top: 40vh;
	position: fixed;
	left: 10px;
}

.ausloeserRechts {
	color: white;
	font-weight: bold;
	font-size: 60px;
	top: 40vh;
	position: fixed;
	left: 100px;
}

.button {
	display:block;
	color: black;
	line-height:40px;
	text-align: center;
	width: 150px;
	text-decoration: none;
	border:2px solid #4C729F;
	border-radius: 5px;
	background-color: #FFF;
	font-weight:bold;
	font-size:14px;
	cursor: pointer;
	transition:0.5s;
}

.buttonFiles {
	display:block;
	color: black;
	line-height:30px;
	text-align: center;
	width: 100px;
	text-decoration: none;
	border:2px solid #4C729F;
	border-radius: 5px;
	background-color: #FFF;
	font-weight:bold;
	font-size:14px;
	cursor: pointer;
	margin-top:20px;
	-webkit-appearance: none;
}

.filesLinie {
	border-top:1px dotted black; 
	width:13px; 
	float:left;
	margin-left:-18px;
}



.ImageUploadForm ol {
	padding-left: 1px;
  }

.ImageUploadForm li, .preview > p {
	background: #eee;
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
	list-style-type: none;
	border: 1px solid black;
}

.ImageUploadForm img {
	height: 64px;
	order: 1;
}

.ImageUploadForm p {
	line-height: 32px;
	padding-left: 10px;
}

.ImageUploadForm label, .ImageUploadForm button {
	border:1px solid white; 
	background-color:darkgreen;	
	padding: 10px 15px;
	border-radius: 5px;
	font-size: 14px;
	height: auto;
	color:white;
	font-weight:bold;
	transition:0.5s;
}

.ImageUploadForm label:hover, .ImageUploadForm button:hover {
	background-color: #4C729F;
	color: white;
	transition:0.5s;
}

.ImageUploadForm label:active, .ImageUploadForm button:active {
	background-color: #4C729F;
	color: white;
}

/* ANFANG Aufklapp-Menü für Datei-Browser */
.collapsible {
	cursor: pointer;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
	margin-bottom:-1px;
	margin-top:5px;
	margin-left:-12px;
	font-weight:bold;
	background-color: transparent;
	line-height: 30px;
}
  
.active, .collapsible:hover {
	background-color: transparent;
}

.collapsible:after {
	content: url(../img/icon_folder_closed.png);
	font-weight: bold;
	float:left;
	margin-left: 5px;
}

.active:after {
	content: url(../img/icon_folder_open.png);
}

.content {
	padding: 0 18px;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}

.content:after {
	border-left: 1px;
	border-style: dotted;
}

/* ENDE Aufklapp-Menü für Datei-Browser */

.fade-out {
	animation: fadeOut ease 4s;
	-webkit-animation: fadeOut ease 4s;
	-moz-animation: fadeOut ease 4s;
	-o-animation: fadeOut ease 4s;
	-ms-animation: fadeOut ease 4s;
	opacity:0;
	position:absolute; 
	color:white; 
	font-weight:bold; 
	font-size:50px; 
	text-align:center; 
	top:120px; 
	cursor:pointer; 
	text-shadow: 0 0 5px black;
	width:100%;

  }@keyframes fadeOut {
	0% {
	  opacity:1;
	}
	80% {
		opacity:1;
	}
	100% {
	  opacity:0;
	}
  }
  
  @-moz-keyframes fadeOut {
	0% {
	  opacity:1;
	}
	80% {
		opacity:1;
	}
	100% {
	  opacity:0;
	}
  }
  
  @-webkit-keyframes fadeOut {
	0% {
	  opacity:1;
	}
	80% {
		opacity:1;
	}
	100% {
	  opacity:0;
	}
  }
  
  @-o-keyframes fadeOut {
	0% {
	  opacity:1;
	}
	80% {
		opacity:1;
	}
	100% {
	  opacity:0;
	}
  }
  
  @-ms-keyframes fadeOut {
	0% {
	  opacity:1;
	}
	80% {
		opacity:1;
	}
	100% {
	  opacity:0;
  }
}

  #showVideoError {
	width:500px;  
	display:none;
	  
  }

  #videoErrorText {
	  color:white;
	  padding:20px;
  }

  .btn {
	border: 2px solid #4C729F;
	border-radius: 5px;
	padding-top:5px;
	background-color: #fff;;
	font-weight:bold;
	text-decoration: none;
	font-size: 20px;
	width:40px;
	text-align:center;
  }

  .panelIntern-wrapper {
	position: relative;
  }

  .showIntern, .hideIntern {
	position: absolute;
	z-index: 100;
	top:30px;
  }

  .hideIntern {display: none;}
  .showIntern:target {display: none;}
  .showIntern:target ~ .hideIntern {display: block;}
  .showIntern:target ~ .panelIntern {
	 max-height: 2000px; 
  }
  .showIntern:target ~ .fadeIntern {
	background: transparent;
  }

  .panelIntern {
	position: relative;
	max-height: 100px;
	overflow: hidden;
	transition: max-height .5s ease;
  }
  .fadeIntern {
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 75%);
	height: 100px;
	margin-top: -100px;
	position: relative;
  }

  .panelInfo-wrapper {
	position: relative;
  }

  .showInfo, .hideInfo {
	position: absolute;
	z-index: 100;
	top:30px;
  }
  
  .hideInfo {display: none;}
  .showInfo:target {display: none;}
  .showInfo:target ~ .hideInfo {display: block;}
  .showInfo:target ~ .panelInfo {
	 max-height: 2000px; 
  }
  .showInfo:target ~ .fadeInfo {
	background: transparent;
  }

  .panelInfo {
	position: relative;
	max-height: 100px;
	overflow: hidden;
	transition: max-height .5s ease;
  }
  .fadeInfo {
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 75%);
	height: 100px;
	margin-top: -100px;
	position: relative;
  }