body {font-family: 'Open Sans', sans-serif;
background:#ecf0f1;padding:0;margin:0;

font-weight: 300 !important;
}

a {text-decoration:none}
img {border:0px;}



#logo {float: left;z-index: 5;width: 180px;position: relative;left:5px;}
#logo img {width:160px}

#navi {position:relative;width:100%;min-width:1450px;height:50px;
  background: #0072B5;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.2), 0 0px 2px 0 rgba(0, 0, 0, 0.24);
  margin: auto;color:white;overflow:hidden;}

#menu-c {position: relative;width:100%;margin: auto;}

#navigation {position: relative;margin: auto;z-index: 2;}
#navigation li {float:left;list-style-type:none;top:5px;}
#navigation li a {position:relative;
    color:#e5e5e5;
    list-style-type:none;top:15px; padding:15px 20px 18px 20px;
   -webkit-transition: background 0.5s linear;
        -moz-transition: background 0.5s linear;
        -ms-transition: background 0.5s linear;
        -o-transition: background 0.5s linear;
        transition: background 0.5s linear;
}


#navigation li a:hover, .navigation-select {background:#2980b9;}

#kasselist {padding:0px 5px;}
#kasselist li {list-style-type:none;}
#kasselist li {position:relative; margin:4px 0px;padding:4px 5px; cursor:pointer;background:#666666;color:#f4f4f4; font-size:15px;}
#kasselist li:hover {background:#8C8C8C;}
#kasselist li div {position:absolute;right:15px;top:4px;}

#sub-navi {position:relative;width:100%;min-width:1450px;height:26px;background: #f4f6fb;margin: auto;color:#e5e5e5;}

#sub-navigation {position: relative;margin: auto;z-index: 2;left:-40px;}
#sub-navigation li {float:left;list-style-type:none;}
#sub-navigation li a {position:relative;color:#3f3f3f;list-style-type:none;top:3px; padding:5px 10px 5px 10px;
   -webkit-transition: background 0.5s linear;
        -moz-transition: background 0.5s linear;
        -ms-transition: background 0.5s linear;
        -o-transition: background 0.5s linear;
        transition: background 0.5s linear;
font-size:13px;
background:#c5c5c5;
}

#sub-sub-navi {position: relative;left:-45px;margin: auto;z-index: 2;}
#sub-sub-navi li {float:left;list-style-type:none;margin:6px 0px;}
#sub-sub-navi li a {position:relative;list-style-type:none;top:3px; padding:5px 10px 5px 10px;
   -webkit-transition: background 0.5s linear;
        -moz-transition: background 0.5s linear;
        -ms-transition: background 0.5s linear;
        -o-transition: background 0.5s linear;
        transition: background 0.5s linear;
font-size:13px;
border:1px solid #1652a4; background:#0072B5;
color:#e5e5e5;

}

.content-tab {}

#sub-sub-navi li a:hover, li a.sub-sub-navi-selected  {background:#1652a4;color:#e5e5e5}

#sub-navigation a:hover, .sub-navigation-select {background:#9e9e9e;}

#body {width: 1290px;margin: auto;position: relative;background: white;padding:10px 10px 50px 10px;font-size:13px;
min-height: calc(100vh - 120px); ;
  }

.clear {clear: both;}

h2 {font-size:14px;font-weight:bold;border-bottom:1px solid #ebebeb}


.box {
	width:720px;

	padding:5px;
	border-radius:1px;
	box-shadow: 0 0 5px rgba(102, 179, 251, 0.5);
}

.box h3 {margin:0;margin-bottom:4px;padding:6px 8px 6px 5px;width:98%;border-radius:2px;background:#0072B5;color:#f0f0f0;font-size:13px;letter-spacing:1px;}
.box h3 a {color:white;}

.button {
font-size:12px;
width:100px;
text-align:center;
padding:15px 30px;
background-color:#1652a4;
position:relative;
margin:5px;
float:left;
box-align:center;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
cursor:url(cursor1.cur),pointer;
color:#FFFFFF;
}

.input-select {width:200px;}

input:-moz-read-only { /* For Firefox */
  /*background-color: #e4e1e1; color:#403e3e;*/
}

input:read-only {
  /*background-color: #a3a5a7;color:#e4e1e1;*/
}

 
.submit-button, .submit-button-next,.submit-button-next-red, .submit-button-cancel, .submit-button-big, .submit-button-sgreen, .submit-button-sred {background:#7bed9f; box-shadow: 0 0 5px rgba(102, 179, 251, 0.5);text-transform:uppercase;border:0px; padding:6px 15px;cursor:pointer;border-radius:1px;}
.submit-button:hover, .submit-button-next:hover, .submit-button-cancel:hover, .submit-button-big:hover,.submit-button-next-red:hover  { box-shadow: 0 0 5px #1f1f1f;}

.submit-button-next,.submit-button-next-red {width:695px; background-color:rgb(38, 222, 129);color:#fcfcfc;font-size:15px;margin-top:3px;}

.submit-button-next-red {background:#e74c3c;}

.submit-button-cancel {background:#e32645;color:#f3f3f3;}

.submit-button-sgreen, .submit-button-sred {color:white;font-weight:bold;font-size:14px;border:0;}
.submit-button-sgreen {background:#2ecc71}
.submit-button-sred {background:#e74c3c;}

.input-text {
  box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -webkit-transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  border: solid 1px #ddd;
  padding:6px 2px 6px 5px;
  outline:none;
  width:190px;
}
.input-text:focus {border:1px solid #0072B5;}

/*
.error {padding:3px 5px; border:1px solid red; color:red;width:650px;font-size:14px;margin-left:5px;}
*/
.error {
  position: fixed;
    top: 0;
    left: 0;
display:block;
  z-index:1000;padding:15px 5px; border:1px solid red;background:#ff7675; color:white;width:100%; text-align:center;font-size:16px;
}



.success {padding:3px 5px; border:1px solid #28b621; color:#28b621;width:810px;margin-left:15px;margin-bottom:5px;}

#print {background:white;font-size:13px;}

#print-page {position:relative;margin:auto;width:100%;padding:5px;}

.print-box1 {border:1px solid #c4c4c4;padding:5px;border-radius:5px;margin:5px;}

.print-box {font-size:12px}

.print-box h3 {font-size:13px;margin:3px 0px;padding:2px 3px;width:98%;box-shadow: inset 0 0 0 1000px #0072B5; color:white;}

.print-box1, .print-box1 h1 {font-size:17px;}
.print-box1 h2, .print-box h2 {margin:2px 0px 2px 0px;padding:0;}


.table-noborder tr, .table-noborder td, .table-noborder {border:0 !important;}

.table {width:900px;left:10px;position:relative;}

.table td, .table th , .tablebenutzer td, .tablebenutzer th, .table-small td, .table-small th, .table-big td, .table-big th {
    font-size: 13px;
    border: 1px solid #19447E;
    padding: 3px 7px 2px 7px;
}

.table th, .tablebenutzer th, .table-small th, .table-big th {
    font-size: 15px;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 4px;
    background-color: #218cde;
    color: #ffffff;
}

.table tr.alt td, .tablebenutzer tr.alt td, .table-small tr.alt td , .table-big tr.alt td{
    color: #000000;padding:2px 0px;
    background-color: #EAF2D3;
}

.tablebenutzer {width:650px;}
.table-small {width:670px;}
.table-big {}

td h2 {margin:0;}



.tablecolor {border:1px solid #e0e0e0;color:#262626; font-size:14px;}
.tablecolor tr:nth-child(even) {background: #f9f9f9;}
.tablecolor tr:nth-child(odd) {background: #f2f2f2;}

#cartDiv {position:absolute;left:300px;top:200px;width:400px;height:180px;background:#f9f9f9; box-shadow:0px 0px 10px #414141;border-radius:3px;padding:5px;font-size:15px;z-index:100;border:1px solid #414141}


#delete-box {margin:auto;position:relative;width:390px;text-align:center;font-size:15px;}
.deletebutton {background:#1652a4;position:relative;padding:10px 20px;margin:10px 0px; color:white;border-radius:3px;}

.small {font-size:10px;text-align:right;position:absolute;right:2px;top:2px;}

.red {color:red;font-size:12px;}

.ui-datepicker-trigger {position:relative;top:10px;overflow:hidden;width:32px; height:29px;margin-top:-10px;}

#ui-datepicker-div { font-size:11px; }

.ui-widget-header {background:#3f9ee7 !important;}

.width-button a {position:relative;top:2px;background:#0072B5; opacity:0.7;color:white;width:140px;height:22px;padding-top:3px;display:block;text-align:center;margin:auto;}



.width-button a:hover {opacity:1;
	 -webkit-transition: opacity 0.5s linear;
        -moz-transition: opacity 0.5s linear;
        -ms-transition: opacity 0.5s linear;
        -o-transition: opacity 0.5s linear;
        transition: opacity 0.5s linear;

	}


/* Liegeplatz Map */
.liege-map {position:relative;min-width:1250px;margin-bottom:10px;min-height:400px;background: #68aada;border-radius:3px;}

.table-double td {padding-right:30px;}

table.table-double {margin-bottom:10px;}



.map-steg, .map-steg-double {position:relative;opacity:0.9;margin:75px 0px;top:30px; background: #b6895e;height:20px;color:#f6f6f6;border-radius:2px;border:1px solid #b38456;}
.map-steg:hover, .map-steg-double:hover {
	border:1px solid #f1f1f1;
	opacity:1;
	 -webkit-transition: opacity 0.5s linear;
        -moz-transition: opacity 0.5s linear;
        -ms-transition: opacity 0.5s linear;
        -o-transition: opacity 0.5s linear;
        transition: opacity 0.5s linear;
	}

.map-steg span, .map-steg-double span{position:relative;top:0px;padding-left:10px;font-size:14px;}

.map-steg-double {margin:15px 0px;}

.map-steg-platz, .map-steg-platz-top, .map-steg-platz-bottom {position:relative;margin:0;top:-19px;left:-30px;list-style:none; font-size:10.5px;}
.map-steg-platz li, .map-steg-platz-top li, .map-steg-platz-bottom li {
	/*width:15px;*/
	position:relative;padding:2px 5px; color:white; float:left; margin:0px 3px;
	border-radius:3px;

}
.map-steg-platz li:hover, .map-steg-platz-top li:hover, .map-steg-platz-bottom li:hover {border:1px solid #f1f1f1;}

.map-steg {left:3px;}

.map-steg-platz {top:-19px;left:20px;}

.map-steg-platz-top {top:-43px;}

.map-steg-platz-bottom {top:-16px;}

.clear {clear:both;}

.steg-platz-green {background:#4dd31f; border:1px solid #46bd1d;}
.steg-platz-green:hover, .steg-platz-greena:hover, .steg-platz-red3 {background:#54e123;}
.steg-platz-yellowa:hover, .steg-platz-yellowaa:hover, .steg-platz-yellow:hover {background:#ffe618;}
.steg-platz-red2:hover {background:#ff2525}
.steg-platz-red:hover {background:#eeaf07;}

.steg-platz-verein {background:#de06e9;border:1px solid #990ba1}
.steg-platz-verein:hover {background:#990ba1;}

.steg-platz-frei {background:#477935;border:1px solid #5ea047}
.steg-platz-frei:hover {background:#46bd1d;}

.steg-platz-greena {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4dd31f+0,4dd31f+40,ffffff+50,4dd31f+62,4dd31f+100 */
	background: #4dd31f; /* Old browsers */
	background: -moz-linear-gradient(top,  #4dd31f 0%, #4dd31f 40%, #db2323 50%, #4dd31f 62%, #4dd31f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #4dd31f 0%,#4dd31f 40%,#db2323 50%,#4dd31f 62%,#4dd31f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #4dd31f 0%,#4dd31f 40%,#db2323 50%,#4dd31f 62%,#4dd31f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dd31f', endColorstr='#4dd31f',GradientType=0 ); /* IE6-9 */
}


.steg-platz-red3 {
  border:1px solid #46bd1d;
  position: relative;
}

.steg-platz-red3:hover::before, .steg-platz-red3:hover::after{
  opacity: 0.2;
}

.steg-platz-red3:before, .steg-platz-red3:after {

  position: absolute;
  left: 9px;top:-2px;
  content: ' ';
  height: 20px;
  width: 2px;
  background-color: red;
  opacity: 0.7;
}
.steg-platz-red3:before {
  transform: rotate(45deg);
}
.steg-platz-red3:after {
  transform: rotate(-45deg);
}

li.steg-platz-greena {color:white;font-weight:bold;}

.steg-platz-yellowa {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eee607+39,4dd31f+53,eee607+66 */
	background: #e7d118; /* Old browsers */
	background: -moz-linear-gradient(top,  #eee607 39%, #4dd31f 53%, #eee607 66%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #eee607 39%,#4dd31f 53%,#eee607 66%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #e7d118 39%,#4dd31f 53%,#e7d118 66%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eee607', endColorstr='#eee607',GradientType=0 ); /* IE6-9 */
}

.steg-platz-yellowaa {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eee607+20,4dd31f+30,eee607+42,eee607+61,4dd31f+69,4dd31f+74,eee607+80,eee607+80,eee607+90 */
	background: #e7d118; /* Old browsers */
	background: -moz-linear-gradient(top,  #eee607 20%, #4dd31f 30%, #eee607 42%, #eee607 61%, #4dd31f 69%, #4dd31f 74%, #eee607 80%, #eee607 80%, #eee607 90%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #eee607 20%,#4dd31f 30%,#eee607 42%,#eee607 61%,#4dd31f 69%,#4dd31f 74%,#eee607 80%,#eee607 80%,#eee607 90%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #eee607 20%,#4dd31f 30%,#eee607 42%,#eee607 61%,#4dd31f 69%,#4dd31f 74%,#eee607 80%,#eee607 80%,#eee607 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eee607', endColorstr='#eee607',GradientType=0 ); /* IE6-9 */
}


.steg-platz-yellow {background:#e7d118; border:1px solid #eee607;}
.steg-platz-red {background:#ee8407; border:1px solid #ee4807;}
.steg-platz-red2 {background:#c80505; border:1px solid #c80505;}

.greenpoint, .redpoint, .yellowpoint {font-size:26px;position:relative;top:-2px;}

.greenpoint {color:#4dd31f;}
.redpoint {color:#ee4807;}
.yellowpoint {color:#eee607;}

.ui-button-text-only, .ui-button-text  {padding:1px 10px;}



 .arrow {
   width: 70px;
   height: 16px;
   overflow: hidden;
   position: absolute;
   left: 50%;
   margin-left: -35px;
   bottom: -16px;

 }
 .arrow.top {
   top: -16px;
   bottom: auto;
 }
 .arrow.left {
   left: 20%;
 }
 .arrow:after {
   content: "";
   position: absolute;
   left: 20px;
   top: -20px;
   width: 25px;
   height: 25px;
   box-shadow: 6px 5px 9px -9px black;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);

 }
 .arrow.top:after {
   bottom: -20px;
   top: auto;
 }

 a.edit-button,  a.edit-button2, a.edit-button-green, input.edit-button2, a.edit-button-details,input.edit-button-details {
   text-transform:uppercase;font-size:11px;padding:1px 5px;background:#f3f3f3;
   color:#5e5e5e;border:1px solid #a0a0a0;border-radius:3px;margin:2px 0px;cursor:pointer
  }
  
 a.edit-button:hover,  a.edit-button2:hover, , a.edit-button-details:hover,input.edit-button2:hover {background:#e7e7e7;}

 .box table td {
	background-color: #f5f6fa;
	margin:4px;
	position:relative;
	border:1px solid #e2e4ec;
  font-size:12px;
	color: #353b48;
	padding:3px 5px;
  line-height: 1.5;
}

.list-table tr {cursor:pointer;}
.list-table td:hover {background:#b2b2b2;}

a.edit-button-green {background:#2ecc71;color:#ecf0f1}
a.edit-button-green:hover {background:#27ae60;}


.box table.list-table tr td, .box table .list-table tr th {
	background:#f4f4f4;margin:0px;border:0px;border-bottom:1px solid #0072B5;padding:2px 0px;
}

.box table.list-table tr:hover td{background:#accefc;}

/* input[type='checkbox'] {
    -webkit-appearance:none;
    width:20px;
    height:20px;
    background:#f5f5f5;
    border-radius:3px;
    border:1px solid #cdcdcd;
	margin:0px;
	outline:none;
	box-shadow:0px 0px 1px #cdcdcd;
	cursor:pointer;
}
input[type='checkbox']:hover {
    background: #7ec4f4;box-shadow:0px 0px 1px #7ec4f4;
}

input[type='checkbox']:checked {
    background: #0d92ef;
} */

input[type=checkbox] {
  position: relative;
	border: 2px solid #0d92ef;
	border-radius: 2px;
	background: none;
	cursor: pointer;
	line-height: 0;
	margin: 0 2px 0 0;
	outline: 0;
	padding: 0 !important;
	vertical-align: text-middle;
	height: 20px;
	width: 20px;
	-webkit-appearance: none;
  opacity: .5;
}

input[type=checkbox]:hover {
  opacity: 1;
}

input[type=checkbox]:checked {
  background-color: #0d92ef;
  opacity: 1;
}

input[type=checkbox]:before {
  content: '';
  position: absolute;
  right: 50%;
  top: 50%;
  width: 4px;
  height: 10px;
  border: solid #FFF;
  border-width: 0 2px 2px 0;
  margin: -1px -1px 0 -1px;
  transform: rotate(45deg) translate(-50%, -50%);
  z-index: 2;
}


.smallCheckbox input[type='checkbox'] {
  width:15px;
  height:15px;
  vertical-align: middle;
}

.smallCheckbox input[type=checkbox]:before {

  width: 3px;
  height: 8px;

}



#edit-box {}


#edit-box table {border:1px solid #e4e4e4;}

#edit-box .box {background:#f7f7f7; border-radius:1px;margin:10px;position:relative;box-shadow: 0 0 1px black;}

#edit-box .box h2 {background:white;padding:7px 3px;margin-top:1px;color:#1652a4;}

.ui-dialog .ui-dialog-content, .ui-dialog-content, .ui-dialog  {padding:0;}

#somediv #somediv2 {padding:0px;background:#F1F1EC;}

#thedialog #thedialog2 {background:#F1F1EC;}



#edit-box2 table {border-bottom:1px solid #e4e4e4;}

#edit-box2 table {border:1px solid #e4e4e4;}


#edit-box2 .box {border-radius:3px;margin:10px;position:relative;box-shadow:0px 0px 3px #0d0d0d;}

#edit-box table td {margin:0px;border:0px;padding-left:5px;
	background-color:#fdfdfd;padding:6px 10px;border-bottom:1px solid #e4e4e4;
}

#edit-box2 .box h2 {background:#ececec;padding:7px 3px;margin-top:1px;color:#1652a4;opacity:1;}

#edit-box .submit-button {
background:#f3f3f3;color:#5e5e5e;border:1px solid #a0a0a0;
}

#edit-box2 table td {background-color:#fdfdfd;}

#edit-box .submit-button:hover {background:#e3e3e3}

a.submit-button-big {color:#696969;padding:6px 273px;font-size:16px;}

.map-steg span.steg-right {position:absolute;left:85%;top:0px;}

page {
  background: white;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5cm;
  /**box-shadow: 0 0 0.5cm rgba(0,0,0,0.5);**/
}
page[size="A4"] {
  width: 21cm;
  height: 29.7cm;
}




#sub-navigation li a.greenbg {background:#8bea6ab3;}

#sub-navigation li a.redbg {background:#ff7675c7;}

#sub-navigation li a.greenbg:hover {background:#6bd546;}

#sub-navigation li a.redbg:hover {background:#c9544b;}


.ui-dialog-titlebar-close {padding:2px 10px;}

.button-save {
	outline:none;cursor:pointer; margin:10px 0px; padding:20px 15px; border:1px solid #808080;background:#f3f3f3;
	border-radius:2px;color:white;font-size:15px;color:black;
}

label {cursor:pointer;}

.input-radio {position:relative;top:2px;padding-left:3px;}

ul, li{list-style:none;}

#radiofloat {clear:both;margin:0;padding:0;}
#radiofloat li {float:left;padding:2px;padding-right:5px; margin:2px;}
#radiofloat li:hover {background:#d3d3d3;}



#wrapper-booking {
	width:97%;
	margin:auto;
}

#wrapper-booking .box {
	width:98%;
}

#wrapper-booking #edit-box table td, #wrapper-booking .input-text, #wrapper-booking .box,#wrapper-booking .edit-button{
	font-size:16px;
}

#wrapper-booking .submit-button-next {
	width:100%;
}

#wrapper-booking .input-text {
	font-size:16px;
}

#wrapper-booking .edit-button {
	padding:10px 30px;
	margin:5px;
}

#wrapper-booking .submit-button, #wrapper-booking .submit-button-cancel	{
	font-size:15px;
}

#wrapper-booking .submit-button-cancel {
	float:right;
}

.clear {clear:both;}


#how-to{text-align: left;word-wrap:break-word;width:1000px;font-size:14pt;margin: 0 auto;}


.result-box, .result-box-big {position:relative;top:-16px;left:2px;width:240px;background:white;display:none;border-radius: 3px;}
.result-box-big {width:99%}
ul.search-results {margin:0;padding:0;list-style:none;}

.search-results li {padding:5px 10px;background:white;color:black;border-bottom:1px solid #c0d9ea;}

.search-results li:hover {background:#3498db;color:white;}

* {  -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;

   -webkit-transition: all .1s linear 0;
 -moz-transition: all .1s linear 0;
 transition: all .1s linear 0;

}


@media print {
    .submit-button-sred {
        background-color: #e74c3c !important;
        -webkit-print-color-adjust: exact;
    }

    .submit-button-sgreen {
        background-color: #2ecc71 !important;
        -webkit-print-color-adjust: exact;
    }
}

@media print {
    .submit-button-sred th {

    }
}



nav {
	z-index:5;
	float: left;
	padding: 5px;

}
#menu-icon {

	display:inline-block;
	width: 40px;
	height: 40px;
}

a#menu-icon {
  color:white;
  font-size:25px;
  padding-left:5px;
  padding-top:6px;
}

a:hover#menu-icon {

	color: rgb(172, 172, 172);


}
	nav ul, nav:active ul {
		z-index:99;
		display: none;
		position: absolute;
		padding: 2px;
		background: #0073b5c8;
		width: 300px;
    height: 100vh;
		left:0px;
		margin-top:4px;
    -webkit-transition: all 0.5s linear;
       -moz-transition: all 0.5s linear;
       -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
       transition: all 0.5s linear;
	}

	nav li {
    margin-left:-5px;
		z-index:5;
		text-align: left;
		width: 100%;
		padding: 10px 0;
		margin: 0;

	}

	nav:hover ul {
		z-index:5;
		display: block;

	}
	nav li a {
	    color: #e5e5e5;
	    list-style-type: none;
	    padding: 4px 25px;
	    -webkit-transition: background 0.5s linear;
	    -moz-transition: background 0.5s linear;
	    -ms-transition: background 0.5s linear;
	    -o-transition: background 0.5s linear;
	    transition: background 0.5s linear;
	}

  .wlan {
    width:70%;margin:0 auto;padding:8px 10px;border-radius:5px;border:1px solid #8a8989;
    position: relative;font-size:17px;margin-bottom:5px;
  }

  .wlan img {position:absolute;width:25%;right:10px;top:2px;opacity:0.6}

  .dropzone {
    min-height:0px !important;width:97%;border-radius:5px;box-shadow: 0px 0px 1px #95a5a6;border:0px !important;
    background-color: #ecf0f1;
    -webkit-transition: background 0.5s linear;
         -moz-transition: background 0.5s linear;
         -ms-transition: background 0.5s linear;
         -o-transition: background 0.5s linear;
         transition: background 0.5s linear;
  }
  .dropzone:hover {
    background-color:#2ecc71; color:#ecf0f1;
    -webkit-transition: background 0.5s linear;
         -moz-transition: background 0.5s linear;
         -ms-transition: background 0.5s linear;
         -o-transition: background 0.5s linear;
         transition: background 0.5s linear;
  }

.table-files a {
    color:#3498db !important;
    padding:2px 10px;
  }

.table-files a:hover {
  color: #0072B5 !important;
  -webkit-transition: all 0.5s linear;
       -moz-transition: all 0.5s linear;
       -ms-transition: all 0.5s linear;
       -o-transition: all 0.5s linear;
       transition: all 0.5s linear;
    }


  .verdachtButton span, .sperrenButton span { position:relative;left:7px;top:-1px;}
  .verdachtButton, .sperrenButton {
    width:200px;position: relative;top:-4px;
    background:#f5f6fa;
    padding:5px 25px;
    border-radius:2px;

    color:#2c3e50;
    -webkit-transition: all 0.2s linear;
         -moz-transition: all 0.2s linear;
         -ms-transition: all 0.2s linear;
         -o-transition: all 0.2s linear;
         transition: all 0.2s linear;
  }

  .verdachtButton.active {
      box-shadow: 0px 0px 0px 2px #f1c40f;
      color:#f1c40f;
  }

  .verdachtButton::before, .sperrenButton::before {content:'■';position: relative;right:10px;top:2px;font-size:22px;}

  .sperrenButton.active {
      box-shadow: 0px 0px 0px 2px #e74c3c;
      color:#e74c3c;
  }


  .ui-tooltip {font-size:13px !important;border:1px solid #dcdde1;background:#f5f6fa}

  .ui-tooltip {position:fixed !important ;top:20%;margin:0 auto;}

  .chooseButtonsBo2x button {
    font-size:12px;
    cursor:pointer;position: relative;
    border-radius:3px;
    border:1px solid #4283dc;
    background:#f7f7f7;
    height:60px;width:80px;text-align:center;
    text-transform:uppercase;
    color:#4283dc;
    word-wrap: break-word;
    -webkit-transition: all 0.2s linear;
         -moz-transition: all 0.2s linear;
         -ms-transition: all 0.2s linear;
         -o-transition: all 0.2s linear;
         transition: all 0.2s linear;
     outline:none;
  }

  .chooseButtonsBox button {
    cursor:pointer;
    height:60px;width:80px;

    position: relative;
    display: inline-block;

    background-color: #fff;
    font-size: 12px;
    line-height: 120%;
    outline:none;
    text-transform:uppercase;
    text-align: center;
    word-wrap: break-word;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    -webkit-transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
    transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
    border: solid 1px #ddd;
  }

    .chooseButtonsBox button:hover, .chooseButtonsBox .active {
      background-color: #4b9dea;
      color: #fff;
      box-shadow: 0 0 5px rgba(102, 179, 251, 0.5);
      border-color: #4b9dea;
    }

    #customDatum {
      border-radius:1px;
      margin:0 auto;
      background:#f7f7f7;
      margin:5px 1px;
      width:240px;
      padding:4px;
    }

    #customDatum span {position: relative;width:30px;float:left;top:5px;}


.fieldset {position: relative;width:150px;height:40px;background:#2980b9;border-radius:5px;border:1px solid #3474cefa; color:#f5f6fa;left:5px;top: 5px;font-size:14px;}
.fieldset span {font-size:10px;position: absolute;left:10px;top:2px;}

#printMessage, #printMessage2 {
  position: fixed;
  top:10px;
  right:20px;
  width:400px;
  height:80px;
  background:#5a98f1;color:#f7f7f7;
  border-radius:5px;
  text-align:left;
  opacity:0.95;
  padding:10px 10px;
  z-index: 99999;
  box-shadow:0px 0px 5px #636e72;
}


#printMessageLocal {
  position: fixed;
  top:10px;
  right:20px;
  width:400px;
  height:100%;
  display: block;
  z-index: 99999;

}

.loadingSVG {
  position: absolute;right:2px;top:2px;
}

#printMessage2 {
  top:90px;
}

.druckvorschau {
  width:70%;
  margin:0 auto;

  top:10px;margin-bottom:10px;
  position: relative;
  box-shadow:0px 0px 5px #636e72;
}



.ui-widget-content {
    background: #F9F9F9;
    border: 0 !important;
    color: #222222;
    box-shadow:0px 0px 5px #636e72;
    border-radius:2px !important;
}

.ui-dialog {
    left: 0;
    outline: 0 none !important;
    padding: 0 !important;
    position: absolute;
    top: 0;
}

.ui-dialog .ui-dialog-content {
    background: none repeat scroll 0 0 transparent !important;
    border: 0 none !important;
    overflow: auto;
    position: relative;
    padding: 0 !important;
}

.ui-widget-header {

    border: 0 !important;
    border-radius:2px !important;
    box-shadow:0px 0px 2px #636e72;
    color:#f5f6fa !important;

}

.ui-dialog .ui-dialog-titlebar {
      color:#f5f6fa !important;
}

.VRPayBox {
  width:100%;background:#f5f6fa;border-top:2px solid #353b48;border-bottom:2px solid #353b48;padding:5px;margin-bottom:10px;
}

.wpwl-form {background:#f8f8f8}
.wpwl-label-brand {display:none}
.wpwl-form-card { background: #f8f8f8; border:0px}
.wpwl-control, input.wpwl-control{
    background: white;
    border: 1px solid #ddd;
    box-shadow: none;
    border-radius: 0px;
    font-family:"ff-good-headline-web-pro-con", "Pathway Gothic One", sans-serif;
    text-transform:none;
    padding:10px;
    font-size: 18px;
    height: 50px;
}
.input-text:focus, input[type=text]:focus, input[type=tel]:focus, input[type=url]:focus, input[type=password]:focus, input[type=search]:focus, textarea:focus {background-color: white;}
.wpwl-brand-SOFORTUEBERWEISUNG, .wpwl-brand-GIROPAY{cursor:pointer}
.wpwl-brand, .wpwl-img { margin: 0 0 0 auto;}




#changeKurabgabe {
  width:150px;
  position:absolute;
  right:7px;top:4px;
  text-transform:uppercase;
  text-align:center;
  font-size:12px !important;
}


/* TOGGLE STYLING */
.toggle {
  margin: 0 0 0;
  box-sizing: border-box;
  font-size: 0;
  /* display: -webkit-box;
  display: flex; */
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-flow: row nowrap;
  -webkit-box-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
          align-items: stretch;

  max-width: 99%;
}
.toggle input {
  width: 0;
  height: 0;
  position: absolute;
  left: -9999px;
}
.toggle input + label {
  float: left;
  margin: 0;
  padding: 0.75rem 1.5rem;
  /* box-sizing: border-box;
  display: inline-block; */
  position: relative;

  border: solid 1px #ddd;
  background-color: #fff;
  font-size: 12px;
  line-height: 120%;
  font-weight: 600;
  text-align: center;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -webkit-transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  /* ADD THESE PROPERTIES TO SWITCH FROM AUTO WIDTH TO FULL WIDTH */
  /*flex: 0 0 50%; display: flex; justify-content: center; align-items: center;*/
  /* ----- */
}
.toggle input + label:first-of-type {
  border-radius: 6px 0 0 6px;
  border-right: none;
}
.toggle input + label:last-of-type {
  border-radius: 0 6px 6px 0;
  border-left: none;
}
.toggle input:hover + label {
  border-color: #213140;
}
.toggle input:checked + label {
  background-color: #4b9dea;
  color: #fff;
  box-shadow: 0 0 5px rgba(102, 179, 251, 0.5);
  border-color: #4b9dea;
  z-index: 1;
}
.toggle input:focus + label {
  outline: dotted 1px #ccc;
  outline-offset: 0.45rem;
}
@media (max-width: 800px) {
  .toggle input + label {
    /* padding: 0.75rem 0.25rem; */
    -webkit-box-flex: 0;
            flex: 0 0 50%;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: center;
  }
}

.icons {
  font-size:18px;top:2px;position: relative; color:#4b9dea;background:#fff;padding:4px 5px 5px 5px;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -webkit-transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  border: solid 1px #ddd;
}

.icons:hover {
  background:#4b9dea;color:white;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -webkit-transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
}

.inputSelected {
  background:#4b9dea; color:white;opacity:0.9;
}


.tse_box {
  position: relative;
  width:95%;
  font-size:8pt;
   overflow-wrap: break-word;
}


.login-box {
  margin:10px auto;position:relative;width:50%;background:#f5f6fa;padding:20px;border:1px solid #dcdde1;
}


.wrapper:before {
    font-family: 'FontAwesome';
    color:red;
    position: relative;
    left: -10px;
    content: "\f007";
}

@import url(https://fonts.googleapis.com/css?family=Roboto:300);

.login-page {
  width: 360px;
  padding: 8% 0 0;
  margin: auto;
}
.form {
  position: relative;
  z-index: 1;
  background: #0097e6;
  max-width: 360px;
  margin: 0 auto 100px;
  padding: 45px;
  text-align: center;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.form input {
  font-family: "Roboto", sans-serif;
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  box-sizing: border-box;
  font-size: 14px;
}
.form button {
  font-family: "Roboto", sans-serif;
  text-transform: uppercase;
  outline: 0;
  background: #4CAF50;
  width: 100%;
  border: 0;
  padding: 15px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form button:hover,.form button:active,.form button:focus {
  background: #43A047;
}
.form .message {
  margin: 15px 0 0;
  color: #b3b3b3;
  font-size: 12px;
}
.form .message a {
  color: #4CAF50;
  text-decoration: none;
}
.form .register-form {
  display: none;
}
.container {
  position: relative;
  z-index: 1;
  max-width: 300px;
  margin: 0 auto;
}
.container:before, .container:after {
  content: "";
  display: block;
  clear: both;
}
.container .info {
  margin: 50px auto;
  text-align: center;
}
.container .info h1 {
  margin: 0 0 15px;
  padding: 0;
  font-size: 36px;
  font-weight: 300;
  color: #1a1a1a;
}
.container .info span {
  color: #4d4d4d;
  font-size: 12px;
}
.container .info span a {
  color: #000000;
  text-decoration: none;
}
.container .info span .fa {
  color: #EF3B3A;
}

footer {
  clear: both;
      position: relative;


  text-align:center;
  background:#0070b7a6;
  padding:10px;
  min-height:20px;
  font-size:12px;
  color:white;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.2), 0 0px 2px 0 rgba(0, 0, 0, 0.24);
}

footer a {color:white;text-transform:uppercase;font-size:11px;}
footer a:hover {color:#88cefb;}

.Boxen {width:90%;}
.Boxen .small-box {
  cursor:pointer;
  height:60px;width:40%;
  position: relative;
  display: inline-block;
  background-color: #fff;
  font-weight:bold;
  font-size: 12px;
  line-height: 1.9;
  outline:none;
  text-transform:uppercase;
  text-align: center;
  word-wrap: break-word;margin: 2px 2px;
  box-shadow: 0 0 0 rgba(255, 255, 255, 0);
  -webkit-transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  transition: border-color 0.15s ease-out, color 0.25s ease-out, background-color 0.15s ease-out, box-shadow 0.15s ease-out;
  border: solid 1px #ddd;
}

.small-box input {width:65px;}

.Boxen .small-box:hover, .Boxen .small-box .active {
    background-color: #4b9dea;
    color: #fff;
    box-shadow: 0 0 5px rgba(102, 179, 251, 0.5);
    border-color: #4b9dea;
  }


.m-signature-pad--body canvas, .m-signature-pad--body-noinfo canvas {
      position: relative;
      left: 0;
      top: 0;
      width: 100%;
      height: 250px;
      border: 2px solid #CCCCCC;
  }

  .m-signature-pad--body::before {
      content:'NICHT BEREIT! Maus unter dem Pfeil positionieren!';position:absolute;top:10px;left:10px;color:red;z-index:9;
    }
  .m-signature-pad--body:hover::before {
      content:'BEREIT! Maus unter dem Pfeil positionieren!';position:absolute;top:10px;left:10px;color:#2ecc71;z-index:9;
    }



    .m-signature-pad--body:hover::after, .m-signature-pad--body::after {
        content:'▼';position:absolute;top:25px;left:50px;color:#2ecc71;z-index:9;font-size:25px;
      }

      .m-signature-pad--body::after {
          color:red;
        }

  .m-signature-pad--body canvas:hover {
    border: 2px solid #2ecc71;
  }

  .m-signature-pad {
    position: relative;
    width: 95%;
    height: 250px;
    margin:0 auto;
  }
  .signatur {  margin:0 auto;width:99%;text-align:center;}

.signatur-info {background:#2ecc71;color:white;padding:5px 10px;position: absolute;top:5px;left:5px;z-index:999;cursor:pointer;}

.box-img-bg {
  position:relative;height:100px;width:720px;border:1px solid rgb(209, 209, 209);border-radius: 3px;
  text-align:center;
  background-size: cover; 
  background-position-y: -100px;
}

.center {text-align: center;}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 640px) {

  html,body {
    overflow-x: hidden;
  }

  body {
    width:100% !important;
  }
	 
  #body {
	  margin:0; 
    padding: 0;
	  width:100% !important;
    position: relative;
    min-height: 0;
   
	}

	.footer-links {
		width:100%;
    position: relative;
    margin:0;
    padding:10px 0px;
    min-height:100px;
	}
	.footer-links a {
    
    margin:2px 0px; float:left; width:90%;
	}
}

.legende{
	position: absolute;
    top: -12px;
	padding: 10px;
	right: 4px;
	background-color: #f7f7f7;
	font-size:12px !important;
	font-weight:bold;
	color:#616161;
}

.changezoom{position: -webkit-sticky;
  position:sticky;top:5px;z-index:3;
  margin-bottom: 10px;border-radius:3px;}

.zoom {
  position:sticky;
  font: bold 15px Open Sans;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 6px 21px;

  margin-left: 5px;
}



/* Dropdown Navi */


.menu{
  margin: 0;
  pading: 0;
  position: relative;
  left:-38px;
}

.menu ul{
  margin: 0;
  pading: 0;
  list-style-type: none;
  height: 25px;
  line-height: 25px;
  font-family: 'Open Sans', sans-serif;
}

.menu ul li{
  margin: 0;
  padding: 0;
  float: left;
  position: relative;
}

.menu ul li a{
  margin: 0;
  padding: 0 10px;
  text-decoration: none;

  display: block;
  font-weight: bold;
  font-size: 13px;
  border:1px solid #1652a4; background:#0072B5;
  color:#f9fafb;
  line-height: 30px;
  font-weight: 300;
}

.menu ul li a:hover{
  border:1px solid #1652a4; background:#1287cc;
}


.menu ul li:hover ul{ display:block;}

.menu ul li ul{
  position: absolute;
  left: 0;
  top: 25px;
  display: none;
  padding: 0;
}

.menu ul li ul li{
  z-index: 10;
  padding: 6px 0;
  height: 30px;
  line-height: 30px;
  width: 100%;
}


.panelGrafik {
  position: relative;
  background-image: url(./images/bg_panel_01.jpg);
  background-repeat: no-repeat;
  background-position: top center;
  background-size:180px 200px;
  width: 180px;min-height: 200px;
  overflow: hidden;
  text-align: center;
  margin-bottom:2px;
}
.panelGrafik span{
    width:150px;
    position: absolute;
    top:67px;
    left:15px;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 400;
    background: #efefef;
    height: 93px;
    overflow: hidden;
    color: black;
    box-shadow: 0px 0px 5px black;
}

.info-box i {
  float:left;
  font-size: 40px;
  margin-right:12px;
}
.info-box {
  color:#ffffff;
  
  text-shadow: #000000;
  background-color: #91c5e8;
  border:1px solid #82b0d0;
  width:100%;
  padding:10px 5px;
  margin:10px 0px;
}


.form-control {
  width:100px;
}


.fixedLeft {
  opacity: 0.5;
  position: absolute;
  top:1px;
  left:2px;
  background:#62b7f3;
  color:whitesmoke;
  z-index:9;
  padding:10px 5px;
  box-shadow: 0px 0px 2px black;
}

div.fixedLeft:hover {opacity: 1;}

.fixedLeft i {
  font-size: 24px;position: relative;top:3px;
}

.fixedLeft input {
  color: #1a1a1a;
  background: whitesmoke;
  border-radius: 3px;
}

.fixedLeft .search-go {
  font-size: 24px;position: relative;top:3px;cursor: pointer;
}

.mailAdress {
  width:100px;
  overflow:hidden; 
  white-space:nowrap; 
  text-overflow: ellipsis;
}
.mailAdress a {
  color: #3f3f3f;
}

.mailAdress a:hover {
  color: #8d8a8a;
}

a.noStyle {
  color: #3f3f3f;
}


a.noStyle:hover {
  color: #6e6d6d;
}


.required {
  color:#e74c3c;
}

.page-content footer {
  background: none !important;
  box-shadow: none !important;
}

#gallery {
  width: 100%;
  overflow: scroll;
}
.imgPreview {
  display: inline-block;
  width: 135px;
  height: 110px;
  overflow: hidden;
  cursor: pointer;
  margin-right:2px;
}

.imgPreview img{
  width: 100%;
  height: 100%;
  object-fit: cover;
 }


.addColor-schwarz:before, .addColor-grün:before, .addColor-rot:before, .addColor-blau:before, 
.addColor-gelb:before, .addColor-weiß:before, .addColor-orange:before {
  position: relative;
  left:-4px;
  content:"\00a0"; border-left:4px solid black;
  border-radius:5px;
  margin-right:-5px;
  
  color:rgba(220,160,140,2);
  opacity: 0.8;
}

.addColor-grün:before {
  border-left:4px solid rgb(15, 143, 45);
}

.addColor-rot:before {
  border-left:4px solid rgb(255, 0, 0);
}
.addColor-blau:before {
  border-left:4px solid rgb(16, 45, 234);
}

.addColor-gelb:before {
  border-left:4px solid rgb(242, 242, 8);
}

.addColor-weiß:before {
  border-left:4px solid rgb(241, 243, 241);
}
.addColor-orange:before {
  border-left:4px solid rgb(253, 173, 0);
}