@charset "utf-8";

@import url(/admin/includes/fonts/fontawesome/all.css);

*{font-family:Calibri,Arial,Courier,monospace;font-size:12px;margin:0;padding:0;box-sizing:border-box}
a img{border:none}

select {background:#fff}
select:disabled {background:#ccc}

body.system {display:grid;width:100vw;height:100vh;grid-template:"navi navi" 60px
            "subnavi main" auto / 200px 1fr }
nav {position:relative;padding:10px;grid-area:navi;display:grid;grid-template-columns:110px calc(100% - 340px) 50px 50px 50px;grid-gap:20px;justify-content:space-between;background:linear-gradient(to bottom, #fff 0, #fff calc(100% - 5px), transparent calc(100% - 5px), transparent 100%), linear-gradient(to right, #c00, #f90, #c00);}
nav img {width:100%;margin-top:-6px;}
nav .selectobjekt {cursor:pointer;border:1px solid #ccc;padding:2px;line-height:1;width:100%;font-size:14px}
nav .selectobjekt b {font-size:inherit;line-height:1}
aside {grid-area:subnavi;overflow:hidden}
main {grid-area:main;overflow:hidden}
.logoobjekt {display:flex}
.profil {}

.telefon .icon {font-size:40px;line-height:40px;cursor:pointer}
.telefon.updatetelbuch .icon {color:red}
.termine .icon {font-size:40px;line-height:40px;cursor:pointer;position:relative}
.termine .icon small {font-family: Calibri,Arial,Courier,Monospace;background: #c00;padding: 3px;position: absolute;bottom: -5px;right: -5px;font-size: 12px;border-radius: 5px;height: 20px;width: 20px;line-height: 1;text-align: center;color: #fff;}
.profil .icon {font-size:40px;line-height:40px;cursor:pointer}
.profil .profilmenu {display:none}
.profil.showprofil .profilmenu {display:block;position:absolute;top:100%;right:0;background:#fff;border:1px solid #ccc;padding:10px;min-width:200px}
.profil.showprofil .profilmenu span {font-size:14px;white-space:nowrap;display:block;padding:2px 5px}
.profil.showprofil .profilmenu span:first-child {font-weight:bold}
.profil.showprofil .profilmenu .gotoprofil,
.profil.showprofil .profilmenu .gotologout {display:block;color:#666;text-decoration:none;margin:0;padding:5px;font-size:18px;cursor:pointer}
.profil.showprofil .profilmenu .gotoprofil {border-top:1px solid #ccc}
.profil.showprofil .profilmenu .gotoprofil:hover,
.profil.showprofil .profilmenu .gotologout:hover {background:#eee}

.icon {font-family:"Font Awesome 5 Free";font-weight:900}

#content{background:rgba(255,255,255,0.7);margin-left:220px;min-height:500px;position:relative;margin-right:10px}
#content.fullwidth {margin:10px}

#content h1{font-size:21px;line-height:25px;margin:20px 0;padding:0}
#content input[type="submit"],
#content input[type="reset"]{background:#fff;border:1px solid #06a;color:#333;font-size:12px;font-weight:bold;height:25px;margin:1px 2px 2px 1px;padding:1px 10px;min-width:80px;cursor:pointer}
#content input[type="submit"]:hover,
#content input[type="reset"]:hover{color:#06a;background:#eee}

.normaltable {width:100%}
.normaltable th {background:#06a;color:#fff;padding:5px 2px}
.normaltable td {background-color:#eef;padding:0 3px;vertical-align:top}
.normaltable tr:nth-child(odd) td {background-color:#cdf}
.normaltable tr:hover td {background-color:#39f}
.normaltable .right {text-align:right}
.normaltable .center {text-align:center}
.normaltable .left {text-align:left}
.normaltable .value {font-weight:bold}
.normaltable table {width:100%;background:inherit}
.normaltable table tr td {background:inherit !important}
.normaltable table tr:hover td {background-color:#fff !important}
.normaltable .button {font-family:"Font Awesome 5 Free";font-weight:900;font-size:20px;cursor:pointer;}
.normaltable .button:hover {color:#fff}
.normaltable td input[type="checkbox"]{width:30px;height:30px;margin-left:10px}

input.pflicht,
select.pflicht {background-color:#ffc !important}

/* generic classes */
.clear {clear:both}
.clear_left{clear:left}
.clear_right{clear:right}
.clear_both{clear:both}
.dont_show{visibility:hidden}
.no_opacity {opacity:0}
.meldung_negativ{color:#f00;font-weight:normal}
.meldung_positiv{color:#000;font-weight:normal}

#CMSMsgBlock {bottom:10px;float:left;padding:0;position:absolute;width:320px;font-weight:bold;overflow-x:hidden;z-index:999999;right:10px;max-height:100%}
#CMSMsgBlock table {background:#fff;border:1px solid #ccc;padding:5px;width:100%;margin-top:5px;display:block}
#CMSMsgBlock table td {height:64px}
.message_info {border-color:blue !important;background:#ccf !important}
.message_ok {border-color:green !important;background:#cfc !important}
.message_warning {border-color:yellow !important;background:#ffc !important}
.message_error {border-color:red !important;background:#fcc !important}
.warningBox {padding:5px;font-weight:bold;border:1px solid #ccc}
#CMSMsgBlock table img {width:64px;height:64px}
div.CMSWartegrafik,
div.CMSAlert {padding-bottom:20px !important;display:flex;justify-content:space-between}
.CMSAlert img {order:1;flex-basis:64px;height:64px}
.CMSAlert div {order:2;flex-basis:calc(100% - 70px)}
.CMSAlert ul {margin-left:20px;display:block;float:none}
.CMSAlert table th {padding:0 2px}
.CMSWartegrafik .prozentanzeige {width:100%;height:30px;margin-top:10px;border:1px solid #e78f08;text-align:center;font-size:150%;color:#000;line-height:30px}

fieldset{border:1px solid #06a;margin:20px 0;padding:10px;box-sizing:border-box;background:#fff}
legend{border:1px solid #06a;color:#fff;background:#06a;font-size:13px;font-weight:bold;padding:2px 10px 2px;}

body.loginpage {background:#fff}
.bgfilter{width:100%;height:100%;position:fixed;top:0;background-position:center center;background-repeat:no-repeat;background-size:cover;opacity:0.6}
body.loginpage {background:#fff;position:relative}
body.loginpage .bgfilter{width:100%;height:100%;position:fixed;top:0;background-position:center center;background-repeat:no-repeat;background-size:cover;opacity:0.6}
body.loginpage * {box-sizing:border-box}
body.loginpage #error_box {position:relative;background:#fff;border:1px solid #c00418;border-radius:5px;min-height:100px;width:400px;margin:12% auto}
body.loginpage #error_box:before {background:url('/admin/includes/img/hvk-logo.png') no-repeat;width:100%;position:absolute;top:-120px;height:114px;content:'';background-size:contain}
body.loginpage #error_content a{color:#06a;font-size:10px;float:left;margin-top:25px}
body.loginpage label {margin-top:15px;display:block}
#error_titel{background:#c00418;color:#fff;font-size:32px;height:50px;line-height:50px;text-align:center;width:100%;border-radius:5px 5px 0 0}
#error_content select,
#error_content input{background:#eee;border:1px solid #666;border-radius:5px;color:#06a;font-size:18px;height:34px;line-height:28px;margin:5px 0;padding:8px 4px;width:100%}
#error_content select option{padding:2px 10px;border-top:1px solid #666}
#error_content input[type="submit"]{background:#c00418;border:1px outset #999;color:#fff;font-weight:bold;margin:10px 0;padding:2px 10px;width:50%;float:right}
#error_content input[type="submit"]:hover{border:1px inset #999}
#error_content{padding:10px 15px}
#error_content form{color:#333;font-size:11px;font-weight:bold;letter-spacing:1px}
body.loginpage .bildrechte {position:fixed;bottom:0;background:rgba(255,255,255,0.5);padding:5px;font-size:10px;line-height:14px;width:100%}
body.loginpage .bildrechte a{font-size:10px;line-height:13px;text-decoration:none;color:inherit}
body.loginpage .bildrechte a:hover{text-decoration:underline}
body.loginpage #error_content a.clpwreset {position:absolute;bottom:20px;left:5px;margin-top:0;float:none}
body.loginpage #error_content a.clreg {position:absolute;bottom:35px;left:5px;margin-top:0;float:none}

body.loginpage.regpage label {margin-top:5px}
body.loginpage.regpage #error_content a {float:none}

.CMSHtmlPrompt ul {margin-left:10px;margin-top:5px;}
.CMSHtmlPrompt input[type="text"] {margin-top:10px}

.ui-dialog-buttonpane .statusmeldung {float:left;line-height:22px;font-size:18px;color:green;border:1px solid #eee}
.ui-dialog-buttonpane .statusmeldung button {background: #fff;border: 1px solid #06a;padding: 10px;}
.ui-dialog-buttonpane .statusmeldung button span {margin: 2px;display: inline-block;}

.mybutton,
.ui-dialog-buttonset button {background:#fff;border:1px solid #06a;padding:10px;cursor:pointer;display:inline-block;}
.ui-dialog-buttonset button span {margin: 2px;display: inline-block;}
.ui-dialog-buttonset button span.icon {font-family: "Font Awesome 5 Free";font-weight:900;font-size:150%;line-height:100%;margin:0}
.ui-dialog-buttonset button span.icon.save {font-weight:normal;}
.ui-dialog .ui-dialog-buttonpane button {border-radius:0;margin: 5px 0 5px 5px !important;}
.ui-button .ui-icon {background-image:url(/admin/includes/css/images/ui-icons_ffffff_256x240.png) !important}
.ui-dialog .ui-dialog-title {color:#fff}
.ui-dialog .ui-dialog-titlebar-close {border:none;background:none}
.ui-icon-closethick:hover {border:1px solid #fbcb09;background:#fdf5ce;font-weight:bold;color:#c77405}
.ui-button,
.ui-widget-content {color:#333 !important}
body .mybutton:hover,
body .ui-dialog-buttonset button:hover {background:#eee}
body .mybutton:disabled,
body .ui-dialog-buttonset button:disabled {background:#ddd}

body .ui-widget-header {background:#06a;border-color:#06a}
body .ui-state-hover,
body .ui-widget-content .ui-state-hover,
body .ui-widget-header .ui-state-hover,
body .ui-state-focus,
body .ui-widget-content .ui-state-focus,
body .ui-widget-header .ui-state-focus,
body .ui-button:hover,
body .ui-button:focus {border-color:#06a;background:#eee}
body .ui-state-active,
body .ui-widget-content .ui-state-active,
body .ui-widget-header .ui-state-active,
body a.ui-button:active,
body .ui-button:active,
body .ui-button.ui-state-active:hover {border-color:#06a;background:#eee;color:#06a}
body .ui-state-active a,
body .ui-state-active a:link,
body .ui-state-active a:visited {color:#06a}
body .ui-tabs .ui-tabs-panel {padding:5px 0;}

.abschnitt .valueblock {float:left;width:50%;min-width:200px}
.valueblock {margin-top:5px;box-sizing:border-box;overflow:hidden}
.valueblock label {display:block;font-weight:normal;line-height:16px;color:#666;white-space:nowrap}
.valueblock.pflicht label {font-weight:bold}
.valueblock.pflicht label:after{content:'*'}
.valueblock.teilpflicht label:after{content:'**'}
.ui-widget-overlay {opacity:0.8}
.ui-dialog-content input[type="text"],
.ui-dialog-content input[type="date"],
.ui-dialog-content input[type="time"],
.ui-dialog-content input[type="number"],
.ui-dialog-content select,
.valueblock input,
.valueblock textarea,
.valueblock select {width:100%;height:30px;font-size:14px;line-height:16px;box-sizing:border-box;font-weight:bold;border:1px solid #ccc}
.valueblock input[type="checkbox"] {width:auto}
.valueblock input[type="image"] {width:auto;min-width:auto;height:auto}
.valueblock textarea {min-height:100px}
.valueblock input[type="checkbox"]{float:none;width:auto;min-width:auto}
.valueblock .options {width:40px}
.valueblock.pflicht input,
.valueblock.pflicht select {background:#ffc}
.valueblock input::placeholder {color:#ccc}

.ui-dialog-help,
.ui-dialog-dots,
.ui-dialog-settings {position:absolute;right:30px;background:none;border:none;font-family:"Font Awesome 5 Free" !important;font-weight:bold;color:#fff;font-size:20px !important;top:8px;cursor:pointer}
.ui-dialog-help:hover,
.ui-dialog-dots:hover,
.ui-dialog-settings:hover {background:#fff6}
.ui-dialog-dotshelper {position: absolute;right: 30px;top: 30px;z-index: 1;background: #fff;padding: 2px;border: 1px solid #06a;}
.ui-dialog-dotshelper li {padding:5px;display:flex;cursor:pointer;border-top:1px solid #06a}
.ui-dialog-dotshelper li:first-child {border-top:none}
.ui-dialog-dotshelper li:hover {background:#eee}
.ui-dialog-dotshelper li .icon {font-family:"Font Awesome 5 Free";font-weight:900;font-size:18px;line-height:24px;margin-right:5px;position:relative;width:30px}
.ui-dialog-dotshelper li .icon span {font-size: 15px;font-family: 'Font Awesome 5 Free';font-weight: 900;position: absolute;bottom: -5px;right:5px;text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;padding:0;margin:0}
.ui-dialog-dotshelper li .text {line-height:24px}

.cmspwvorschlag span,
.pw_vorschlag span {padding:0 5px;line-height:18px}
.cmspwvorschlag .insert {display:inline;float:left;font-family:'Font Awesome 5 Free';font-weight:900;cursor:pointer}
.pw_vorschlag img {display:inline;float:left}
.cmspwvorschlag,
.pw_vorschlag {float:left;border:1px solid #999;border-radius:5px;height:18px;width:160px;text-align:center;background:#eee;margin:3px 0 0 5px}
.cmspwvorschlag .new {display:inline;float:right;font-family:'Font Awesome 5 Free';font-weight:900;cursor:pointer}
.pw_vorschlag img.new {float:right}
.cmspwvorschlag {margin-top:21px}
.pwbedingungen {float:left;clear:left;margin-left:25px}
.pwbedingungen span{display:block;font-size:10px;line-height:12px;position:relative}
.pwbedingungen span.valide{color:#0a0}
.pwbedingungen span.valide:before{content:'✓';color:#0a0;position:absolute;left:-10px;font-weight:bold}

.myspecialcheckbox,
.mycheckbox {width:30px !important;height:30px !important;border:1px solid #666;position:relative;display:inline-block;box-sizing:border-box;background:#fff;cursor:pointer}
.myspecialcheckbox.disabled,
.mycheckbox.disabled {background:#ddd}
.myspecialcheckbox.checked:before,
.mycheckbox.checked:before{content:'X';position:absolute;left:7px;top:0;font-size:20px;line-height:30px}

.myspecialcheckbox.small,
.mycheckbox.small {width:16px !important;height:16px !important;border:1px solid #666;position:relative;display:inline-block;box-sizing:border-box;background:#fff}
.myspecialcheckbox.small.disabled,
.mycheckbox.small.disabled {background:#ddd}
.myspecialcheckbox.small.checked:before,
.mycheckbox.small.checked:before{content:'X';position:absolute;left:3px;top:0;font-size:12px;line-height:16px;font-weight:bold}

@media (max-width:1000px) {
    body.loginpage #error_box {width:96%;margin-top:25%}
    body.loginpage #error_box:before {width:50%;height:150px;top:-120px}
    body.loginpage #error_content select,
    body.loginpage #error_content input {font-size:36px;height:70px;padding:16px 8px}
    body.loginpage label {font-size:28px;line-height:40px}
    body.loginpage #error_content a{color:#06a;font-size:20px;float:left;margin-top:35px}
}
