/*@import 'fonts.css';*/

@import url("/lib/bootstrap/bootstrap-icons.css");

html,body {
 background-color:#efefef;font-family:Arial;font-size:16px;color:#000;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: none;
  -webkit-text-size-adjust: 100%;
}

html{height:100%;}
body {min-height:100%;}
body{position:relative;}
html{}

/* General styles *** */
.container {background:#ffffff}
[class*="bi-info"]{color:#ddd;font-size:20px;}


/* PwdToggleField **************************************************  */
.input-group-text-clickable {cursor:pointer}
.input-group-text-clickable i {min-width:20px}
/* *** */


/* General form styles *** */
button.disabled {background-color:#eee!important;border:none!important;color:#000!important;box-shadow:none!important}

button.disabled:hover,
button.disabled:active,
button.disabled:focus {color:#000!important;}





/* ********************************************* */

#header a {display:block}

.menuportal {padding:0;margin:0;list-style:none;display:flex}

.menuportal .notice {transition: all .5s ease-out;
	display:inline;padding:.8em;color:#fff;font-weight:bold;font-size:1em;
	background: radial-gradient(circle at 50%, rgb(218,0,50) 50%,  transparent 50%);	margin-left:1em;
}	
.menuportal li.active .notice {background: radial-gradient(circle at 50%, #fff 50%,  transparent 50%);color:rgb(218,0,50)!important	}


.menuportal li {cursor:pointer}
.menuportal li div {border:solid 1px #999;border-radius:8px;;height:80px;display:flex;width:100%;align-items:center;justify-content: center;background-color:#f7f7f7;transition: all .5s ease-out} 
.menuportal li i{font-size:1.5em;margin-right:15px;transition: all .1s ease-in}
.menuportal li a {font-size:1.3em;color:#000;text-decoration:none;transition: all .1s ease-in}
.menuportal li:hover div  {}
.menuportal li.active div {border-color:rgb(218,0,50);background-color:rgb(218,0,50);}
.menuportal li:hover *:not(.notice) {color:rgb(218,0,50);}
.menuportal li.active:not(.logout) * {color:#fff}

.menuportal li.locked  {opacity:.3;pointer-events:none}
/*
.menuportal li.locked div {border:solid 1px #999;font-size:1.3em;}
.menuportal li.locked div i {color:#000;font-size:1.5em;}
*/
.menuportal li.logout div {border:none!important;background:none!important;justify-content:right}
.menuportal li.logout a {color:rgb(218,0,50)!important}
.menuportal li.logout:hover * {color:rgb(0,0,0)!important}


.submenuportal {padding:0;margin:0;list-style:none;}
.submenuportal li a {font-size:1.3em;color:#000;text-decoration:none;transition: all .1s ease-in}
.submenuportal li i{font-size:1.5em;margin-right:15px;transition: all .1s ease-in}
.submenuportal li i + i {font-size:1.5em;margin-left:-15px;transition: all .1s ease-in}
.submenuportal li:hover * {color:rgb(218,0,50);}


[data-role="inputArea"] {display:none}

h1 {margin:0 0 25px 0!important;padding:0!important;font-size:2em}
h2 {margin:15px 0 0px 0!important;padding:0 0 5px 0;font-size:1.5em}

h2 i {font-size:1.5em}
.panekennzeichen h2 i {float:left;position:absolute;}

.panekennzeichen h2:after {display:table;clear:both;content:""}
.panekennzeichen .kennzeichen {transition: all .5s ease-out; filter:grayscale(100%);transform: scale(.5) translate(-20%,-50%); display:inline-block;margin-bottom:-30px;opacity:.5}


.kennzeichen.noshow {display:none}
body.touchy .panekennzeichen .kennzeichen,
.panekennzeichen:hover .kennzeichen { filter:grayscale(50%);opacity:1}



h2.ismall i {font-size:1em}
h2 > i {margin-right:10px;transition: all .1s ease-in;transform:scale(1.1)}

h2 > i+i {margin-left:-10px}
h2 span {/*float:right;*/margin-left:10px}
h2 span >i{font-size:1em;color:#999;transition: all .5s ease-out;}
h2.info {color:#000;padding-left:10px}
h2.info + p {margin-top:10px}

a {cursor:pointer}
a {color:rgb(218,0,50);text-decoration:none}
a:hover,
a:active,
a:focus  {text-decoration:underline;color:rgb(218,0,50)}

/*border:solid 1px #000;border-bottom-color:transparent;border-top-left-radius:5px;border-top-right-radius:5px;*/
table.info {border-radius:10px;}
table.info th,table.info td {height:50px;width:50%;}
table.info th,table.info td {transition: all .5s ease-out;}
table.info td.pull-right {text-align:right}
table.info td a {text-decoration:none;color:rgb(0,0,0)}
table.info td a i {font-size:20px;}
table.info td a +a {margin-left:15px}
table.info td a:hover,
table.info td a:focus,
table.info td a:active  {text-decoration:underline}
table.info tr.hiddenrow   {display:none}

table.info .inlineInfo {display:none;}
table.info .inlineInfo td {width:100%!important;height:auto!important}
table.info .inlineInfoText {display:none;font-size:80%;opacity:1!important}
table.info.editing .inlineInfo {display:table-row}
table.info.editing .inlineInfoText {display:block;opacity:1}

table.info tr.noborder * {border:none}


.pane {transition: all .5s ease-out}
.pane:not(.newkfz) {margin-bottom:75px}
.pane div.innerpane{ border:solid 1px transparent;height:100%}


.pane div.innerpane img {max-width:100%;height:auto;}
#zulabe1-image  {border:solid 1px #999999;text-align:center;padding:10px;border-radius:10px;}
#zulabe1-image  div:not(.is-missing-upload) {background:url(../gfx/loading.gif) no-repeat center center;background-size:25% auto;	min-height:80px }

#zulabe1-image  a {cursor:zoom-in}
#zulabe1-image  img {;display:inline-block;max-height:120px;}


/*
.pane div.innerpane.hasapplied .paneheader {border-bottom-color:#6AEA4C66!important;/*background-color:#ff990022!important;}

.pane div.innerpane.incomplete .paneheader {border-top-color:#ff990088!important;/*background-color:#ff990022!important;}
*/

.pane div.innerpane.inactive{pointer-events:none;} 
/*.pane div.innerpane.inactive {color:rgb(218,0,50)!important}*/
.pane div.innerpane.expired{/*opacity:.5;pointer-events:none;*/}

.pane + .break {  flex-basis: 100%;margin:20px 0}


.pane div.innerpane .paneheader {border-radius:10px;border-top:solid 7px #ddd;;padding: 0px 0 5px 0px;margin-bottom:10px}
.pane div.innerpane .paneheader {transition: all .1s ease-out;}




.pane div.innerpane:not(.inactive):not(.expired) .paneheader,
body.touchy div.innerpane:not(.inactive):not(.expired) .paneheader {border-color: #ddd;border-radius:8px;background-color:#99999922;}

.pane:hover div.innerpane:not(.inactive):not(.expired) .paneheader button:hover {color:rgb(218,0,50)}

.pane:hover div.innerpane:not(.inactive):not(.expired) .paneheader   {border-color:rgb(218,0,50);}


.controls {display:block;padding:0px 0 5px 0px;min-height:40px;text-align:left;border-radius:10px}
.controls.autoheight {height:auto;}
.controls button {transition: all .5s ease-out}
.controls [data-task] {margin-right:20px;}
.controls:empty {display:none}
.controls  button{ border:none;font-size:16px;background-color:#fff;color:#000!important;border-radius:8px;padding:5px 10px}

body.touchy .controls button,
.pane:hover .controls button,
.controls.standalone  button{ background-color:#99999922;}
#meinkfz .controls.standalone  {margin:20px 0 50px 0}

.controls:empty {display:none}
.controls:empty {height:auto;padding:0;}
.controls  button:hover {text-decoration:underline;background-color:rgb(218,0,50)!important;color:#fff!important}
.controls button > i {margin-right:10px}

.actionDisabled {opacity:.2;pointer-events:none}


.pane:hover div.innerpane:not(.inactive):not(.expired)  button:hover {text-decoration:underline}




.pane h2 span + span[display!='none'] {mmargin-left:20px}

.pane:hover span > i:before{color:rgb(218,0,50)}/*color:rgb(218,0,50)*/
.pane:hover span > i:after{color:rgb(218,0,50)}/*color:rgb(218,0,50)*/

/* pane icons */
.pane span > i:after{font-size:10px;float:left;padding:5px 5px 0 0;color:rgb(0,0,0);font-style:normal}
.pane:hover span > i:before {color:rgb(218,0,50)}



span[data-task="add"] {cursor:pointer}
/*.pane:hover span[data-task="add"] > i:after{content:"Hinzufügen"}*/

span[data-task="edit"] {cursor:pointer}
/*.pane:hover span[data-task="edit"] > i:after{content:"Bearbeiten";}*/

span[data-task="cancel"] {display:none;cursor:pointer}
/*.pane h2 span[data-task="cancel"] > i:after{content:"Abbrechen";}*/
.pane h2:hover span[data-task="cancel"] > i:after{color:rgb(218,0,50)}

span[data-task="confirm"] {display:none;cursor:pointer}
/*.pane h2  span[data-task="confirm"] > i:after{content:"Übernehmen";}*/
.pane h2:hover span[data-task="confirm"] > i:after{color:rgb(218,0,50)}
span[data-task="confirm"].disabled {pointer-events:none;opacity:.5}
span[data-task="confirm"].disabled button{color:#66666666}
.pane span[data-task="confirm"].disabled > i:after{content:"Bitte Angaben prüfen";}
.pane span[data-task="confirm"].disabled > i:before{content:""}






.required:before {
    content:" * ";
    color:rgb(218,0,50)
}
.label-required{
	/*text-decoration:underline;
	text-decoration-color:rgb(218,0,50)*/
	/*color:rgb(218,0,50)*/
}

.form-control {
	padding: 1rem .75rem;
	font-size: 1rem;

}


.footer {position:absolute;bottom:10px;left:0;right:0;}
.footer > .container {border-top:solid 1px #ccc;padding-top:10px}
.container-main {padding-bottom:150px;}




/* system messages */
[class *= "message"]{
 padding:10px 10px 10px 10px;margin-bottom:1px;position:relative;
 font: normal 15px Verdana,Arial,sans-serif; color:#000000aa;
 border-radius:5px;margin-bottom:20px;display:none;
 
}


/*.x {position:absolute;right:0px;top:10px;font-size:1em;color:#000000aa;cursor:pointer}*/
.x {font-size:1em;color:#00000066;cursor:pointer}


[class *= "message"] > div  {display:table;width:100%}	
[class *= "message"] > div > * {display:table-cell;vertical-align:middle}	

[class *= "message"] .x {width:3em;text-align:right}	
[class *= "message"] .x i {font-size:1.5em}	

[class *= "message"] .i {width:3em}
[class *= "message"] .i i {font-size:2em;opacity:1;color:#666!important}

[class *= "message"]:empty {display:none!important}

[class *= "message"] + [class *= "message"] {margin:10px 0 0 0!important;//padding-top:0}

[class *= "message"] ul li {margin-top:10px}


.message_msg {
 border-color: #6AEA4C;background-color:#E5F8E1;
}
.message_msg .i i {color:#6AEA4CDD}


.message_msg.message_icon{
 border-color: transparent;background-color:transparent;
}
.message_msg.message_icon .i i {color:#6AEA4C!important}


.message_info {
 border-color: #ff9900; background-color:#ff990022;
}
.message_info .i i {color:#ff990088}

.message_info.message_icon {
 border-color: transparent; background-color:transparent;
}
.message_info.message_icon .i i {color:#ff9900}




.message_grey {
 border-color: #666666; background-color:#66666622;
}
.message_grey .i i {color:#66666688}

.message_grey.message_icon{
 border-color: transparent;background-color:transparent;
}
.message_grey.message_icon .i i {color:#666666!important}



.message_error { border-color: rgb(218,0,50); background-color:#FFeeee;}
.message_error .i i{color:#ff000077}

.message_group {font-size:.8em;margin-top:10px;margin-bottom:10px;opacity:.9}

.is-missing:after   {content:"bitte angeben";font-style:italic;font-size:.8em;padding:5px 5px 5px 0;color:rgb(218,0,50);opacity:.5}
.is-missing-upload  {font-style:italic;font-size:.8em;padding:5px 5px 5px 0;color:rgb(0,0,0);opacity:.5}




.context_msg {text-align:left;margin-top:20px;border-color: rgb(218,0,50); background-color:#FFeeee;padding:10px;border-radius:5px;font: normal 12px Verdana,Arial,sans-serif; color:#000000aa;}


[data-clone] {display:none}

.legal + .legal{margin-top:10px} 
.legal {
	
	display:grid;
	grid-template-columns: 15px 1fr  ;
	grid-gap: 10px;		
	
} 


.validatePwd-progress {
  display: block;
  width: 100%;
  text-align: left;
  height: 10px;
  position: relative;
}


.validatePwd-progressbar {
  background-color: #FFFFFF;
  display: block;
  height: 10px;
  transition: all 1s;
  width: 0px;
  position: absolute;
  z-index: 1;
}


.validatePwd-bg {
  background-color: #e9ecef;
  position: relative;
  width: 100%;
  height: 10px;
  position: absolute;
  z-index: 0;
}


img.preview {max-width:100%;height:auto}