.xfc-template-body {
     width: 100%;
     height:100%;
     background-color: var(--grey-1);
     margin: 0;
}
 .xfc-template {
     width: 100%;
     height:100%;
     font-size: 14px;
     /*background-color: var(--grey-1);*/
     font-family: 'Roboto-Regular', serif !important;
}
 .xfc-template H1 {
     font-family: 'Roboto-Regular', serif !important;
     font-size: 32px;
     color: var(--blau-1);
     padding: 20px 0;
     margin: 10px 0 0 0;
}
 .xfc-template H2 {
     font-family: 'Roboto-Regular', serif !important;
     font-size: 18px;
     font-weight: normal;
     color: var(--blau-1);
     padding-bottom: 20px;
     margin: 0;
}
 .xfc-template H3 {
     font-size: 16px;
     font-weight: normal;
     color: var(--blau-1);
     padding-bottom: 20px;
     margin: 0;
}
 .xfc-template DIV[lang]{
     margin: 0 auto;
     min-width: 300px;
     max-width: 700px;
     background-color: var(--white);
}

 .xfc-template DIV.header {
     /*border-bottom: 1px solid var(--dark-1,#505050);*/
     background-color: var(--white);
     padding: 0 60px;
     margin-top: 60px;
}
 .xfc-template DIV.content {
     padding: 30px 60px 20px 60px;
}
 .xfc-template DIV.footer {
     /*border-top: 1px solid var(--dark-1,#505050);*/
     background-color: var(--white);
     font-size:12px;
     height: 20px;
     padding: 20px 60px 30px 60px;
}
 .xfc-template INPUT {
    border-color: var(--dark-1,#505050);
     color: var(--dark-1,#505050);
     border-radius: 4px;
     border-style: solid;
     border-width: 1px;
     padding: 7px 11px;
}
 .xfc-template FORM.login {
    padding: 10px 20px;
     margin-bottom: 20px;
     border: 1px solid var(--dark-1,#505050);
}
 .xfc-template FORM.login LABEL {
    display:inline-block;
     width:140px;
     font-size: 13px;
     font-weight:bold;
}
 .xfc-template FORM.login .submit {
    display: inline-block;
     width: 100%;
}
 .xfc-template FORM.login .submit INPUT {
    float: right;
}
 .xfc-template FORM.login INPUT[type=text], .xfc-template FORM.login INPUT[type=password] {
    width:160px;
}
 .xfc-template FORM.login .button {
    font-size: 14px;
     background-color: transparent;
     color: var(--dark-1,#505050);
     font-weight: bold;
     padding: 10px 20px;
}
.xfc-template .button {
     font-size: 14px;
     background-color: transparent;
     color: var(--dark-1,#505050);
     font-weight: bold;
     border-color: #CCCCCC;
     border-radius: 4px;
     border-style: solid;
     border-width: 1px;
     padding: 7px 11px;
     margin-bottom: 8px;
     } 

.xfc-template .button:hover {
     transition: all 0.5s ease 0s;
     background-color: var(--dark-1,#505050);
     color: var(var(--white),#fff);
     cursor: pointer;
}


 .xfc-template FORM.login .button:hover {
    transition: all 0.5s ease 0s;
     background-color: var(--var(--red-1)-1);
     color: #FFFFFF;
     cursor: pointer;
}

.xfc-template DIV.auth-container {
     width: 100%;
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -moz-box-orient: vertical;
     -ms-box-orient: vertical;
     -webkit-box-direction: normal;
     -moz-box-direction: normal;
     -ms-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     -webkit-box-align:stretch;
     -ms-flex-align:stretch;
     align-items:stretch;
     max-width:300px;
     margin: 0 auto;
}
 .xfc-template DIV.auth-container.style-horizontal {
     -webkit-box-orient: horizontal;
     -webkit-box-direction: normal;
     -moz-box-direction: normal;
     -ms-box-direction: normal;
     -ms-flex-direction: row;
     flex-direction: row;
     max-width:inherit;
}
 .xfc-template DIV.auth-container.style-horizontal.reverse {
     -webkit-box-orient: horizontal;
     -webkit-box-direction: reverse;
     -ms-flex-direction: row-reverse;
     flex-direction: row-reverse;
}
 .xfc-template DIV.auth-container.style-horizontal .sys-login-container {
     min-width:300px;
     -webkit-box-flex: 50%;
     -ms-flex: 50%;
     flex: 50%;
}
 .xfc-template DIV.auth-container.style-horizontal > .separator {
     margin: 16px 24px 6px;
     border-left: 1px solid var(--dark-1);
     width: 0;
     overflow:hidden;
}
 .xfc-template DIV.auth-container.style-horizontal .external-login-container {
     margin-top:16px;
     -webkit-box-flex: 50%;
     -ms-flex: 50%;
     flex: 50%;
}
 .xfc-template DIV.auth-container.style-horizontal .external-login-container {
     max-width:300px;
    /* For IE 10 */
     min-width:250px;
}
 .xfc-template INPUT {
     margin-bottom: 16px;
     border-color: var(--dark-1);
     color: var(--dark-1);
     border-radius: 4px;
     border-style: solid;
     border-width: 1px;
     padding: 7px 11px;
}
 .xfc-template FORM.login, .xfc-template .external-login-container {
     width: 100%;
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -moz-box-orient: vertical;
     -ms-box-orient: vertical;
     -webkit-box-direction: normal;
     -moz-box-direction: normal;
     -ms-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     -webkit-box-align:stretch;
     -ms-flex-align:stretch;
     align-items:stretch;
}
 .xfc-template FORM.login LABEL {
     display:inline-block;
     width:auto;
     font-size: 13px;
     font-weight:bold;
}
 .xfc-template FORM.login LABEL.error {
     color:var(--red-1);
}
 .xfc-template FORM.login INPUT.error {
     border-color:var(--red-1);
}
 .xfc-template FORM.login .submit {
     display: inline-block;
     width: 100%;
}
 .xfc-template FORM.login .submit INPUT {
     float: right;
}
 .xfc-template FORM.login .error-container {
     color:var(--red-1);
}
 .xfc-template FORM.login .error-container .error-msg {
     margin-top: -4px;
     margin-bottom: 20px;
     font-size: 12px;
}
 .xfc-template FORM.login .error-container .error-msg::before {
     content:"!";
     background-color:var(--red-1);
     color:white;
     padding: 0 6px;
     border-radius: 8px;
     font-size: 14px;
     font-weight: bold;
     line-height: 12px;
     margin-right: 6px;
}
 .xfc-template DIV.auth-container .cta-container .button {
     float:right;
     width: 120px;
}
 .xfc-template DIV.auth-container FORM.login {
     padding: 0;
     margin: 0;
     border: none;
}
 .xfc-template DIV.auth-container FORM.login INPUT {
     width:auto;
}
 .xfc-template DIV.auth-container .button {
     font-size: 14px;
     background-color: var(--dark-1);
     color: white;
     font-weight: bold;
     border-color: var(--dark-1);
     border-radius: 4px;
     border-style: solid;
     border-width: 1px;
     padding: 7px 11px;
     margin-bottom: 8px;
}
 .xfc-template DIV.auth-container .button:hover {
     transition: all 0.5s ease 0s;
     background-color: white;
     color: var(--dark-1);
     cursor: pointer;
     border-color:var(--dark-1);
}
 .xfc-template .separator {
     margin: 24px 0;
     color:var(--dark-1);
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align:center;
     -ms-flex-align:center;
     align-items:center;
     text-align:center;
}
 .xfc-template .separator::before, .separator::after {
     content: '';
     -webkit-box-flex: 1;
     -ms-flex: 1;
     flex: 1;
     border-bottom: 1px solid var(--dark-1);
}
 .xfc-template .separator::before {
     margin-right: .25em;
}
 .xfc-template .separator::after {
     margin-left: .25em;
}
 .xfc-template .link {
     color: var(--dark-1);
}
 .xfc-template .cta-container .link {
     line-height: 33px;
}
 .xfc-template .terms {
     margin-top:16px;
     color:var(--dark-1);
     font-size:0.9em;
}
 .xfc-template .Hidden {
     display:none;
}

.xfc-template .html-template-logo {
     margin-top: 40px;
     /*
     margin-block-start: 0.67em;
     margin-block-end: 0.67em;
     margin-inline-start: 0px;
     margin-inline-end: 0px;
     */
     height:80px;
}

.xfc-template .flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}
.xfc-template .flex-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
.xfc-template DIV.hidden{display:none}
.xfc-template UL.xfc-appointment-list{list-style:none;padding:0}
.xfc-template LI.xfc-appointment-list-item{padding:0;border-bottom:1px solid #ddd;}
.xfc-template LI.xfc-appointment-list-item:last-child{border:none;}
.xfc-template .xfc-appointment-containter{padding:14px 28px 30px 14px}
.xfc-template .xfc-icon-col{min-width:40px}
.xfc-template .ui-icon{font-size:14px;width:20px;height:20px}
.xfc-template .xfc-appointment-color-icon{width:20px;height:20px;border-radius:15px}
.xfc-template .xfc-appointment-date-time-icon{font-size:18px;padding-left:1px}
.xfc-template .xfc-appointment-time-zone-icon{font-size:20px}
.xfc-template .xfc-appointment-header H2,.xfc-template .xfc-appointment-sub-header{padding-bottom:12px;font-weight:bold}
.xfc-template .xfc-appointment-time-zone-row{padding-bottom:20px;font-weight:bold}
.xfc-template .xfc-appointment-date-time,.xfc-template .xfc-appointment-date-time-icon{color:#03c39b}
.xfc-template .xfc-appointment-time-zone,.xfc-template .xfc-appointment-time-zone-icon{color:#949699}
.xfc-template .xfc-drop-down-trigger{color:var(--dark-1,#505050);cursor:pointer;padding:14px;border:1px solid var(--grey-1)}
.xfc-template .xfc-drop-down-trigger:hover{background-color:var(--grey-1)}
.xfc-template .xfc-drop-down-trigger:before{content:"+";font-weight:bold;background-color:var(--dark-1,#505050);color:#fff;margin-right:10px;padding:0 4px;border-radius:15px}
.xfc-template DIV.xfc-drop-down-list-container{display:block;transform:scale(.96,.96) translateY(5px);transition:transform .15s ease;position:absolute;-webkit-box-shadow:rgba(0,0,0,0.4) 0 10px 26px;-moz-box-shadow:rgba(0,0,0,0.4) 0 10px 26px;box-shadow:rgba(0,0,0,0.4) 0 10px 26px;background-color:#fff;z-index:-1;height:0;overflow:hidden;visibility:hidden;}
.xfc-template DIV.xfc-drop-down-list-container.selected{transform:scale(1,1) translateY(0px);z-index:99999999;height:auto;visibility:visible}
.xfc-template UL.xfc-drop-down-list{list-style:none;padding:0}
.xfc-template LI.xfc-drop-down-list-item{padding:0;}
.xfc-template I.xfc-drop-down-list-item-icon{position:absolute;padding:10px 12px 10px 17px;font-size:20px}
.xfc-template A.xfc-btn-link{display:block;padding:12px 20px 12px 60px;text-decoration:none;font-size:15px;color:var(--dark-1,#505050);font-weight:bold}
.xfc-template LI.xfc-drop-down-list-item:hover{background-color:var(--grey-1)}
.xfc-template LI.xfc-drop-down-list-item .secondary-text{font-size:12px;font-weight:normal;color:#aaa;padding-left:8px}