/*Fonts*/
@font-face {
    font-family: 'StandardFont';
    font-weight: normal;
    src: url('/medizinakte/javax.faces.resource/fonts/IBMPlexSans-Regular.ttf.xhtml') format("opentype");;
}
@font-face {
    font-family: 'StandardFont';
    font-weight: 500;
    src: url('/medizinakte/javax.faces.resource/fonts/IBMPlexSans-Medium.ttf.xhtml') format("opentype");;
}
@font-face {
    font-family: 'StandardFont';
    font-weight: 600;
    src: url('/medizinakte/javax.faces.resource/fonts/IBMPlexSans-SemiBold.ttf.xhtml') format("opentype");;
}
@font-face {
    font-family: 'StandardFont';
    font-weight: bold;
    src: url('/medizinakte/javax.faces.resource/fonts/IBMPlexSans-Bold.ttf.xhtml') format("opentype");;
}

html {
    overflow: hidden;
}

body {
    background: #FFFFFF;
    font-family: StandardFont, FontAwesome;    
    overflow: hidden;
}

body.login {
    background: #FFFFFF;
}

* {
    box-sizing: border-box;
    transition-property: border-color, background-color, color;
    transition-duration: 0.2s;
}

.ui-button-text-icon-left .ui-icon.pp-plus {
    margin-top: calc(-5px + calc(0em / 2));
}

.pp {
    font-family: 'patientportal' !important;
    font-size: 24px;
    font-style: initial !important;
    width: 24px;
    height: 24px;
    line-height: 24px; 
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    color: inherit;
}
.pp-plus::before {
    font-weight: 300;
}
.pp-attach-clipping-add:before {
    content: "\e966" !important;
}

.pp-small {
	font-size: 12px;
    font-weight: bold;
    margin-left: 5px !important;
}

.ui-selectcheckboxmenu-multiple .ui-icon-triangle-1-s::before,
.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon::before {
    font-family: 'patientportal';
    content: "\e961";
    color: #007E36;
    font-size: 24px;
}

.ui-icon-closethick::before {
    font-family: 'patientportal';
    content: "\e912";
}

.error_row {
    color: red;
    background: none;
    font-size: 14px;
    height: auto;
}

.ui-growl {
  left: 16px;
  bottom: 134px;
  top: unset;
  width: calc(100vw - 32px);
  padding: 0px calc(50vw - 400px);
}
.ui-growl .ui-growl-item-container {
    display: none !important;
    width: 100%;
    margin: 0px;
    position: initial;
    box-shadow: none;
}
.ui-growl .ui-growl-item-container:first-child {
    display: initial !important;
}
.ui-growl .ui-growl-item-container .ui-growl-item {
    background: #d9eac5;
    color: black;
    box-shadow: 3px 3px 4px 0px rgba(0, 0, 0, 0.20);
    border-radius: 3px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}
.ui-growl .ui-growl-item-container.ui-growl-error .ui-growl-item {
    background: #fde5e7;
}
.ui-growl .ui-growl-item-container .ui-growl-item .ui-growl-image {
    width: 24px;
    height: 24px;
}
.ui-growl .ui-growl-image-info::before {
    font-family: PatientPortal;
    color: white;
    content: "\e90f";
    background: #92D056 ;
    border-radius: 50%;
    padding: 6px;
    font-size: 12px;
}
.ui-growl .ui-growl-item-container .ui-growl-item .ui-growl-message {
    padding: 0px;
    padding-right: 24px;
    padding-bottom: 0em;
}
.ui-growl .ui-growl-item-container .ui-growl-item .ui-growl-icon-close {
    display: flex !important;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    width: 14px;
    font-size: 14px;
}

.button_secondary, .ui-icon.ui-icon-close {
    color: #007E36;
}

.headerTitle {
    font-size: 24px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.appointmentPicker .ui-datepicker {
    width: 100%;
    border: none;
}

.appointmentPicker .ui-datepicker td {
    height: 45px;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    padding: 0px;
}

.appointmentPicker .ui-datepicker td > * {
    margin: 12px;
}

.appointmentPicker td.disabledDate {
    background: #FFFFFF;
    color: #C9C9C9;
}

.appointmentPicker td.ui-datepicker-today span.ui-state-default {
    border: 1px solid #007E36  !important;
    background: #FFFFFF;
}

.appointmentPicker td.ui-datepicker-today a {
    border: 0.5px solid #007E36  !important;
}

.appointmentPicker td.enabledDate a{
    background: #EAE8EF;
}

.appointmentPicker td.enabledDate:not(.ui-datepicker-current-day) a:hover {
    background: #D3D1DF;
}

.appointmentPicker td.enabledDate a {
    color: #24195D;
}

.appointmentPicker td.ui-datepicker-current-day a{
    background: #92D056 ;
    color: #24195D;
}

.appointmentPicker .ui-datepicker .ui-datepicker-title {
    font-weight: 700;
    font-size: 16px;
    color: #24195D;;
}

.appointmentPicker td.ui-datepicker a, 
.ui-datepicker td a.ui-state-default,
.appointmentPicker .ui-datepicker td span.ui-state-default {
    height: 46px;
    border: none;
    align-content: center;
    display: grid;
    padding: 0px;
}

.ui-datepicker.ui-input-overlay {
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2);
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    padding: 0px;   
    height: 24px !important;
    width: 24px !important;
    cursor: pointer;
    top: 5px !important;
}

.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled {
    display: none;
}

.ui-datepicker-header .ui-icon-circle-triangle-e, .ui-datepicker-header .ui-icon-circle-triangle-w {
    color: #24195D;
    font-family: PatientPortal;
    font-size: 24px;
    line-height: 24px;
}

.ui-datepicker-header .ui-icon-circle-triangle-e::before {
    content: "\e965";
}

.ui-datepicker-header .ui-icon-circle-triangle-w::before {
    content: "\e963";
}

.ui-datepicker-header {
    background: #FFFFFF;
    color: #7D7D7D;
    font-size: 12px;
    margin-bottom: 16px;
}

.ui-datepicker th {
    background: #F2F2F2;
    color: #7D7D7D;
    font-size: 14px;
    font-weight: normal;
    padding: 5px 0px;
    padding-bottom: calc(5px + 0em);
    line-height: 1em;
}

.ui-button-text-only .ui-button-text {
    padding-bottom: calc(0.3em + 0em);
}

.ui-menu .ui-menuitem-text,
.ui-button-text {
    padding-bottom: 0em;
}

.ui-menuitem-icon.ui-icon:not(.pp) {
    display: none;
}

.dateTimePanel {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    flex-direction: row;
}
.dateTimePanel > div {
    display: flex;
    flex-direction: column;
}

.ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected {
    border-top: 3px solid #007E36;
    border-bottom: 0px;
    background: #FFFFFF;
    height: 44px;
    font-weight: bold;
    font-size: 16px;
}
.ui-tabs.ui-tabs-top>.ui-tabs-nav {
    border-bottom: 0px;
    text-align: left;
}
.ui-tabs.ui-tabs-top>.ui-tabs-nav>li>a {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: calc(-1.5px - 0em);
    max-width: 400px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
    color: black;
    cursor: pointer;
}
.ui-tabs .ui-tabs-nav li a {
    color: #007E36;
    padding: 0px;
}
.ui-tabs .ui-tabs-nav li {
    margin: 0px;
    background: #F2F2F2;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    text-align: center;
    letter-spacing: -0.01em;
    height: 46px;
}

.ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected,
.ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected.ui-state-hover,
.ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-state-hover {
    border-bottom: 0px;
}

.infoBobbel {
    width: 22px;
    height: 22px;
    color: #24195D;
    display: inline-grid;
    background: #92D056 ;
    place-items: center;
    border-radius: 50%;
    font-size: 12px;
    border: 1px solid white;
    margin-left: 8px;
    font-weight: normal;
    padding-right: 1px;
    padding-bottom: 0em;
    margin-top: 0em;
}

.ui-chkbox .ui-chkbox-box {
    width: 24px;
    height: 24px;
}

.ui-chkbox-icon.ui-icon.ui-c.ui-icon-check {
    width: 100%;
    height: 100%;
    align-items: center;
}

.timeSlot {
    display: grid;
    gap: 24px;
    align-content: start;
    width: 182px;
    height: 286px;
    grid-template-columns: repeat(auto-fill, minmax(79px, 1fr));
}
.timeSlot.wideButtons {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
}

.timeSlotButtons {
    background: #EAE8EF;
    color: #24195D;
    height: 46px;
    width: 100%;
    box-shadow: none;
    font-weight: bold;
    border-radius: 0px;
    font-size: 16px;
    letter-spacing: -0.16px;
    margin-right: 0px;
}

.timeSlotButtons span {
    text-align: center;
    white-space: nowrap;
}
.timeSlotButtons.ui-button.ui-state-hover,
.timeSlotButtons.ui-button.ui-state-active {
    background: #D3D1DF;
}

.timeSlotButtonSelected,
.timeSlotButtonSelected.ui-button.ui-state-hover,
.timeSlotButtonSelected.ui-button.ui-state-active {
    background: #92D056 ;
    color: #24195D;
}

.ui-inputfield {
    width: 100%;
    height: 45px;
    border: 1px solid #FFFFFF;
    border-bottom: 1px solid #636363;
    background: #F2F2F2;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    font-size: 18px;
    line-height: 160%;
    color: #171717;
    border-radius: 3px;
    overflow: hidden;
}

.ui-inputfield::placeholder{
    color: #969696;
}

.ui-selectonemenu {
    width: auto;
    height: 45px;
    border: 1px solid #FFFFFF;
    border-bottom: 1px solid #636363;
    background: #F2F2F2;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    font-size: 18px;
    line-height: 160%;
    color: #171717;
    border-radius: 3px;
    overflow: hidden;
    padding-right: 40px;
}

.ui-selectonemenu.ui-state-hover {
    background-color: #F2F2F2;
}

.ui-inputfield.ui-state-focus, .ui-selectonemenu.ui-state-focus {
    background-color: #F2F2F2;
    border: 1px solid #92D056 ;
}

.ui-inputfield.ui-state-error, .ui-selectonemenu.ui-state-error {
    border: 2px solid #DA1F29;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: #F2F2F2;
}

.ui-selectonemenu label.ui-selectonemenu-label {
    height: 100%;
    padding: 5px;
    padding-bottom: calc(5px + 0em);
    text-overflow: ellipsis;
    display: block;
    line-height: 180%;
}

.ui-selectonemenu .ui-selectonemenu-trigger {
    width: 39px;
    padding-right: 12px;
}

.ui-selectonemenu .ui-selectonemenu-trigger .ui-icon {
    margin-top: auto;
}

.ui-selectonemenu-panel .ui-selectonemenu-list {
    padding: 8px 0px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.12);
    border-radius: 0px 0px 3px 3px;
}

.ui-selectonemenu-item.ui-selectonemenu-list-item.ui-corner-all.ui-state-hover
    {
    background-color: #d9eac5;
}

.ui-selectonemenu-list-item.ui-state-highlight {
    background-color: #d9eac5;
}

.ui-selectonemenu-panel .ui-selectonemenu-list-item {
    padding: 6px 10px;
    padding-bottom: calc(6px + 0em);
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    line-height: 160%;
    white-space: break-spaces;
}

.ui-selectonemenu-items, .ui-selectonemenu-panel .ui-selectonemenu-items-wrapper
    {
    font-size: 18px;
    width: 100%;
}

.ui-datepicker-buttonpane {
    display: flex;
    flex-direction: column;
}

.button,
.ui-datepicker-buttonpane > button {
    height: 48px !important;
    border-radius: 30px;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: -0.16px;
    box-shadow: none;
    margin: 0px;
    text-align: center;
    display: flex;
    gap: 6px;
    align-items: center;
    padding: 0px 20px 0em 20px;
    justify-content: center;
    white-space: nowrap;
    width: fit-content;
    min-width: 200px;
}

.ui-datepicker-buttonpane > button {
    margin-top: 0px !important;
    padding: 0px 20px !important;
}

.ui-menubutton .button {
    width: 100%;
}

.button.ui-button-text-only .ui-button-text {
    padding: 0px;
}

.button .ui-button-text {
    text-align: center;
}

.ui-button-text-icon-left .ui-button-text {
    padding: 0px;
}

.button.ui-button.ui-state-active {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.main_footer .button_primary, .main_footer .ui-menubutton {
    grid-column: 2;
    justify-self: end;
}

.main_footer .button_primary.fullWidth, .main_footer .ui-menubutton.fullWidth {
    grid-column: 1/3;
}

.button_primary,
.ui-priority-primary {
    color: #24195D;
    background: #92D056 ;
    border: 1px solid #92D056 ;
}

.button_primary.ui-button.ui-state-active, 
.button_primary.ui-button.ui-state-hover,
.ui-priority-primary.ui-state-active, 
.ui-priority-primary.ui-state-hover
    {
    background: #007E36 ;
    color: #FFFFFF;
    border: 1px solid #007E36 ;
}

.button_primary.ui-button.ui-state-disabled,
.ui-priority-primary.ui-state-disabled {
    color: #8e89ab;
    background: #92D056;
    border: 1px solid #92D056;
}

.button_primary.button_error {
    background: #EE0018;
    color: white;
    border-color: #EE0018;
}

.button_primary.button_error.ui-button.ui-state-active, 
.button_primary.button_error.ui-button.ui-state-hover {
    background: #C90014;
    border-color: #C90014;
}

.button_primary.button_error.ui-button.ui-state-disabled {
    background: #F67F8B;
    border-color: #F67F8B;
}

.button_secondary,
.ui-priority-secondary {
    color: #007E36;
    background: #FFFFFF;
    border: 1px solid #007E36;
}

.button_secondary.ui-button.ui-state-active,
.button_secondary.ui-button.ui-state-hover,
.ui-priority-secondary.ui-state-active,
.ui-priority-secondary.ui-state-hover  {
    background: #92D056;
}

.button_secondary.button_red {
    color: #EE0018;
    border: 1px solid #EE0018;
}
.button_secondary.button_red.ui-button.ui-state-active,
.button_secondary.button_red.ui-button.ui-state-hover {
    background: #fde5e7;
}

.button_link {
    color: #FFFFFF;
    background: #007E36;
    border: 1px solid #007E36;
}

.button_link.ui-button.ui-state-active, .button_link.ui-button.ui-state-hover
    {
    color: #007E36;
    background: #FFFFFF;
    border: 1px solid #007E36;
}

.button_link.ui-button.ui-state-disabled {
    color: #FFFFFF;
    background: #92D056;
    border: 1px solid #92D056;
}

.isStickyBottom {
    box-shadow: 0px -1px 6px 0px rgba(0, 0, 0, 0.50);
}

.isStickyTop {
    box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.50);
}

.main_header {
    background: #FFFFFF;
    z-index: 2;
    border-bottom: 1px solid #C9C9C9;
}

.main_footer {
    z-index: 1;
    background: #FFFFFF;
    width: 100vw;
    display: grid;
    gap: 0px 25px;
    align-items: center;
    padding: 0px calc(50vw - 400px);
    grid-template-columns: repeat(2, minmax(min-content, 50%));
}

.main_footer > * {
    margin: 10px 0px 22px 0px;
}

.ui-confirm-dialog, .largeDialog {
    width: min(800px, calc(100vw - 32px)) !important;
    left: max(16px, calc(50vw - 400px)) !important;
    border-radius: 0px;
    background: #FFFFFF;
}

.ui-confirm-dialog {
    padding: 24px 16px 12px 16px;
}

.largeDialog.ui-dialog .ui-dialog-titlebar {
    display: none;
}

.largeDialog.ui-dialog .ui-dialog-content {
    padding: 24px 16px 36px 16px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.largeDialog.ui-dialog .ui-dialog-content > form {
    display:contents;
}

.largeDialog .button {
    width: 100%;
}
    
.ui-dialog .ui-dialog-titlebar {
    background: none;
    padding: 0px;
}

.ui-dialog .ui-dialog-titlebar .ui-dialog-title {
    margin: 0;
}

.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
    display: none;
}

.ui-dialog .ui-dialog-titlebar, .largeDialog .dialogTitle {
    font-size: 32px;
    font-weight: 700;
    line-height: 40px;
    color: #007E36 ;
}


.largeDialog .appointmentOverview {
    margin-bottom: -12px;
	display: flex;
	flex-direction: column;
	align-items: unset;
	gap: 0px;
}

.largeDialog .appointmentTitle {
    padding: 8px 12px;
}

.largeDialog .confirmWrapper {
    margin-top: -12px;
    margin-bottom: 12px;
}

.dialog {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #007E36 ;
}

.dialogSubtitleText {
    font-weight: 700;
    padding-bottom: 0em;
    padding-left:7px;
}

.dialogSubtitle{
  display: flex;
  align-items: center;
}

.hint img{
    max-height: calc(80vh - 32px);
    width:100%;
    object-fit: contain;
    overflow:hidden
}

.hint{
    width:min(800px, calc(100vw - 32px));
}

.ui-confirm-dialog .ui-dialog-content {
    padding: 0px;
    margin-top: 24px;
}

.ui-confirm-dialog .ui-dialog-content>.ui-icon {
    display: none;
}

.ui-confirm-dialog-message, .largeDialog .dialogMessage {
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    margin: 0;
    margin-bottom: 12px;
    color: black;
}

.ui-confirm-dialog.ui-dialog .ui-dialog-buttonpane {
    display: flex;
    flex-direction: column;
    padding: 0px;
    gap: 24px;
    margin: 0px;
}

.ui-confirm-dialog.ui-dialog .ui-dialog-buttonpane button {
    margin: 0px;
    width: 100%;
}

.ui-dialog-mask {
    background-color: rgba(0, 0, 0, 0.5);
}

.panelNoPadding td.ui-panelgrid-cell {
    padding: 0px !important;
}

.heading_H2 {
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 31px;
    letter-spacing: -0.01em;
    color: #007E36 ;
}

.gray100 {
    color: #171717 !important;
}

.black {
    color: #000000 !important;
}

.heading_H1 {
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 120%;
    letter-spacing: -0.02em;
    color: #007E36 ;
}

.label {
    min-height: 1em;
}

.label_small {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: 0.02em;
    color: #636363;
    white-space: break-spaces;
}

.label_small_strong {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.02em;
    color: #303030;
}

.label_link {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 21px;
    padding-left: 5px;
    color: #007E36;
}

.text_medium {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 160%;
    color: #171717;
}

.text_emphasized {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 155%;
    letter-spacing: 0.01em;
    color: #303030;
}

.sub_title {
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.18px;
    color: #24195D;
    margin-bottom: 12px;
}

.upper_sub_title {
    padding: 0px max(calc(50% - 400px));
    display: block;
    margin-top: 22px;
    margin-bottom: 1px;
}

.text_link {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 160%;
    color: #007E36 ;
    margin-right: 10px;
}

.welcomePanel {
    width: 576px;
    height: auto;
    margin-left: calc(50% - 370px);
}

.loginPanel {
    height: auto;
    padding-bottom: 36px;
    padding: 0px max(16px, calc(50% - 300px)) 36px max(16px, calc(50% - 300px));
}

.loginPanel > * {
    width: 387px;
    margin: auto;
}

.loginPanel .ui-inputfield{
    background: #FFFFFF;
}

.margin_40 {
    margin-bottom: 40px;
}

.panelDiv {
    border-top: 1px solid #C9C9C9;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px 0px;
    margin: 0px max(0px, calc(50% - 400px));
}

.panelDiv button {
    width: fit-content;
}

.registrationTable {
    width: 100%;
}

.scheduleAppointmentTable{
    margin-top: -10px;
}

.registrationTable{
    margin-top: -20px;
}

.scheduleAppointmentTable.ui-panelgrid .ui-panelgrid-cell,
.registrationTable.ui-panelgrid .ui-panelgrid-cell {
    padding: 0px;
}

.scheduleAppointmentTable.ui-panelgrid .ui-panelgrid-cell td span.label_small
    {
    margin-top: 12px;
    display: block;
}

.entryList {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.appointmentList {
    display: grid;
    flex-direction: column;
    gap: 12px;
    grid-template-columns: auto 1fr 1fr auto auto;
}

.appointmentList .fa.fa-download, .appointmentList .fa.fa-file-text-o,
    .appointmentList .fa.fa-trash, .appointmentList .fa-expand,
    .appointmentList .fa-ellipsis-h, .appointmentList .fa.fa-download.fa:hover,
    .appointmentList .fa.fa-file-text-o.fa:hover, .appointmentList .fa.fa-trash.fa:hover,
    .appointmentList .fa-expand.fa:hover, .appointmentList .fa-ellipsis-h.fa:hover
    {
    color: #007E36;
    font-size: 25px;
}

.fa-undo, .fa-undo.fa:hover {
    color: #7D7D7D;
    font-size: 25px;
}

.appointmentOverview {
    display: grid;
    flex-direction: row;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.25);
    min-height: 60px;
    align-items: center;
    grid-template-columns: auto 1fr 1fr auto auto;
    grid-template-columns: subgrid;
    grid-column: 1/6;
}

.documentFilter {
    display: grid;
    grid-template-columns: minmax(0px, 1fr) auto;
    column-gap: 12px;
    padding: 8px 0px 16px 0px;
    max-width: 800px;
    margin: auto;
    align-items: center;
    width: 100%;
}
.documentFilter > .onlyIcon {
    margin-top: 10px;
}
.documentFilterOptions {
    display: flex;
    flex-direction: column;
    min-width: 250px;
}

.onlyIcon {
    color: #007E36;
    cursor: pointer;
}

.ui-overlaypanel {
    filter: drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.50));
    border-radius: 5px;
    overflow: hidden;
    box-shadow: none;
}
.ui-overlaypanel-content {
    padding: 16px;
}

.editOverlayPanel > .ui-overlaypanel-content {
    padding: 6px 0px;
    display: flex;
    flex-direction:column;
}

.editOverlayPanel > .ui-overlaypanel-content a {
    color: #000;
    padding: 6px 12px;
    padding-bottom: calc(6px + 0em);
    line-height: 160%;
}

.editOverlayPanel > .ui-overlaypanel-content a:hover {
    background: #d9eac5;
}

.documentOverview {
	display: flex;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.25);
    background: #FFFFFF;
    gap: 8px;
    align-items: center;
    padding: 8px 8px 8px 0px;
    min-height:60px;
}

.welcomeNews .documentOverview {
    grid-template-columns: auto minmax(0px, 1fr) 24px;
    padding: 8px;
}

.welcomeNews .documentOverview .newDocumentMarker {
    display: none;
}

.documentOverview:hover {
    background: #f4f8fb;
}

.documentOverview > a {
    font-size: 24px;
    color: #007E36 ;
    flex-shrink: 0;
}

.documentOverview .ui-button, .appointmentOverview .ui-button {
    width: 100%;
    color: inherit;
}

.welcomeNews .documentOverview .documentTexts {
    display: grid;
    grid-template-columns: minmax(0px, 1fr) auto;
    align-items: center;
}

.welcomeNews .documentTexts .createUploadLabel{
    grid-column: 1/3;
    padding-bottom: 0px;
    font-size: medium;
}

.welcomeNews .statusLabel{
    grid-column: 2/3;
    grid-row: 1;
}

.documentTexts {
    display: grid;
    grid-template-columns: 40% 1fr auto;
    align-items: center;
    flex-grow: 1;
}

.documentTexts .headerText {
    font-style: normal;
    font-size: 16px;
    color: #007E36 ;
    margin-right: 10px;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: -0.16px;
    overflow: hidden;
    line-height: normal;
    display: block;
    padding-bottom: 0em;
    pointer-events: none;
}

.documentTexts .createUploadLabel {
    padding-bottom: 0em;
    font-size: medium;
}

.appointmentHeader {
    display: flex;
    padding: 7px 16px 8px 12px;
    justify-content: space-between;
    align-items: center;
    background: #92D056;
    color: #FFFFFF;
    font-weight: bold;
    white-space: nowrap;
    height: 100%;
}

.appointmentHeader.pending .pp,
.appointmentHeader.cancelled .pp {
    color: #007E36 ;
}

.appointmentHeader .pp,
.appointmentHeader.past .pp {
    color: white;
    font-weight: normal;
}

.appointmentHeader.pending {
    background: __color4BG_45;
    color: __color4FG_45;
}

.appointmentHeader.cancelled {
    background: __color4BG_45;
    color: __color4FG_45;
}

.appointmentHeader.cancelled .appointmentHeaderDescription {
    text-decoration: line-through;
}

.appointmentHeader.past {
    background: #969696;
    color: white;
}

.appointmentCancelWrapper {
    display: flex;
    flex-direction: column;
    font-size: 16px;
}

.appointmentBody {
    display: contents;
    padding: 8px 12px;
    gap: 12px;
    align-items: center;
    width: 100%;
}

.appointmentOverview > .menuButtonsDocument {
    padding-right: 12px;
    grid-column: 5;
}

.appointmentDocuments {
    white-space: break-spaces;
    font-size: 14px;
    color: #636363;
    padding-bottom: 0.25em;
    width:max-content;
}

.appointmentTitle {
    font-size: 16px;
    font-weight: bold;
    color: #007E36 ;
    padding-bottom: 0.25em;
    flex-basis: 35%;
    flex-shrink: 0;
}

.appointmentOverviewInfoDiv {
    margin: 30px 0px 30px 0px;
    width: 640px;
}

.appointmentTitleHeader {
    display: flex;
    flex-direction: column;
    position: relative;
    font-size: 16px;
    font-weight: 700;
    color: #007E36 ;
    max-width: 800px;
    margin: 0px auto;
    width: 800px;
    padding: 24px 0px;
    gap: 14px;
}

.appointmentButtons {
    display: grid;
    gap: 24px 36px;
    grid-template-columns: auto auto 1fr;
    margin: 10px 0px 12px 0px;
}

.appointmentButtons .ui-button:nth-of-type(3n) {
    margin-left: auto;
}

.appointmentButtons .ui-button{
    white-space: wrap;
}

.appointmentButtons .ui-button .ui-icon {
    font-weight: normal;
}

.appointmentButtons .ui-button .ui-icon.pp-calendar-download {
    margin-bottom: -7px;
}

.videoConferenceFrame{
  width: 800px;
  max-height: 500px;
  border: 1px solid #C9C9C9;
  margin: 0 auto;
  padding-bottom: 0px !important;
  background: #C9C9C9;
}

.uploadFrame {
    width: 100vw;
    height: calc(100% + 40px);
    border: none;
    border-radius: 0px;
    margin: 0px -16px !important;
    width: calc(100% + 32px) !important;
    padding: 0px calc(50% - 400px + 16px);
    box-sizing: content-box;
}

.docFullSize {
    padding: 16px;
    width: min(100vw, 805px);
    margin: 0px -16px;
}

.docFullSize #showDocumentInlineTarget, .docFullSize #showDocumentTarget
    {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

.docFullSize .page {
    box-shadow: 0px -1px 6px 0px rgba(0, 0, 0, 0.12);
}

.portalContentTabs{
    width: 800px;
    margin: 0px -16px;
    top: 0;
    z-index: 1;
    width: calc(100% + 32px);
}

.portalContentTabs .ui-tabs ul li a{
    font-size: 16px;
    line-height: 10px;
    left: 0px;
    right: 0px;
    position: absolute;
}

.portalContentTabs .ui-tabs .ui-tabs-nav li {
    width: 50%;
    border-width: 1px;
    top: 0px;
    display: inline-grid;
    place-items: center;
    height: 48px;
    border-top: 3px solid transparent;
    cursor: pointer;
    position: relative;
}
.portalContentTabs .ui-tabs .ui-tabs-nav li:not(.ui-tabs-selected):first-of-type {
    box-shadow: -10px 0px 10px -5px rgba(0,0,0,0.05) inset, 0px -10px 10px -5px rgba(0,0,0,0.05) inset;
    border-top: none;
}
.portalContentTabs .ui-tabs .ui-tabs-nav li:not(.ui-tabs-selected) {
    box-shadow: 10px 0px 10px -5px rgba(0,0,0,0.05) inset, 0px -10px 10px -5px rgba(0,0,0,0.05) inset;
    border-top: none;
}
.portalContentTabs .ui-tabs .ui-tabs-nav li:not(.ui-tabs-selected) > a {
    padding-top: 3px;
}
.portalContentTabs .ui-tabs .ui-tabs-nav li:first-of-type > a {
    margin-left: auto;
}

.portalContentTabs .ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected,
.portalContentTabDetails .ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected {
    height: 48px;
    cursor: pointer;
    
}
.portalContentTabs.colored .ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected,
.portalContentTabDetails.colored .ui-tabs.ui-tabs-top .ui-tabs-nav li.ui-tabs-selected {
    background: #d9eac5;
}

.appointmentStatusCancelled {
    background: #fde5e8;
    color: #EE0018;
    border-radius: 5px;
    width: fit-content;
    font-size: 14px;
    padding: 0px 8px;
    line-height: 14px;
    height: 18px;display: flex;
    align-items: center;
    padding-bottom: 0em;
}

.appointmentStatusBooked {
    background: #9cef9c;
    color: #152c15e3;
    border-radius: 5px;
    width: fit-content;
    font-size: 14px;
    padding: 0px 8px;
    line-height: 14px;
    height: 18px;display: flex;
    align-items: center;
     padding-bottom:0em;
}

.appointmentStatusPending {
    background: #E6EDFB;
    color: #0344CE;
    border-radius: 5px;
    width: fit-content;
    font-size: 14px;
    padding: 0px 8px;
    line-height: 14px;
    height: 18px;display: flex;
    align-items: center;
    padding-bottom: 0em;
    white-space: nowrap;
}

.logoPublicMenu {
    max-height: 82px;
    min-height: 38px;
}

.registrationError {
    color: #DA1F29;
    padding-left: 10px;
    margin: 20px 0px 20px 0px;
}

.ui-message-error {
    padding: 4px 0px !important;
}

.registrationInputTable.ui-datatable tbody.ui-datatable-data {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.registrationInputTable.ui-datatable tbody td {
    padding: 0px;
}

.registrationInputTable.ui-datatable tbody tr:nth-child(odd) {
    padding-right: 5px;
}

.registrationInputTable.ui-datatable tbody tr:nth-child(even) {
    padding-left: 5px;
}

.keywordSearchPanel .ui-autocomplete .ui-inputfield, .keywordSearchPanel .ui-autocomplete {
    width: 100%;
    padding-bottom: 0em;
}

.appointmentSearchPanel {
    width: 100%;
    overflow: hidden;
}

.decisionList {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.decision {
    display: flex;
    flex-direction: column;
}

.appointmentSearchPanel .ui-selectonemenu,
    .furtherInfoPanel .ui-selectonemenu {
    width: 100%;
}

.registrationInputTable.ui-datatable .ui-inputfield {
    width: 100%;
    padding: 0px 5px 0px 5px;
}

.registrationInputTable.ui-datatable .ui-selectonemenu {
    width: 100%;
}

.registrationInputTable.ui-datatable .ui-selectonemenu label.ui-selectonemenu-label
    {
    padding: 5px;
}

a {
    color: #007E36;
    text-decoration: none;
}

.ui-button.ui-state-disabled {
    background-color: #E3E3E3;
}

.ui-tooltip .ui-tooltip-text {
    background-color: white;
    color: black;
    filter: drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.20));
    padding: 12px;
    border-radius: 5px;
}

.tooltipRegistration.ui-tooltip {
    width: 423px;
    height: 80px;
    padding: 16px;
}

.fa.fa-question-circle {
    font-size: 20px;
    padding-left: 10px;
    color: #171717;
}

.fa.fa-sign-out {
    color: #171717;
}

.page_content {
    display: grid;
    position: absolute;
    width: 100%;
    height: 100%;
    grid-template-columns: 100%;
    grid-template-rows: auto minmax(0px, 1fr) auto;
    overflow: hidden;
}

.mainContent {
    position: relative;
}

.mainContent>*, .contentform {
    max-width: 800px;
    width: 800px;
    margin: auto;
    margin-top: 20px;
}

.mainContent > .homeWrapper {
  overflow-x: hidden;
  margin: 0px -16px;
  width: calc(100% + 32px);
  max-width: unset;
}

.mainContent > .loginContent{
    margin: 0px -16px;
    width: calc(100% + 32px);
    background: #d9eac5;
    max-width: unset;
}

.main_content > .cmsContent {
    display: flex;
    width: calc(100% + 32px);
    margin-left: -16px;
    padding-bottom: 0px !important;
    height: 100%;
}

.homeWrapper.noChildBorder .panelDiv {
    border-top: 0px;
}

.homeMenu .ui-menu-list.ui-helper-reset,
.portalWorkflowPanel {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 12px;
    padding: 20px max(16px, calc(50% - 400px));
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem a,
.portalWorkflowPanel .portalWorkflowButton {
    background: #007E36;
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    padding: 16px 0px 12px 0px;
    border: none;
    place-content: space-around;
    align-items: center;
    border-radius: 0px;
    box-shadow: none;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem a:has(> .ui-icon),
.portalWorkflowPanel .portalWorkflowButton:has(> .ui-icon) {
    place-content: space-between;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem,
.portalWorkflowPanel .portalWorkflowButton {
    height: 84px;
    grid-column: span 2;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem a.ui-state-hover,
.portalWorkflowPanel .portalWorkflowButton.ui-state-hover {
    background: #007E36;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem a .ui-menuitem-text,
.portalWorkflowPanel .portalWorkflowButton .ui-button-text {
    min-height: 24px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.16px;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem:nth-child(n+3),
.portalWorkflowPanel .portalWorkflowButton:nth-child(n+3) {
    grid-column: span 1;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem:nth-child(n+3) a,
.portalWorkflowPanel .portalWorkflowButton:nth-child(n+3) {
    background: #92D056;
    color: #007E36 ;
}

.homeMenu.ui-menu .ui-menu-list .ui-menuitem:nth-child(n+3) a.ui-state-hover,
.portalWorkflowPanel .portalWorkflowButton.ui-state-hover:nth-child(n+3) {
    background: #92D056;
}

.portalWorkflowPanel .portalWorkflowButton.ui-button-text-only .ui-button-text {
    padding: 0px;
}

.portalWorkflowPanel .portalWorkflowButton .ui-icon {
    font-weight: normal;
}

.portalWorkflowPanelDicomUpload{
	display: grid;
    grid-template-columns: 1fr 1fr;
    margin:20px auto 20px auto;
    gap: 0px 25px;
}

.portalWorkflowButtonDicomUpload {
	height: auto;
	min-height:48px;
	border-radius: 30px;
	font-style: normal;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: -0.16px;
	box-shadow: none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.settingsMenu.ui-menu {
    background: #B0B0B0;
    padding: 1px 0px;
}

.settingsMenu .ui-icon-triangle-1-s::before{
    content: "\e969";
    color: #007E36 ;
}

.settingsMenu .ui-icon-triangle-1-e::before {
    content: "\e961";
    color: #007E36 ;
}

.settingsMenu .ui-panelmenu-header .ui-icon{
        left: unset;
        right: 0;
        margin: 12px 16px;
        width: 24px;
        height: 24px;
        font-family: 'patientportal';
        font-size: 24px;
        font-weight: 400;
        top: 0;
}

.settingsMenu.ui-panelmenu {
    background: #B0B0B0;
}

.settingsMenu.ui-menu .ui-menu-list,
.settingsMenu.ui-panelmenu .ui-menu-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.settingsMenu.ui-menu .ui-menu-list .ui-menuitem,
.settingsMenu.ui-panelmenu .ui-menu-list .ui-menuitem {
    margin: 0px;
    height: 47px;
}

.settingsMenu.ui-menu .ui-widget-header {
    display: none;
}

.settingsMenu.ui-menu .ui-menu-list .ui-menuitem a,
.settingsMenu.ui-panelmenu .ui-menu-list .ui-menuitem a,
.settingsMenu.ui-panelmenu h3 {
    color: black;
    height: 100%;
    width: 100%;
    background: white;
    align-items: center;
    display: flex;
}

.settingsMenu.ui-menu .ui-menu-list .ui-menuitem a.deleteMenu {
    color: red;
}

.settingsMenu.ui-menu .ui-menu-list .ui-menuitem a.ui-state-hover,
.settingsMenu.ui-panelmenu .ui-menu-list .ui-menuitem a.ui-state-hover,
.settingsMenu.ui-panelmenu h3.ui-panelmenu-header.ui-state-hover,
.settingsMenu.ui-panelmenu h3.ui-panelmenu-header.ui-state-active:hover,
.settingsMenu.ui-panelmenu h3.ui-panelmenu-header.ui-state-active {
    background: #d9eac5;
}

.settingsMenu.ui-menu .ui-menu-list .ui-menuitem a.deleteMenu.ui-state-hover {
    background: #fff2f2;
}

.settingsMenu .ui-panelmenu-panel h3{
  height: 47px;
  margin: auto;
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: normal;
}

.settingsMenu.ui-panelmenu .ui-panelmenu-content{
    margin:0px;
    padding: 0px;
}

.settingsMenu .ui-panelmenu-panel .ui-menuitem{
  height: 47px;
  margin: auto;
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: normal;
  width: 100%;
}

.settingsMenu .ui-panelmenu-panel h3 a{
  padding: .3em;
  border-left: 7px solid transparent;
}

.emptyMenuItem {
    pointer-events: none;
}

.accountHeader {
    padding: 16px 0px;
    display: grid;
    grid-template-rows: auto auto;
    grid-template-columns: auto minmax(0px, 1fr);
    gap: 16px;
    margin-top: 0px;
}

.accountHeader .ui-selectonemenu.accountSelectionMenu {
    margin: 0px;
    width: 100%;
}

.avatar {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 50%;
}

.accountImageFileUpload {
    display: none;
}

.accountImageLinkWrapper {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-left:16px;
    font-weight: bold;
    position: relative;
}

.accountImageLinkWrapper .commandLink {
    position:absolute;
    bottom:-8px;
    right:-8px;
    background-color: #f2f2f2;
    border-radius:50%;
    padding: 8px;
    box-sizing: content-box;
    font-size: 18px;
    line-height: 18px;
    width: 18px;
    height: 18px;
    color: #24195d;
}

.editableProfileImage {
    grid-row: 1/3;
}

.editableProfileImage > a {
    position: relative;
    display: flex;
    border-radius: 50%;
    overflow: hidden;
    outline-offset: -1px;
    outline: 2px solid white;
}

.editableProfileImage .grayBanner {
    background: #f2f2f2;
    position: absolute;
    bottom: 0px;
    width: 100%;
    display: grid;
    place-items: center;
    height: 24px;
}

.editableProfileImage .grayBanner > .pp {
    font-size: 14px;
    width: 14px;
    height: 14px;
    line-height: 14px;
}

.verifiedBadge {
    display: flex;
    gap: 8px;
    align-items: center;
}

.verifiedBadge i {
    color: #007E36;
}

.verifiedBadge i.verified {
    color: #92D056 ;
}

.verifiedBadge .verifiedText {
    color: #636363;
    padding-bottom: 0em;
}

.ui-panel .ui-panel-content {
    white-space: normal;
    padding: 0;
    height: 100%;
}

.topMenuRaster {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    height: auto;
    text-align: center;
}

.topMenuPublicRaster {
    display: grid;
    grid-template-columns: 1fr auto;
}

.topMenuLinks {
    grid-column: 2;
    height: 100%;
}

.languageButton {
    grid-column: 3;
    margin: auto;
    width: 100%;
    max-height: 50px;
}

.menuButtonsDynDiv {
    grid-column: 2;
    margin: auto;
    width: 100%;
    max-height: 50px;
}

.menuButtons {
    float: right;
}

.menuButtons .ui-menuitem-link {
  color: #171717;
}

.menuButtons .ui-menuitem {
    padding-right: 25px;
    background-color: #FFFFFF;
}

.menuButtons .ui-menuitem .ui-menuitem {
    padding-right: 0;
    margin: 0;
    border-top: 2px solid #007E36;
}

.menuButtons .ui-menuitem .ui-menu-child {
    box-shadow: unset;
}

.menuButtons .ui-state-hover .ui-menuitem-text, .menuButtons .ui-state-hover .ui-menuitem-icon
    {
    color: #92D056;
}

.menuButtons .ui-menuitem-text {
    color: #171717;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 21px;
    text-align: left;
}

.menuButtons .ui-menu .ui-menu-parent .ui-icon-triangle-1-e:before,
    .sidebarLeft .ui-menu .ui-menu-parent .ui-icon-triangle-1-e:before {
    color: #171717;
    content: "\f0da";
}

.menuButtons .ui-menu .ui-menu-list .ui-menuitem .ui-state-hover .ui-icon-triangle-1-e:before,
    .sidebarLeft .ui-menu .ui-menu-list .ui-menuitem .ui-state-hover .ui-icon-triangle-1-e:before
    {
    color: #4595E5;
    content: "\f0d7";
}

.menuButtons .ui-menu .ui-menu-parent .ui-icon-triangle-1-e,
    .sidebarLeft .ui-menu .ui-menu-parent .ui-icon-triangle-1-e {
    transform: scale(0.7);
}

.topButtonDyn {
    background: #FFFFFF;
    color: #4A4A4A;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 16px;
    font-weight: normal;
    float: right;
    width: max-content;
    margin-right: 0px;
    border-radius: 0px;
    height: 37px;
    text-align: center;
}

.topButtonDyn.ui-state-hover, .topButtonDyn.ui-state-active {
    color: #92D056;
    background: none;
}

.welcomeDiv {
    background: #d9eac5;
    color: #171717;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0px -16px;
}

.welcomeNews {
    background: #d9eac5;
    color: #171717;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 0px -16px !important;
    width: calc(100% + 32px) !important;
    padding: 0px max(16px, calc(50% - 400px + 16px));
    padding-bottom: 24px;
    max-width: unset;
}

.welcomeNews > a {
    font-size: 16px;
    font-weight: 700;
    grid-column-start: 1;
    display: none;
}

/* only show first four overviews */
.welcomeNews:not(.showAll) > div:nth-child(n+6) {
    display: none;
}
.welcomeNews > div:nth-child(n+6) ~ a {
    display: block;
}

.welcomeNews .appointmentCancelWrapper {
    grid-row: 1/3;
    grid-column: 2;
    align-items: end;
    align-self: start;
}

.notificationDiv{
    background: #d9eac5;
    padding: 12px 16px 16px 16px;
    width: calc(100% + 32px);
    margin: 15px -16px 0px -16px;
}

.pageTitle {
    padding: 24px 0px 24px 0px;
    width: 800px;
    margin: 0px auto;
    text-align: left;
    font-weight: 700;
}

.progressBar ~ .pageTitle {
    padding-top: 14px;
}

.pageDescription {
    padding: 0px 0px 32px 0px;
    width: 800px;
    margin: 0px auto;
    text-align: left;
}

.pageTopButtons {
    padding: 0px 0px 16px 0px;
    width: 800px;
    margin: 0px auto;
}

.pageTopButtons .button{
	margin-left: auto;
}

.salutationTitle > :not(br) {
  font-size: 32px;
}

.salutationTitle:not(:has(> *)){
    font-size: 32px;
}

.salutationTitle {
    width: auto;
    height: auto;
    padding: 24px calc(50% - 400px) 36px calc(50% - 400px);
    text-align: left;
    font-weight: 700;
    line-height: 40px;
    letter-spacing: -0.02em;
}

.main_content {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: auto;
    padding: 0px 16px;
    overflow-x: hidden;
    position: relative;
}

.main_content > div:last-of-type {
    padding-bottom: 40px;
    flex-grow: 1;
}

.stickyContent {
    position: sticky;
}

.documentsContent {
    background: #d9eac5;
    margin: 0px -16px;
    padding: 0px 16px;
}

.topMenuContainer {
    width: 800px;
    height: 90px;
    margin: auto;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
}

.headingSeparator {
    color: #007E36;
    border-width: 0px 0px 1px 0px;
    border-style: solid;
     width: 100%;
}

.headingGrid{
    display:grid; 
    grid-template-columns:1fr auto 1fr; 
    align-items:center;
    margin: 20px 0px;
}

.infoTextFormSubmission {
    color: #171717;
    font-size: 16px;
    margin: 20px 20px 0px 30px;
    background-color: #ffffc4;
    padding: 20px;
    width: max-content;
}

.columnStyleTop {
    vertical-align: top;
}

.accountInfoTexts.ui-panelgrid tbody td {
    padding-left: 0px;
}

.displayNone {
    display: none;
}

.newDocumentMarker {
    background-color: #92D056 ;
    width: 4px;
    margin: -8px 0px;
    flex-shrink: 0;
    align-self: stretch;
}
.newDocumentMarker.hidden {
    background-color: transparent;
}

.sideBar {
    display: none;
}

.topMenuLanguagePopup.ui-menu.ui-menu-dynamic {
    background-color: #FFFFFF;
    font-size: 18px;
}

.pdf_table table {
    width: auto;
    table-layout: auto;
    font-size: 18px;
    line-height: 40px;
}
.pdf_table table tbody tr {
    border-bottom: 1px solid #007E36;
}
.pdf_table .fa.fa-file-text-o, .fa.fa-download, .fa.fa-edit {
    color: #007E36;
}

.ui-datatable .ui-column-filter {
    border: 1px solid #007E36;
}

.newsHeaderText {
    font-weight: 700;
    font-size: 24px;
    line-height: 24px;
    text-align: left;
    letter-spacing: -0.01em;
    color: #007E36;
    margin-bottom: 8px;
    grid-column:1/3;
}

.ui-fileupload-content {
    display: none;
}

.ui-fileupload-buttonbar {
    padding: 0px;
    padding-bottom: 12px;
}

.dropzone {
    margin: auto;
    max-width: 800px;
}
.dropzone .ui-button {
    background: #92D056;
    color: #007E36 ;
    height: 48px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: start;
    box-shadow: none;
    padding: 12px 16px !important;
    gap: 12px;
    font-weight: normal;
}
.dropzone .ui-button.ui-state-hover {
    background: #92D056;
}
.dropzone .ui-button .ui-button-icon-left {
    color: #007E36;
}
.dropzone .ui-button-text.ui-c {
    font-size: 16px !important;
    text-align: center;
    font-weight: 700;
}

.fileList {
    padding: 12px 0px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fileWrapper {
    padding: 12px;
    background: white;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.24), 0px 1px 3px 0px
        rgba(0, 0, 0, 0.12);
    gap: 12px;
    display: flex;
    flex-direction: column;
}
.fileWrapper>div {
    display: flex;
    flex-direction: column;
}
.fileWrapper .topRow {
    display: grid;
    grid-template-columns: minmax(0px, 1fr) auto;
    gap: 12px;
}
.fileWrapper .topRow a {
    text-decoration: none;
}
.fileWrapper .topRow .fileName {
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: 700;
    color: #007E36 ;
}
.fileWrapper .topRow .displayname {
    font-size: 14px;
    color: #636363;
}

.menuButtons .ui-button, .menuButtonsDocument .ui-button {
    display: block;
    box-shadow: none;
    color: #007E36;
}

.ui-menu.ui-menu-dynamic {
    background: white;
    border-radius: 5px;
    box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.50);
    overflow: hidden;
}
.ui-menu.ui-menu-dynamic .ui-menuitem {
    margin: 0px;
}
.ui-menu.ui-menu-dynamic .ui-menuitem.ui-state-hover {
    background: #d9eac5;
}
.ui-menu.ui-menu-dynamic .ui-menuitem-link {
    border: none;
    padding: 6px 8px;
    gap: 8px;
    color: #171717;
    height: 36px;
    width: 100%;
}

.ui-button-text-icon-left .ui-icon {
    position: initial;
    margin: 0;
}

.progressBar {
    display: flex;
    padding: 30px max(16px, calc(50% - 400px + 16px)) 10px max(16px, calc(50% - 400px + 16px));
    top: 0;
    background: white;
    margin: 0px -16px;
    z-index: 1;
}

.progressBar .fa::before {
    margin: auto;
    font-size: 14px;
}

.progressStepFinished.progressStepWarning .fa,.progressStepFinished.progressStepWarning .fa:hover {
    background: #F67F8B;
    border: #F67F8B;
}

.progressStep {
    border-top: 2px solid #E3E3E3;
    width: 100%;
}

.progressStepActive {
    border-top: 2px solid #007E36 ;
    width: 100%
}

.progressStep .fa, .progressStep .fa:hover {
    width: 20px;
    height: 20px;
    display: flex;
    border-radius: 20px;
    border: 2px solid #E3E3E3;
    background: #E3E3E3;
    margin: -11px auto 0px auto;
    color: #E3E3E3;
}

.progressStepActive .fa, .progressStepActive .fa:hover {
    border: 2px solid #007E36 ;
    background: #007E36 ;
    color: #007E36 ;
}

.progressStepFinished .fa, .progressStepFinished .fa:hover {
    border: 2px solid #92D056 ;
    background: #92D056 ;
    color: white;
}

.bold {
    font-weight: bold;
}

.appointmentList .ui-selectonemenu label.ui-selectonemenu-label {
    border-radius: 5px;
}

.filter-header {
    display: flex;
    align-items: center;
    gap: 10px;
}

.filter-reset {
    margin: 0px 20px 0px auto;
}

.filter-reset .fa-undo, .fa-undo.fa:hover {
    font-size: 1.25em;
}

.filterOption {
    background: #FFFFFF;
    border: 1px solid #4A4A4A;
    border-radius: 5px;
    margin: 15px 20px 20px 0px;
    float: left;
    height: 31px;
}

.filterOption label.ui-selectonemenu-label {
    height: 21px;
    font-size: 16px;
    background: #FFFFFF;
}

.element-item {
    background: white;
    display: grid;
    grid-template-columns: auto minmax(0px, 1fr) auto auto;
    align-items: center;
    margin: 10px 0px;
    padding: 5px 10px;
    gap: 10px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.25);
}
.element-item .element-icon {
    padding: 0px 5px;
}
.element-item .element-text {
    display: grid;
    grid-template-columns: auto auto auto minmax(0px, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    cursor: pointer;
}

.menuButtonsDocument {
    height: 24px;
    flex-shrink: 0;
}

.menuButtonsDocument .fa.fa-ellipsis-h {
    width: 25px;
}

.menuButtonsDocument .pp-navigation-menu-vertical-filled {
    font-weight: initial;
}

.topRightButton {
    position: absolute;
    top: 12px;
    right: 16px;
    width: 24px;
}

.topRightButton button {
    color: #007E36;
}

.topRightInfoButton {
    display: none;
    position: absolute;
    top: 12px;
    right: max(16px, calc(50% - 400px + 16px));
    color: #007E36;
    font-weight: normal;
}
.topRightInfoButton>label {
    display: flex;
}

.expansion {
    grid-row: 2;
    grid-column: 1/5;
    display: grid;
    grid-template-columns: auto minmax(0px, 1fr);
    border-top: 1px solid #C9C9C9;
    padding: 10px 5px 5px 5px;
    gap: 5px 10px;
}
.expansion.hidden {
    display: none;
}

.element-search {
    background: #FFFFFF;
    border: 1px solid #C9C9C9;
    border-radius: 5px;
    box-sizing: border-box;
    font-family: StandardFont, FontAwesome;
}

.loginOptionSeparator {
    text-align: center; 
}

.formProgessWrapper {
    width: 100%;
    height: 6px;
    display: flex;
    max-width: 800px;
    margin: auto;
    margin-bottom: -6px;
}

.formProgess {
    background: #92D056 ;
    height: 100%;
    border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
}

.mobileViewerWrapper {
    height: calc(100% + 40px);
    display: flex;
    margin: 0px -16px !important;
    width: calc(100% + 32px) !important;
    padding: 0px calc(50% - 400px + 16px);
    box-sizing: content-box;
}


.mobileViewerWrapper .mobileViewer{
    border: none;
    height: 100%;
    width: 100%;
}

.mobileViewerFullSize {
    height: 100%;
    width: 100%;
    border: none;
}

.mobileViewer {
  border: none;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  height: 640px;
  width: 100%;
}

.checkdataDiv {
    display:grid; 
    grid-template-columns: 60% 40%; 
    gap: 138px; width: calc(100% - 138px);
}

.checkdata {
    display: grid;
    grid-template-columns: auto auto;
    gap: 4px 12px;
}

.checkdata .data_label,
.checkdata .data_value {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: black;
}

.checkdata .data_label {
    color: #636363;
}

.statusCircle {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    display: grid;
    color: white;
    align-self: center;
    margin: auto auto 12px auto;
}

.statusCircle.line {
    margin-top: 36px;
}

.statusCircle.line::before {
    content: "";
    position: absolute;
    height: 3px;
    background: #E3E3E3;
    width: calc(100% + 32px);
    z-index: -1;
    left: -16px;
    margin-top: 44px;
}

.statusCircle .pp {
    font-size: 48px;
    width: 48px;
    line-height: 48px;
    height: 48px;
    place-self: center;
}

.statusCircle.error {
    background: #F67F8B;
}

.error_text {
    color: #F67F8B;
}

.statusCircle.success {
    background: #92D056 ;
}

.loginportal_input {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.resetColumn{
    display: flex;
}

.general_link {
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.16px; 
}

.ui-password .ui-password-icon {
    font-family: 'PatientPortal' !important;
    color: #007E36;
    font-size: 24px;
    top: 0px;
    margin-top: 0;
}

.ui-password.ui-password-unmasked .ui-password-icon::before {
    content: "\e95b"
}

.ui-password.ui-password-masked .ui-password-icon::before {
    content: "\e95c"
}

.filetypeslist {
    display: flex;
    flex-direction: column;
}

.deleteAccountLink {
    color: red;
    display: block;
    margin-top: 28px !important;
}

.pwdPolicy.ui-datalist ul{
    margin:0px;
    padding: 9px 0px 0px 0px;
    list-style-type: none;
}

.pwdPolicy.ui-datalist li{
    line-height: 28px;
    padding-left: 20px; 
}

.pwdPolicy.ui-datalist .ui-datalist-item > :first-child::before {
    content: '';
    background: #92D056 ;
    border-radius: 50px;
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 8px;
    margin-left: -20px;
}

.no_popup > .ui-datepicker-trigger {
    display: none;
}

bold {
    font-weight: bold;
}

.stepsShower {
    margin-top: -13px;
}

.qrCodeWrapper {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 16px 0px;
}

.qrCodeWrapper img {
    width: 150px;
    height: 150px;
    margin: -12px;
}

.validation_separator{
    width: 100%;
    margin-top: 80px;
    border: none;
    border-top: 1px solid #C9C9C9;
}

.authenticatorDownload {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    place-items: center;
    background: #d9eac5;
    padding: 16px;
    margin: -16px;
    margin-top: 64px;
}

.authenticatorDownload .descriptionText {
    grid-column: 1/3;
}

.largeActionButton {
    background: #92D056;
    color: #007E36 ;
    height: 48px;
    margin-top: 8px;
    display: flex;
    padding: 0px 24px;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: space-between;
    padding-bottom: 0em;
}

.largeActionButton:hover {
    background: #92D056;
}

.largeActionButton .activeWrapper {
    display: flex;
    gap: 8px;
    align-items: center;
}

.largeActionButton .activeWrapper .pp {
    margin-bottom: -0em;
}

.sidebarMenu.ui-sidebar-left {
    padding: 0px;
    background: #007E36 ;
    color: #FFFFFF;
    display: block;
    overflow-y: auto;
    width: 100%;
    max-width: 848px;
    box-shadow: none;
}

.sidebarMenu.ui-sidebar .ui-button {
    background: #007E36 ;
    height: 48px;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 0px;
    font-size: 16px;
    font-weight: normal;
    margin-right: 0;
}

.sidebarMenu.ui-sidebar .ui-button-text-only .ui-button-text {
    padding: 0px;
}

.sidebarMenu .ui-sidebar-close, .sidebarMenu .ui-sidebar-close:focus,
    .sidebarMenu .ui-sidebar-close:hover {
    float: left;
    font-size: 24px;
    color: #FFFFFF;
    padding: 0px 8px 0px 16px;
    width: 48px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
}

.sidebarMenu .ui-menu .ui-menu-list .ui-menuitem {
    height: 48px;
    display: flex;
    align-items: center;
    margin: 0px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    width: 100%;
    padding-left: 16px;
}

.sidebarMenu .ui-menu .ui-menuitem-link {
    padding: 0px;
    border: 0px;
    color: #FFFFFF;
    gap: 8px;
}

.sidebarMenu .fa.fa-sign-out {
    color: #FFFFFF;
}

.sidebarMenu .ui-icon-triangle-1-e::before {
    content: "\e961";
}

.sidebarMenu .ui-icon-triangle-1-s::before {
    content: "\e969";
}

.sidebarMenu .ui-menuitem {
    margin: 0px;
}

.sidebarMenu .ui-panelmenu-content {
    top: 0px;
    margin-top: 0px;
    padding: 0px;
}

.sidebarMenu .ui-panelmenu-header a {
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    color: #FFFFFF;
    height: 48px;
    font-weight: normal;
    font-size: 16px;
    padding: 0px 0px 0em 16px;
    display: flex;
    align-items: center;
}

.sidebarMenu .ui-panelmenu .ui-panelmenu-header .ui-icon {
    left: unset;
    right: 0;
    margin: 12px 16px;
    width: 24px;
    height: 24px;
    font-family: 'patientportal';
    font-size: 24px;
    font-weight: 400;
    top: 0;
}

.sidebarMenu .ui-panelmenu-header.ui-state-active {
    background: #92D056;
    color: #FFFFFF;
}

.sidebarMenu .ui-panelmenu .ui-menuitem-link {
    height: 48px;
    display: flex;
    align-items: center;
    font-size: 16px;
    padding: 0px 0px 0em 36px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    width: 100%;
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.2);
}

.closeIconMenu {
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    display: flex;
}

.emptyMenuItem {
    height: 48px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
}

.sidebarMenu .ui-icon-closethick {
    align-items: center;
    display: flex;
    height: 48px;
}

.closeLabel {
    color: #FFFFFF;
    font-size: 14px;
    line-height: 21px;
    display: flex;
    align-items: center;
    height: 48px;
}

.showSideBar.ui-button-text-icon-left .ui-icon {
    color: #007E36;
}

.showSideBar.ui-button-text-icon-left .ui-button-text {
    padding: 0;
    font-weight: normal;
    padding-bottom: 0em;
}

.showSideBar {
    box-shadow: none;
    float: left;
    margin-left: 16px;
    height: auto;
    background: none;
    color: #171717;
    display: flex;
    align-items: center;
    gap: 8px;
    bottom: 0px;
}

.showSideBar.ui-state-hover, .showSideBar.ui-state-active {
    background: none;
}

.sideBar {
    display: flex;
    align-items: center;
}

.ui-sidebar-active {
  left: max(calc(calc(100% - 848px) / 2), 0px);
}

.doubleMenu {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0px 22px;
    padding: 0px 24px 24px 24px;
}

.doubleMenu .ui-button:first-of-type{
    border-top: 1px solid rgba(255, 255, 255, 0.35);
}

.doubleMenu > * {
  grid-column: 1;
}

.doubleMenu .ui-panelmenu-panel {
    position: relative;
}

.doubleMenu .ui-panelmenu-content {
  position: absolute;
  width: 100%;
  right: calc(-100% - 22px);
  overflow: visible !important;
  border-top: 1px solid rgba(255, 255, 255, 0.35);
}

.doubleMenu .ui-panelmenu-header.ui-state-active {
  margin-right: -22px; 
  margin-top: -1px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.doubleMenu .ui-panelmenu .ui-panelmenu-header.ui-state-active .ui-icon {
    right: 22px;
}

.doubleMenu .ui-panelmenu-header:not(.ui-state-active) + .ui-panelmenu-content {
    display: none !important;
}

.doubleMenu .ui-panelmenu .ui-menuitem-link {
    padding-left: 16px;
}

.doubleMenu .ui-panelmenu .ui-menu-list:has(.ui-menuitem-icon) .ui-menuitem-link {
	padding-left: 36px;
}

.doubleMenu .ui-icon-triangle-1-s::before,
.doubleMenu .ui-icon-triangle-1-e::before {
    content: '\e965';
}

.doubleMenu .ui-menu:first-of-type {
  border-top: 1px solid rgba(255,255,255,0.35);
}

.doubleMenuTop {
    display: flex;
    height: 90px;
    align-items: center;
    justify-content: space-between;
    padding: 22px;
}

.doubleMenuTop .ui-sidebar-close,
.doubleMenuTop .ui-sidebar-close:focus, 
.doubleMenuTop .ui-sidebar-close:hover {
    border-bottom: none;
}

.sidebarMenu.hideInMobileView {
    transition: none;
}

.sidebarMenu.hideInMobileView > .ui-sidebar-close,
.sidebarMenu.hideInMobileView > .ui-sidebar-close:focus,
.sidebarMenu.hideInMobileView > .ui-sidebar-close:hover {
    display: none;
}

.footerLogo {
    background: #EDEDED;
    display: flex;
    padding: 10px 17px !important;
    align-items: center;
    margin: 60px -16px 0px -16px;
}

.footerLogo img {
    height: 36px;
}

footer {
  background: #007E36 ;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0px min(calc(-50vw + 400px), -16px) !important;
  padding: 16px;
  width: 100vw;
  height: fit-content;
  grid-column: 1/3;
}

.footerMenu .ui-menu-list {
    display: flex;
    gap: 8px 24px;
    flex-wrap: wrap;
    justify-content: space-around;
}

.footerMenu .ui-menu-list .ui-menuitem {
    width: fit-content;
}

.footerMenu .ui-menu-list .ui-menuitem a {
    color: #FFFFFF;
    display: flex;
    gap: 8px;
    height: 100%;
    width: fit-content;
    border: none;
    padding: 0px;
    place-content: space-between;
}

.footerMenu .ui-menu-list .ui-menuitem a .ui-menuitem-icon {
    width: fit-content;
}

.footerMenu.ui-menu .ui-menu-list .ui-menuitem a .ui-menuitem-text {
    height: 24px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.16px;
}

.signatureParent {
    border: 1px dotted #4A4A4A;
    margin-top: 20px;
    border-radius: 5px;
    background: white;
    padding: 8px;
    padding-bottom: 24px;
}

#signature input {
    position: relative !important;
}

.loginportal_input.ui-panelgrid .ui-panelgrid-cell {
    padding: 4px 0px;
}

.ui-tooltip-arrow {
    display: none;
}

.loginWithImage{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr auto;
}

.loginImage {
   grid-row: 1/3;
   width: auto;
   margin: 0px 16px 0px -16px;
   position: sticky;
   top: 0;
   align-self: start;
}

.loginWithImage .loginPanel > *{
    margin: 0px;
}

.loginWithImage .footerLogo{
    grid-column: 1 /3;
}

.loginWithImageMenu{
	width: 100%;
  	padding: 0px 50px;
}

.registrationWarningPanel {
	background: #fde5e7;
	padding: 6px 16px 11px 16px;
    width: calc(100% + 32px);
    margin: 15px -16px 0px -16px;
}

.generalWarningPanel {
	background: #fde5e7;
    padding: 11px max(16px, calc(50% - 400px));
}

.generalWarningPanel .ui-panel-titlebar {
	cursor: pointer;
}

.generalWarningPanel .ui-panel-titlebar-icon {
	margin: auto !important;
}

.generalWarningPanel .ui-panel-content p {
	margin-top: 16px;
	margin-bottom: 0px;
}

.generalWarningPanel .ui-icon {
	font-family: 'Patientportal';
    font-size: 24px;
    height: 24px;
    width: 24px;
}

.generalWarningPanel .ui-icon-plusthick::before {
	content: "\e961" !important;
}

.generalWarningPanel .ui-icon-minusthick::before {
    content: "\e969" !important;
}

.sharePasswordInfo {
    padding: 15px;
    padding-bottom: 10px;
    margin-top: 25px;
    margin-bottom: 25px;
    border: #b80f2e solid 2px;
    border-radius: 5px;
}


.patientDataTable.ui-datatable table {
    width: 100%;
    overflow: hidden;
    border-collapse: separate;
    border-spacing: 0px 10px;
    padding-left: 5px;
}

.patientDataTable.ui-datatable tbody td {
    padding: 0px 0px 0px 0px;
    font-size: 18px;
    overflow: visible;
    background: #007E36;
}

.patientDataTable.ui-datatable tbody td:first-child {
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
}

.patientDataTable.ui-datatable tbody td:last-child {
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}

.patientDataTable.ui-datatable thead {
    display: none;
}

tr.patientDataRow {
    line-height: 25px;
    border-top: 5px solid;
    color: #FFFFFF;
}

.fullSizeViewer {
    height: 100%;
    overflow: hidden;
}

.fullSizeViewerDiv {
    background-color: #007E36;
    color: #FFFFFF;
    font-size: 18px;
    padding: 5px 15px 5px 40px;
    -ms-grid-row: 1;
}

.fullSizeViewer.ui-panel .ui-panel-content {
    display: grid;
    display: -ms-grid;
    -ms-grid-rows: auto 1fr;
    -ms-grid-columns: 100%;
    grid-template-rows: auto 1fr;
}

.topMenuRasterFullSize {
    display: none;
}

.patientDataInfoColumn.small-column {
    width: 20%;
}

.patientDataInfoColumn.bottom-align {
    vertical-align: bottom;
}

.patientDataInfoColumn .ui-dataview .ui-dataview-header {
    display: none;
}

.patientDataInfoColumn .ui-dataview-column {
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.patientDataInfoColumn .ui-g-12 {
    padding: 0.1em;
}

.patientDataTable.ui-datatable .patientDataInfoColumn {
    padding: 8px 15px 10px 8px;
    width: auto;
}

.patientDataTable.ui-datatable .patientDataInfoColumn table {
    border-spacing: 0;
}

.patientDataTable.ui-datatable .patientDataInfoColumn td {
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.patientDataTable.ui-datatable .patientDataInfoColumn td:last-child {
    width: 33%;
    text-align: right;
    padding-right: 5%;
}

.patientDataTable.ui-datatable .patientDataButtonsColumn .ui-button-icon-only.ui-button.ui-state-default
    {
    width: 53px;
    height: 53px;
}

.entryTogglerColumn {
    width: 15px;
    padding: 10px 33px 10px 30px !important;
    position: relative;
}

.patientDataButtonsColumn {
    width: 73px;
}

.patientDataButton {
    box-shadow: none;
}

.patientDataButton .fa.fa-download, .patientDataButton .fa.fa-male,
    .patientDataButton .fa.fa-edit, .patientDataButton .fa.fa-expand,
    .patientDataButton .fa.fa-compress {
    font-size: 36px;
    color: #FFFFFF;
    margin-top: -16px;
    transform: none;
}

.mainContent .ui-row-toggler.ui-icon.ui-icon-circle-triangle-e {
    background-image: url(/medizinakte/image/arrow_right_30x30.png);
    background-position: center;
    height: 33px;
    width: 33px;
}

.mainContent .ui-row-toggler.ui-icon.ui-icon-circle-triangle-s {
    background-image: url(/medizinakte/image/arrow_down_30x30.png);
    background-position: center;
    height: 33px;
    width: 33px;
}

.newEntryMarker {
    border-radius: 4px/4px;
    background-color: #FF8F00;
    position: absolute;
    transform: translate(-35px, -23px);
    line-height: 15px;
    font-size: 15px;
    padding: 0px 3px 3px 3px;
    text-align: center;
}

.patientDataInfoGrid .ui-datagrid-data {
    width: 100%;
    table-layout: fixed;
}

.patientDataInfoGrid .ui-datagrid-column {
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
}

.checkBoxEmail {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: 0.02em;
    color: #636363;
    display: flex;
    margin: 15px 0px;
}

.verticalDivider {
    border-right: 1px solid #E3E3E3;
}

.subTitle {
    font-size: 16px;
    color: #007E36 ;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: block;
    padding-bottom: 20px; 
}

.diaryContent {
    background: #92D056;
    margin: 0px -16px;
    padding: 0px 16px;
}

.diaryContent .pp-bookmarks-2,
.diary_maincontent .pp-bookmarks-2 {
    color: #969696;
}

.diary_list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.diary_entry {
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.25);
    display: flex;
    gap: 8px;
    align-items: center;
    background: white;
    padding: 8px 8px 8px 12px;
    height: 60px;
}
.diary_entry_texts {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    white-space: nowrap;
    overflow: hidden;
}
.diary_entry_texts > * {
    text-overflow: ellipsis;
    overflow: hidden;
}
.diary_entry_texts .headerText {
    color: #007E36 ;
}

.diary_maincontent {
    display: grid;
    grid-template-columns: auto auto;
    gap: 9px;
    margin-top: 12px;
}
.diary_maincontent > * {
    grid-column: 1/3;
}
.diary_maincontent textarea {
	resize: none;
	font-family: inherit;
}

.diary_date {
    grid-column: 1;
}

.diary_important {
    grid-column: 2;
    place-self: end;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.painscale_buttons {
    display: flex;
}

.painscale_button {
    margin-right: 0px !important;
    border-radius: 0px;
    box-shadow: none;
    background: none; 
    width: calc(100% / 11);
    font-weight: 400;
}
.painscale_button:nth-of-type(1) {
    background: rgba(0, 74, 128, 0.05 );
    color: #007E36 ;
}
.painscale_button:nth-of-type(2) {
    background: rgba(0, 74, 128, 0.1);
    color: #007E36 ;
}
.painscale_button:nth-of-type(3) {
    background: rgba(0, 74, 128, 0.2);
    color: #007E36 ;
}
.painscale_button:nth-of-type(4) {
    background: rgba(0, 74, 128, 0.3);
    color: #007E36 ;
}
.painscale_button:nth-of-type(5) {
    background: rgba(0, 74, 128, 0.4);
    color: #007E36 ;
}
.painscale_button:nth-of-type(6) {
    background: rgba(0, 74, 128, 0.5);
    color: #FFFFFF;
}
.painscale_button:nth-of-type(7) {
    background: rgba(0, 74, 128, 0.6);
    color: #FFFFFF;
}
.painscale_button:nth-of-type(8) {
    background: rgba(0, 74, 128, 0.7);
    color: #FFFFFF;
}
.painscale_button:nth-of-type(9) {
    background: rgba(0, 74, 128, 0.8);
    color: #FFFFFF;
}
.painscale_button:nth-of-type(10) {
    background: rgba(0, 74, 128, 0.9);
    color: #FFFFFF;
}
.painscale_button:nth-of-type(11) {
    background: #007E36 ;
    color: #FFFFFF;
}
.painscale_button.active {
    background: #92D056 ;
    color: #24195D;
    font-weight: 700;
}
.painscale_button > .ui-button-text {
    padding: 0px 0px 0em 0px;
}

.painscale_lables {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}
.painscale_lables > * {
    color: #171717 !important;
}

.fileSeparator {
    border-top: 1px #636363 dashed;
    padding-top: 24px;
    margin-top: 7px; 
}

.registrationOption.ui-selectonemenu,
.registrationOption.ui-selectonemenu.ui-state-hover,
.registrationOption .ui-inputfield,
.registrationOption.ui-selectonemenu .ui-icon::before{
    background: #007E36 ;
    color: #FFFFFF
}

.uploadStep{
	color: #007E36;
	font-size: 30px;
	font-weight: 500
}

.uploadStepDescription{
    color: #007E36;
    font-size:17px;
    font-style:italic;
    font-weight:bold;
    margin: 0px auto 20px auto; 
}

.uploadInfo{
	color:#007E36;
	font-size:22px;
	font-weight:bold;
	display:none
}

.portalLoginPanel{
	color: #171717;
}

.descriptionValueFields {
    display: grid;
    grid-template-columns: auto auto;
    gap: 4px 12px;
}

.valueFields {
    display: grid;
}

@media only screen and (min-width: 850px) {
    .hideInLargeView {
        display: none !important;
    }
    
	.limitTextWidth{
	     padding: 20px max(16px, calc(50% - 300px));
         margin: unset;
	}
}

@media screen and (max-width: 40em) {
    .dropzone .ui-fileupload-buttonbar .ui-button {
        padding: 0;
    }
    .dropzone .ui-fileupload-buttonbar .ui-button .ui-button-text {
        display: block;
    }
}

@media only screen and (max-width: 850px) {
    .button,
    .ui-datepicker-buttonpane > button {
        height: 36px !important;
        min-width: 160px;
    }

    .ui-growl {
      bottom: 76px;
    }
    .main_header {
        border-bottom: 1px solid #C9C9C9;
    }
    
    .appointmentTitleHeader {
        margin: 0px;
        width: 100%;
        font-weight: 400;
        gap: 0px;
    }
    .settingsMenu {
       margin: 0px -16px !important;
       width: calc(100% + 32px) !important;
    }
    .accountSelectionMenu, .accountSelectionMenu.ui-state-focus {
        height: 36px;
        width: 158px;
        border: unset;
        border-radius: 3px;
        overflow: hidden;
        margin: 6px 16px 6px auto;
    }
    .accountSelectionMenu label.ui-selectonemenu-label {
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
    }
    .accountSelection {
        display: none;
    }
    .ui-selectonemenu-panel.ui-widget.ui-input-overlay {
        border-radius: 5px;
        overflow: hidden;
        box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.50);
        max-width: 100%;
    }
    .topMenuContainer {
        flex-direction: row;
        width: 100%;
        height: auto;
    }
    .mainContent > *, .contentform {
        width: 100%;
    }
    .topMenuRaster {
        grid-template-rows: auto auto;
        grid-template-columns: 1fr;
    }
    .logoCustomer {
        grid-column: 2;
        min-height: 48px;
    }
    .logoCustomer > a {
        display: flex;
    }
    .pageTitle {
        padding: 20px 0px;
        width: 100%;
    }
    .pageTopButtons {
        margin: 0px auto;
        display: flex;
        width: 100%;
        padding-bottom: 20px;
    }
    .languageButton, .menuButtonsDynDiv, .topButtonsDynDiv {
        display: none;
    }
    .topMenuMobile.ui-menu .ui-menu-list {
        box-shadow: none;
    }
    .pdf_table table tbody tr {
        border-bottom: 1px solid #007E36;
        line-height: 20px;
    }
    .pdf_table table {
        font-size: 16px;
    }
    .pdf_table.ui-datatable thead th {
        padding: 0px 0px 20px 0px;
    }
    .infoTextFormSubmission {
        width: auto;
    }
    .heading_H1 {
        letter-spacing: initial;
        line-height: 40px;
    }
    .text_emphasized {
        font-size: 14px;
    }
    .text_medium, .label_link {
        font-size: 16px;
    }
    .pageDescription {
        display: none;
    }
    .welcomePanel {
        width: calc(90% + 20px);
        margin: auto;
    }
    .loginPanel {
        width: 100%;
        padding: 24px 0px 24px 0px;
        margin: 0 auto auto auto;
        box-shadow: none;
    }
    .loginPanel > * {
        width: 100%;
    }
    .loginPanel .ui-inputfield{
     background: #F2F2F2;
    }
    
    .loginPanel .ui-panelgrid .ui-panelgrid-cell {
        padding: 2px;
    }
    .newsTable .ui-datatable .ui-datatable-header {
        height: 33px;
    }
    .scheduleAppointmentTable {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: -20px;
    }
    .dateTimePanel {
        flex-direction: column;
    }
    .timeSlotPanel {
        order: 3;
        max-height: 0px;
    }
    .main_footer {
        width: 100%;
        padding: 0px 16px;
    }
    .ui-g {
        display: block;
    }
    .ui-inputfield {
        margin-bottom: 0px;
        font-size: 16px;
    }
    .logoPublicMenu {
        height: 48px;
        padding: 12px;
    }
    .tooltipRegistration.ui-tooltip {
        width: auto;
        height: auto;
        padding: 10px;
        padding-top: 5px;
    }
    .logoDiv {
        grid-column: 2;
    }
    .logoDiv > a {
        display: flex;
    }
    .hideInMobileView {
        display: none !important;
    }
    
    .timeSlot {
        height: auto;
        width: 100%;
        gap: 8px;
    }
    .timeSlot .ui-g {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }
    .timeSlot .ui-g-12 {
        width: auto;
        padding: 0px;
    }
    .appointmentPicker .ui-datepicker td > * {
        margin: 4px;
    }
    .salutationTitle {
        margin: auto;
        width: 100%;
        font-weight: 700;
        line-height: normal;
        letter-spacing: -0.01em;
        padding: 20px 0px 16px 0px;
    }
    
    .salutationTitle > :not(br) {
        font-size: 16px;
    }
    
    .salutationTitle:not(:has(> *)){
        font-size: 16px;
    }
    
    .welcomeDiv {
        padding: 0px 16px 0px 16px;
    }
    
    .topRightInfoButton {
        display: initial;
    }   
    
     .mainContent > .loginContent{
       margin: auto;
       padding: 0px;
       width: 100%;
       background: #FFFFFF;
    }
    
    .checkdata {
        gap: 4px 26px;
    }
    
    .documentTexts .createUploadLabel{
       grid-column: 1/3;
       padding-bottom: 0px;
       font-size: medium;
    }
    
    .statusLabel{
       grid-column: 2/3;
       grid-row: 1;
    }
    .documentTexts {
        grid-template-columns: minmax(0px, 1fr) auto;
    }
    
    .documentTexts .headerText {
       padding-bottom: 0px;
    }
    
    .appointmentOverview {
        flex-direction: column;
        align-items: initial;
    }
    
    .appointmentBody {
        display: flex;
        flex-direction: column;
        align-items: initial;
        gap: 8px;
    }
    
    .appointmentHeader {
       height: 40px;
       padding-right: 8px;
    }
    
    .homeWrapper.noChildBorder .panelDiv:first-of-type {
        background: #d9eac5;
    }
    
    .homeMenu .ui-menu-list.ui-helper-reset,
	.portalWorkflowPanel {
	    grid-template-columns: 1fr 1fr;
	}
	
	.homeMenu.ui-menu .ui-menu-list .ui-menuitem,
	.portalWorkflowPanel .portalWorkflowButton {
	    grid-column: span 1;
	}
	
	.loginWithImage{
    	display: unset;
    }
    
    .loginImage{
    	display:none;
    }
    
    .loginWithImageMenu{
  		padding: 0px;
	}
	
	.validation_separator{
	   margin-left: -16px;
	   width: calc(100% + 32px);
	}
	
	.videoConferenceFrame{
	  width: 100%;
	}
	
    .patientDataTable.ui-datatable tbody td {
        font-size: 16px;
        padding-right: 0px;
    }
    
        .patientDataTable.ui-datatable table {
        border-spacing: 0px 5px;
    }
    
    .patientDataTable.ui-datatable .patientDataInfoColumn {
        padding: 5px 10px 5px 10px;
    }
    
    .patientDataTable.ui-datatable .patientDataInfoColumn table {
        border-spacing: 0;
    }
    
    .patientDataTable.ui-datatable .patientDataButtonsColumn .ui-button-icon-only.ui-button.ui-state-default
        {
        width: 30px;
    }
    
    .patientDataButtonsColumn {
        width: 34px;
    }
    .entryTogglerColumn {
        width: 10px;
        padding: 5px 23px 5px 10px !important;
        position: relative;
    }
    .newEntryMarker {
        transform: translate(-13px, -17px);
    }
    .patientDataButton .fa.fa-download, .patientDataButton .fa.fa-edit, .patientDataButton .fa.fa-male,
    .patientDataButton .fa.fa-expand, .patientDataButton .fa.fa-compress {
        font-size: 20px;
        margin-top: -10px;
    }
    .appointmentList,
    .appointmentOverview {
        display:flex;
    }
    .welcomeNews {
        display: flex;
        flex-direction: column;
    }
    /* only show first three overviews */
	.welcomeNews:not(.showAll) > div:nth-child(n+5) {
	    display: none;
	}
    .welcomeNews > div:nth-child(n+5) ~ a {
        display: block;
    }

    .panelDiv {
        padding: 20px 16px;
    }

    .appointmentButtons {
        gap: 24px;
        grid-template-columns: 1fr 1fr;
        justify-items: unset;
        margin-top: 24px;
    }

    .appointmentButtons .ui-button:nth-of-type(3n) {
        margin-left: 0;
    }
    
    .appointmentButtons .ui-button:nth-of-type(2n) {
        margin-left: auto;
    }
    
    .uploadStep {
		font-size: 20px;
	}
	
	.uploadStepDescription {
		font-size: 14px;
	}
	
	.uploadInfo{
	   font-size: 18px;
	}
}