﻿@font-face {
  font-family: 'Lato Regular';
  font-style: normal;
  font-weight: 400;
  src: url('/sys/css/Lato/Lato-Regular.eot'); /* IE9 Compat Modes */
  src: local('Lato Regular'), local('Lato-Regular'),
       url('/sys/css/Lato/Lato-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/sys/css/Lato/Lato-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/sys/css/Lato/Lato-Regular.woff') format('woff'), /* Modern Browsers */
       url('/sys/css/Lato/Lato-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/sys/css/Lato/Lato-Regular.svg#LatoRegular') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Lato Bold';
  font-style:normal;
  font-weight: 700;
  src: url('/sys/css/Lato/Lato-Bold.eot'); /* IE9 Compat Modes */
  src: local('Lato Bold'), local('Lato-Bold'),
       url('/sys/css/Lato/Lato-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/sys/css/Lato/Lato-Bold.woff2') format('woff2'), /* Super Modern Browsers */
       url('/sys/css/Lato/Lato-Bold.woff') format('woff'), /* Modern Browsers */
       url('/sys/css/Lato/Lato-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/sys/css/Lato/Lato-Bold.svg#LatoBold') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Lato Black';
  font-style:normal;
  font-weight: 900;
  src: url('/sys/css/Lato/Lato-Black.eot'); /* IE9 Compat Modes */
  src: local('Lato Black'), local('Lato-Black'),
       url('/sys/css/Lato/Lato-Black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/sys/css/Lato/Lato-Black.woff2') format('woff2'), /* Super Modern Browsers */
       url('/sys/css/Lato/Lato-Black.woff') format('woff'), /* Modern Browsers */
       url('/sys/css/Lato/Lato-Black.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/sys/css/Lato/Lato-Black.svg#LatoBlack') format('svg'); /* Legacy iOS */
}

*, *:before, *:after {
    border-width: 0px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, andere WebKit-Browser */
    -moz-box-sizing: border-box; /* Firefox, andere Gecko-Browser */
    box-sizing: border-box; /* Opera/IE 8+ */
} 
html, body {
    height: 100%; margin:0;
   	background: white;	
	font-size:16px;
	color:#4E4E59;	    
    font-family:Lato Regular;
}


/* Menu */
.mn{  padding: 7px 0 0 0;	height: 40px; font-family:'Lato Bold'; }
.mn-logo{	position:absolute;width:180px;margin-top:2px }
.mn-logo img{ width:100% }
.mn-ham { display:inline-block;position:absolute;right:15px;cursor:pointer;z-index:15; }
.mn.mobil .mn-ham .item {  width: 20px;  height: 3px;  background-color: #333;  margin:4px 0;  transition: 0.4s; }
.mn.mobil.open .mn-ham .item1 { transform: translate(0, 7px) rotate(-45deg); }
.mn.mobil.open .mn-ham .item2 { opacity: 0; }
.mn.mobil.open .mn-ham .item3 { transform: translate(0, -7px) rotate(45deg); }


.mn-content{ position:absolute;z-index:10;margin-top:34px;background:#f7f7f7;width:100%;left:0px;display:none }
.mn.open .mn-content{ display:block }
.mn-item,.mn-drop-caption {  float: none;  color:#4E4E5B;  display: block;  text-align: left;  font-size:16px;      letter-spacing: 1px;  padding: 12px 16px;      border-bottom: 1px silver solid;}
.mn-item a { color:#4E4E5B;  text-decoration: none;  display:block}
.mn-drop-caption a {  color:#4E4E5B;  text-decoration: none;}
.mn-drop-content {  display: none;  position: relative;  background-color: #f9f9f9;  z-index: 1;  margin-top:0px}
.mn-drop.open .mn-drop-content {display:block}
.mn-item:hover,.mn-drop-caption:hover {	cursor:pointer}
.mn-item:hover a, .mn-drop-caption a:hover  {	text-decoration: underline;	text-underline-offset: 0.3em;	text-decoration-thickness:1px;}
.mn-arrow{ position:absolute;right:10px; border: solid #4E4E59;  border-width: 0 3px 3px 0;  display: inline-block;  padding: 4px;  transform: rotate(45deg);  -webkit-transform: rotate(45deg);}
.mn-caption { display:block;background: #efefef;padding:7px 0px;border-bottom: 3px #bbb7b7 solid;  font-size: 15px;font-style: italic; text-align:center }
.mn-back { display:block;padding:7px 5px 7px 25px;cursor:pointer;border-bottom: 2px #bbb7b7 solid; font-size: 14px; font-weight: normal; font-style: italic; }
.mn-back::before{ position:absolute;left:5px;padding-top:1px;font-family: 'IcoFont';font-style:normal; content: "\ea9d"; }

.off { display:none }



@media screen and (min-width: 800px) {
    .mn{ height: 110px;	}
    .mn-logo { width:400px;margin-top:5px }
    .mn-ham,.mn-arrow { display:none; }
	.mn-content{ margin-top:15px;right:0px;background:none;width:auto;left:auto ;display:block }
    .mn-item, .mn-drop{ float:left; text-align: center; border-bottom: none; }
    .mn-drop-content { 	position:absolute;text-align:left;box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); }
    .mn-drop-content .mn-item{ 	float: none;text-align:left}

    .mn-drop-caption{ border-bottom: none; }
    .mn-drop:hover .mn-drop-content{ display:block }
}


#wrapper {
    position: relative;
    min-height: 100%;
    padding-bottom:130px;
}


h1{font-size:20px;font-family: 'Lato Bold'; }
h2{font-size:18px }

.f12 {font-size:12px }
.f14 {font-size:14px }

.bold{ font-weight:bold; }

.mt0 {margin-top:0px}
.mt20 {margin-top:20px}
.mt50 {margin-top:50px}
.mt-admin{margin-top:60px; }
.mt-header{color:white;margin-top :50px;padding:5px;background-color: #c7c5c5; }

.mr20 { margin-right:20px;}

.pd0 { padding:0!important }

.inline { display: inline-block; }
.nowrap { white-space:nowrap; }
.left {	text-align:left; }
.right {	text-align:right; }
.center {	text-align:center; }

.pointer:hover {cursor:pointer;}
.aus { display:none; }
.opac { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5;  opacity: 0.5; }


input[type=text], select, textarea, .sMce { font-family: inherit; font-size:inherit;  border-radius: 5px; width: 100%; padding:6px 9px; background: white; border: 1px solid #dbdbdb;color: black; }
input[type=text]:focus,select:focus, textarea:focus { background: #fff7db;  border: 1px solid #8b8181;color :black; outline-style: none;}


input[type=checkbox] {-webkit-appearance: none; width: 19px; height: 19px; vertical-align:middle; background-image: url("/sys/images/icos/check-leer.png"); background-size: 100%; background-position: right center; background-repeat: no-repeat; border:none; }
input[type=checkbox]:checked { background-image: url("/sys/images/icos/check.png"); }

input.zahl { max-width:100px;text-align:right }
input.DatePicker,input.date {	width:auto;max-width:100px;text-align:center }
input.search{  font-size: 14px!important;  padding:2px 4px 3px 4px!important;  background:white url('/sys/images/icos/search.gif') right center  no-repeat;  max-width:200px;  }

.block{	position:relative;width:100%; max-width:1100px;margin:auto;padding: 0px 15px;}

.flex { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start;  align-items: flex-start; align-content: center; overflow:hidden; gap:50px;	}
.flex-item { flex: 0 1 auto; }

div.resizable {  display:inline-table; }
.div-scroll{	position:relative;display:inline-block;height:auto;overflow:auto;border:1px silver solid }


.modal { display: none;  position: fixed;  z-index: 501; left: 0; top: 0; width: 100%; height: 100%;  overflow: auto;  background-color: rgba(215, 222, 237,0.7); padding-top: 2.5vh;text-align: center;}
.modal-content { background-color: #fefefe;  margin: 0 auto 15% auto;  border: 1px solid #888;  text-align:left;  display:inline-block; box-shadow:6px 6px 8px 0px black; }


/* Table */
table {  color:#3a3a3a;  background-color:white;  border-collapse: collapse;  width: 100%;  vertical-align: middle;}
table th.table-caption { position:relative;background-color:#dbdada;font-size:14px;font-weight:bold;border-bottom:1px silver dotted; padding: 7px 10px; } 
table th { text-align:left;;font-size:13px;font-weight:bold; padding: 4px ;  border: 1px  solid #ccc;  background-color:#ebeaea;  white-space:nowrap;}
table tr.dk th, table tr.dk td { background-color:#dbdada; }
table tbody th { padding: 4px 10px 4px 4px;vertical-align: top;}
table td{   font-size:14px;padding: 3px 4px;text-align: left;  border: 1px  solid #ccc;   vertical-align:top;  height:25px;}
table tr.gray td { 	color:silver;}
table.close .table-content { display:none}
table.fm tbody th{ white-space:nowrap }
table.fm tbody td{ background-color:#ebeaea; ;padding:0;margin:0; width:100% }
table.fm input,table.fm select,table.fm textarea, table.fm .ipa-drop .caption { border:none!important; margin:0px; }
.div-scroll table thead { position:sticky;top:0 }
table.liste tbody tr:hover td {	background-color: #D2E3FF;cursor:pointer}
table.hover tbody tr:hover td {background-color: #D2E3FF;}



/* MSG */
#msg .content {  position: relative;margin: 0 auto 15% auto;  border: 1px solid #888;  text-align:left;  display:inline-block;  box-shadow:6px 6px 8px 0px black;  min-width:600px;  -webkit-animation-name: msg-animate;  -webkit-animation-duration: 0.6s;}
#msg .caption {    padding: 15px 10px;    color: white;    font-weight: bold;    font-size:16px;    background-color:#032c83}
#msg .meldung {    background:white;    padding: 20px 10px;    font-size:15px}
#msg .footer{    text-align: center;    background-color:#032c83;}
@-webkit-keyframes msg-animate { from {top:-300px; opacity:0}  to {top:0; opacity:1} }





.formular .item {margin-bottom:10px }
.formular label{display:block; font-size:12px;}
.label{display:block; font-size:12px;}



    
    












/* ipa-grid */
	
.ipa-grid {display: grid;grid-template-columns: min-content 1fr; gap: 1px;background-color: #ccc; padding: 1px; margin-bottom:30px; position:relative;}
.ipa-grid .item { background-color:#ebeaea;  padding: 0px ;  font-size: 14px;  height:30px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.ipa-grid .item.th {font-size: 13px; padding: 7px 10px 0px 5px;  white-space:nowrap;height:30px; }
.ipa-grid .item.pd { padding: 7px 10px 0px 5px; }
.ipa-grid .caption{ grid-column-start: 1; grid-column-end: 3;background-color:#d9d8d8;font-size:14px;font-weight:bold;height:28px;padding: 5px 10px 0px 5px; }
.ipa-grid .sub-caption{ grid-column-start: 1;grid-column-end: 3;background-color:#d9d8d8;font-size:14px;font-weight:bold;height:28px;padding: 5px 10px 0px 5px; text-align:center; }
.ipa-grid input,.ipa-grid select,.ipa-grid textarea, .ipa-grid .ipa-drop-caption { border-radius: 0px!important;border:0px!important;margin:0px;height:100% }
.ipa-grid .full{ grid-column-start: 1;grid-column-end: 3 }






/* Table Formular */





/* Button*/
.button { display: inline-block;    margin: 10px 20px;      font-size: 15px;    padding: 10px 50px;    border-radius: 6px;    background: #94281e;color:white;}
.button:hover {	cursor:pointer;    background: #edaba5;   color: black;}



.data-vorschau:hover{ color: #eda93d;cursor:pointer }

label.fm {
	font-size:12px;width:100%
}






input.locked, select.locked, textarea.locked,.ipa-drop.locked .ipa-drop-caption { pointer-events:none}
input.lockopac, select.lockopac, textarea.lockopac,.ipa-drop.lockopac.ipa-drop-caption { 	background-color:#f4f4f4;color:silver }
.ipa-grid input.locked, .ipa-grid select.locked, .ipa-grid textarea.locked,.ipa-grid .ipa-drop.locked.ipa-drop-caption { 	background-color:#ebeaea;}



/* Button btn */
.btn { position: relative; background: #dddddd;	color: black;border: none;	font-size: 13px;cursor: pointer;display: inline-block;	margin: 15px 30px;min-width:120px;	letter-spacing: 1px;	  }
.btn:before {position: absolute;height: 100%;left: 0;top: 0; font-family: 'IcoFont';font-style: normal;	font-weight: normal;	font-variant: normal;	-webkit-font-smoothing: antialiased;	line-height: 2; width: 35px;	content: "\ec4b"; }
.btn:after {content: '';	position: absolute;	z-index: -1;	-webkit-transition: all 0.3s;	-moz-transition: all 0.3s;	transition: all 0.3s;}
.btn:hover { background: lime;color:black  }
.btn.del:hover { background: red;color:white  }
.btn.exit:hover { background: #b1afaf;color:white  }

.btn.exit:before {content: "\ef1d"; }
.btn.save:before {content: "\ee00";}
.btn.del:before {content: "\ec53";}
.btn.ok:before {content: "\ec4b"; }

.btn-sep {padding: 6px 10px 6px 45px;Text-align:center }
.btn-sep:before { background: rgba(0,0,0,0.15); }


.isRequired.leer:not(input[type=checkbox]) ,  .isRequired.leer .caption { background:white url('/sys/images/icos/required.png') 2px 2px  no-repeat; }
input[type=text].isRequired:focus,select.isRequired:focus, textarea.isRequired:focus { background: #D2E3FF;  color :black; outline-style: none;}

.isError,isError caption {padding-right:20px!important; background:#ffd4d4 url('/sys/images/icos/achtung.png') right center  no-repeat!important; }
input[type=checkbox].isError { background-image: url("/sys/images/icos/check-error.png")!important; }
input[type=checkbox].isError ~ span { color:red }






/* SANFONA */
.sanfona { position:relative;border: 1px  solid #ccc; ;margin-bottom:20px; }
.sanfona-caption { position:relative;background-color:#dbdada;font-size:14px;font-weight:bold;border-bottom:1px silver dotted;  cursor:pointer;padding: 7px 10px; } 
.sanfona-content { position:relative;padding:6px;min-height:20px;border:1px #dbdada solid;}
.sanfona.close .sanfona-content { display:none}

.sanfona .setIco:after { content : "\eee4" }
.sanfona.close .setIco:after { content : "\efa2" }

.sanfona.admin { border:none;margin:0 }
.sanfona.admin .sanfona-caption {background-color:inherit;padding:7px 15px;font-size:inherit;font-weight: normal;border:none }
.sanfona.admin .sanfona-content {border:none;padding: 8px 0 0 20px; }
.sanfona.admin i { margin-right: 8px; }




 

/* tree */
.tree { display:inline-block;}
.tree ul{position:relative; list-style:none; padding: 0	}
.tree li{ padding:2px 0 0 20px }
.tree ul li > ul {   display:none }
.tree ul li.expand > ul {  display:block }
.tree ul li label{ 	position:relative;display:inline-block;padding:2px 10px 0 20px }
.tree li.file > label:before{   position:absolute;left:0;font-family: 'IcoFont';content: "\eb2a"; }
.tree ul li.folder > label:before{    position:absolute;left:0;font-family: 'IcoFont';content: "\efc0"; }
.tree ul li.folder.expand > label:before{   content: "\ef98"; }
.tree li label:hover{	background:#D2E3FF;cursor:pointer }

/* alert */
.alert { position: relative; font-size: 14px; background: #dddddd;color: black;padding: 10px 20px;border: 1px rgba(0,0,0,0.15) solid;-webkit-transition: all 0.3s;	-moz-transition: all 0.3s;	transition: all 0.3s;   }
.alert.red { background:red;color:white }


/* ipa-drop */
.ipa-drop { position:relative }
.ipa-drop .caption { position:relative;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;cursor:pointer;background:white;width:100%;padding: 4px 8px; border: 1px solid #ccc;; }
.ipa-drop .content {	position:absolute;    background-color: #f3f3f3;border: 1px #dbdada solid;min-width:100%;z-index:10; }
.ipa-drop.close .content {display:none;}
.ipa-drop .content .item { font-size:15px;	padding:4px 10px; border-bottom:1px #bfbfbf dotted;  }
.ipa-drop .content .item:hover{ background-color: #D2E3FF!important;cursor:pointer; }
.ipa-drop.checkbox .content .item{ background-position: 5px;background-image: url('/sys/images/icos/checkLeer.png');background-repeat: no-repeat; background-size: 17px 15px; padding-left: 28px; }
.ipa-drop.checkbox .content .item.checked{ background-position: 5px; background-image: url('/sys/images/icos/checkBlack.png'); background-repeat: no-repeat; background-size: 17px 15px; padding-left: 28px;}

/* IPA-TAB */
.ipa-tab { background: #788497; width: 100%; z-index:99; box-shadow: 0px 2px #8f8989; position: sticky;top: 50px;}
.ipa-tab-items { width: 100%; overflow:hidden; white-space:nowrap;}
.ipa-tab-items .item {position:relative; display: inline-block ; padding:7px 10px;font-weight:bold;font-size:14px; letter-spacing: 1px;color:white;text-shadow: 2px 2px black; }
.ipa-tab-items .item.aktiv{ background-color:#9ea2a9;; }
.ipa-tab-items .item:hover { background-color:#bdbdbd;cursor:pointer;text-shadow: 2px 2px blue	}
.ipa-tab-content { position:relative; display:none;padding:6px;	}
.ipa-tab-content.aktiv { display:block; }
.ipa-tab-content.flex.aktiv { display:flex; }

/* IPA-TABLE */
.ipa-table {
    display: grid;
    grid-template-columns: min-content 1fr;
    gap: 1px;
    background-color: #ccc;
    padding: 1px;
    margin-bottom: 30px;
    position: relative;
    font-size:13px;
    }
    
 .ipa-table .th{   
    background-color: #ebeaea;
    padding: 6px 4px 4px 4px; white-space:nowrap   }

 .ipa-table .td{   
    background:#f4f4f4;
    }

 .ipa-table .td label{   
    padding: 6px 4px 4px 4px;
    display: inline-block;
    }


 .ipa-table .caption {
	
    grid-column-start: 1;
    grid-column-end: 3;
    background-color: #ebeaea;
     padding: 6px 4px 4px 4px;
         font-weight:bold;
    text-align:center
  }

.ipa-table input, .ipa-table select, .ipa-table textarea {
    border-radius: 0px!important;
    border: 0px!important;
    margin: 0px;
    padding:0 6px;
    width:100%;
    height:100%;font-size:15px
}  
  
  
/* setIco */
.setIco { position: absolute;height:100%;right:0; color:inherit;	top: 0;padding: 9px 9px;width: 35px;	 cursor:pointer; font-family: 'IcoFont';font-size:18px;	font-style: normal;	font-weight: normal;font-variant: normal;	text-transform: none;	-webkit-font-smoothing: antialiased;}
.setIco.ham { padding: 5px 9px; }
.setIco:after { content : "\eedd" }
.setIco:hover {  color:white }
.sanfona .setIco:after { content : "\eee4";}
.sanfona.close .setIco:after { content : "\efa2" }




.div-filter { display:inline-block;margin:0 40px 20px 0px;font-size:14px }
.div-filter select{	padding: 2px 4px 3px 4px !important; }
.div-filter label{font-size:13px;color:darkgray }

.footer {
position: absolute;font-size:14px;background-color:#94281e;color:white; padding:20px;    line-height: 20px;bottom: 0;width:100%; min-height:100px }
.footer a { color:white;  text-decoration: none;  }
.footer a:hover { color:#f3dd1b }
.footer .flex-item {
	white-space:nowrap
}


