@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    font-family: "Open Sans",sans-serif;
}

:root {
    --scrollbar-color: grey;
    --scrollbar-hover-color: darkgrey;
    --portal-primary-color: #00775e;
    --portal-primary-hover-color: #22a09c;
    --portal-sidebar-color: white;
    --portal-sidebar-bg-color: #3869ab;
    --portal-fenster-logo: block;
    --portal-holzbau-logo: none;
    --plan-element-scale-factor: 1;
}

    :root:has(.user-fenster) {
        --scrollbar-color: grey;
        --scrollbar-hover-color: darkgrey;
        --portal-primary-color: #00775e;
        --portal-primary-hover-color: #22a09c;
        --portal-sidebar-color: white;
        --portal-sidebar-bg-color: #3869ab;
        --portal-fenster-logo: block;
        --portal-holzbau-logo: none;
    }

    :root:has(.user-holzbau) {
        --scrollbar-color: #4a4a4a;
        --scrollbar-hover-color: darkgrey;
        --portal-primary-color: #804000;
        --portal-primary-hover-color: #d4541b;
        --portal-sidebar-color: #4a4a4a;
        --portal-sidebar-bg-color: #e7ddd1;
        --portal-fenster-logo: none;
        --portal-holzbau-logo: block;
    }

    :root:has(.object-fenster) {
        --scrollbar-color: grey;
        --scrollbar-hover-color: darkgrey;
        --portal-primary-color: #00775e;
        --portal-primary-hover-color: #22a09c;
        --portal-sidebar-color: #3869ab;
        --portal-sidebar-bg-color: #dcece8;
        --portal-fenster-logo: block;
        --portal-holzbau-logo: none;
    }

    :root:has(.object-holzbau) {
        --scrollbar-color: #4a4a4a;
        --scrollbar-hover-color: #d4541b;
        --portal-primary-color: #804000;
        --portal-primary-hover-color: #d4541b;
        --portal-sidebar-color: #4a4a4a;
        --portal-sidebar-bg-color: #e7ddd1;
        --portal-fenster-logo: none;
        --portal-holzbau-logo: block;
    }

.k-tilelayout {
    padding: 0 !important;
    margin: 0 !important;
    background-color: white !important;
}

.k-toolbar {
    flex-shrink: 0;
}

.k-toolbar-items {
    gap: 6px;
}

::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: #D7D7D7;
    border: 5.75px solid transparent;
    background-clip: padding-box;
    border-radius: 8px;
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-color);
    border: 4px solid transparent;
    background-clip: padding-box;
    border-radius: 8px;
    transition: background 250ms;
}

    ::-webkit-scrollbar-thumb:hover {
        background: var(--scrollbar-hover-color);
        border: 4px solid transparent;
        background-clip: padding-box;
        border-radius: 8px;
    }

body {
    font-family: "Open Sans", sans-serif;
    height: 100vh;
    overflow: hidden;
}

.navbar {
    background-color: #B5BBAD !important;
}

.nav-link {
    color: var(--portal-sidebar-color) !important;
}

.kibutton {
    color: #FFFFFF;
    /*         background: linear-gradient(90deg, #4B5AFA 0%, #AC58FF 100%);
                 */ background: linear-gradient(90deg, #00775e 0%, #74bfc7 100%);
    /* background-origin: border-box */
}

.sidebar {
    background: var(--portal-sidebar-bg-color) !important;
    color: var(--portal-sidebar-color) !important;
}

.brand-holzbau {
    display: var(--portal-holzbau-logo);
}

.brand-fenster {
    display: var(--portal-fenster-logo);
}

.childbeleg-liste-header {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    padding-bottom: 15px;
}

.outlook-attachment-header {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    border-bottom: 1px solid #e1e1e1;
    padding-bottom: 15px;
    margin-bottom: 20px;
}

.AttButton {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    background-color: white;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    color: #374151;
    font-size: 14px;
    font-weight: 500;
    margin: 2px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    .AttButton img {
        margin-right: 8px;
        width: 24px !important;
        height: 24px !important;
    }

    .AttButton:hover {
        background-color: #e5e7eb;
    }

    .AttButton:active {
        background-color: #e5e7eb;
    }

    .AttButton:focus {
        outline: none;
        box-shadow: 0 0 0 1px var(--portal-primary-color);
        background-color: #dcece8;
    }

.navbar-brand {
    color: white !important;
}

.nav-link {
    /*color: #4a4a4a !important;*/
    /* color: #3869ab !important;*/
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
    text-decoration: none;
}

.btn-primary {
    align-items: center;
    background-color: #dcece8;
    color: #3869ab;
    border-color: #3869ab;
    color: #3869ab;
    border-radius: 8px;
    border-width: 1;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    box-sizing: border-box;
    color: #3869ab;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    font-family: expo-brand-demi,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size: 16px;
    height: 32px;
    justify-content: center;
    line-height: 1;
    margin: 0;
    outline: none;
    overflow: hidden;
    padding: 0 32px;
    text-align: center;
    text-decoration: none;
    transform: translate3d(0, 0, 0);
    transition: all 150ms;
    vertical-align: baseline;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    text-decoration: none;
}

    .btn-primary:active {
        background-color: #f47217;
    }

    .btn-primary:hover {
        /*        background-color: #3869ab;
*/ transform: translateY(-2px);
        background-color: #3869ab;
    }

    .btn-primary.footer-button {
        width: 100%;
        border-radius: 4px 4px 4px 4px;
        margin: 0;
        padding: 10px 0;
    }

    .btn-primary.footer-buttonleft {
        width: 25%;
        border-radius: 4px 4px 4px 4px;
        margin: 0;
        padding: 10px 0;
    }

.ObjektDropdown .k-list-container {
    max-height: 300px;
}

.swal2-container {
    z-index: 11000 !important;
}


.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

h1 {
    font-size: 2.1em;
    color: #000000;
    font-weight: 600;
    font-family: Open Sans,sans-serif;
}



h2 {
    font-size: 30px;
    color: #3869ab;
    font-family: "Open Sans", sans-serif;
    text-align: left;
    font-weight: 100;
}



h3 {
    font-size: 25px;
    color: #000;
    font-family: "Open Sans", sans-serif;
    text-align: left;
    font-weight: 100;
}



h4 {
    font-size: 18px;
    color: #00775e;
    font-family: Helvetica;
    font-weight: 100;
}

.sidebar {
    width: 192px;
    color: black;
    background-color: #B5BBAD;
    text-decoration: none;
}

.btn-navbar {
    align-items: center;
    background-color: var(--portal-primary-color);
    border-radius: 4px;
    border-width: 1;
    border-color: var(--portal-primary-color);
    box-sizing: border-box;
    color: white;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    font-family: expo-brand-demi,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size: 16px;
    height: 32px;
    justify-content: center;
    line-height: 1;
    margin: 0;
    outline: none;
    overflow: hidden;
    padding: 0 32px;
    text-align: center;
    text-decoration: none;
    transform: translate3d(0, 0, 0);
    transition: all 150ms;
    vertical-align: baseline;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    text-decoration: none;
}

    .btn-navbar:hover {
        color: var(--portal-primary-color);
        background-color: white;
    }


@media (max-width: 420px) {
    .btn-navbar {
        height: 48px;
    }
}

.btn-clicky {
    align-items: center;
    appearance: none;
    background-image: linear-gradient(#ff6600, #f26100);
    border: 0;
    border-radius: 6px;
    box-shadow: rgba(204, 82, 0, .4) 0 2px 4px,rgba(204, 82, 0, .3) 0 7px 13px -3px,rgba(204, 82, 0, .5) 0 -3px 0 inset;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    /*display: block;*/
    font-family: "Open Sans",sans-serif;
    height: 48px;
    justify-content: center;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
    text-decoration: none;
    transition: box-shadow .15s,transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow,transform;
    font-size: 18px;
    text-align: center;
}

    .btn-clicky:focus {
        box-shadow: #3c4fe0 0 0 0 1.5px inset, rgba(204, 82, 0, .4) 0 2px 4px, rgba(204, 82, 0, .3) 0 7px 13px -3px, #ff6600 0 -3px 0 inset;
    }

    .btn-clicky:hover {
        box-shadow: rgba(204, 82, 0, .4) 0 4px 8px, rgba(204, 82, 0, .3) 0 7px 13px -3px, #ff6600 0 -3px 0 inset;
        transform: translateY(-2px);
    }

    .btn-clicky:active {
        box-shadow: #ff6600 0 3px 7px inset;
        transform: translateY(2px);
    }

.btn-secondary {
    align-items: center;
    background-color: gray;
    border-radius: 8px;
    border-width: 0;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1),0 3px 6px rgba(0, 0, 0, .05);
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    font-family: expo-brand-demi,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    font-size: 16px;
    height: 32px;
    justify-content: center;
    line-height: 1;
    margin: 0;
    outline: none;
    overflow: hidden;
    padding: 0 32px;
    text-align: center;
    text-decoration: none;
    transform: translate3d(0, 0, 0);
    transition: all 150ms;
    vertical-align: baseline;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
}

    .btn-secondary:hover {
        transform: translateY(-2px);
    }

.btn-danger {
    margin: 0;
    display: block;
    align-items: center;
    appearance: button;
    background-color: #dc3545;
    border-radius: 8px;
    border-style: none;
    box-shadow: rgba(255, 255, 255, 0.26) 0 1px 2px inset;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-shrink: 0;
    font-family: "Open Sans",sans-serif;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
    padding: 10px 21px;
    text-align: center;
    text-transform: none;
    transition: color .13s ease-in-out,background .13s ease-in-out,opacity .13s ease-in-out,box-shadow .13s ease-in-out;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    justify-content: center;
}

    .btn-danger:hover {
        transform: translateY(-2px);
    }

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    overflow: hidden !important;
    white-space: nowrap;
    line-height: 60px;
    background-color: #B5BBAD !important;
    color: white !important;
}



.image {
    margin-top: 230px;
}

.login {
    border-left: groove;
}

.registrieren {
    border-left: groove;
}

.nav-link1 {
    align-items: center;
    appearance: button;
    background-color: #2e50a8;
    border-radius: 8px;
    text-decoration: none;
    border-style: none;
    box-shadow: rgb(99, 117, 203, 0.40) 0 2px 4px,rgb(64, 91, 117, 0.30) 0 7px 13px -3px,rgb(84, 98, 156, 0.50) 0 -3px 0 inset;
    color: black;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-shrink: 0;
    font-family: "Open Sans",sans-serif;
    font-size: 100%;
    line-height: 1.15;
    margin: 5px;
    padding: 10px 21px;
    text-align: center;
    text-transform: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    justify-content: center;
    text-decoration: none;
}

    .nav-link1:hover {
        transform: translateY(-2px);
        color: whitesmoke !important;
    }

    .nav-link1:active {
        box-shadow: #3869ab 0 3px 7px inset;
        transform: translateY(2px);
        text-decoration: none;
    }

.login1 {
    border-right: groove;
}

.btn-primary1 {
    align-items: center;
    appearance: button;
    background-color: #005bbf;
    border-radius: 8px;
    border-style: none;
    box-shadow: #0071c1 0 1px 2px inset;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline;
    flex-direction: row;
    flex-shrink: 0;
    font-family: "Open Sans",sans-serif;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
    text-align: center;
    text-transform: none;
    transition: color .13s ease-in-out,background .13s ease-in-out,opacity .13s ease-in-out,box-shadow .13s ease-in-out;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    justify-content: center;
}

    .btn-primary1:hover {
        background-color: #0071c1;
        color: antiquewhite;
        transform: translateY(-2px);
    }

.no-group-header .k-grouping-header {
    display: none;
}

.sticky-right {
    right: 0;
    transform: none;
}

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

.modal-logo {
    margin-left: -0px;
}

.modal-title {
    color: #244a9a;
    font-size: 20px;
    margin-top: 10px;
}

.DropDownListAuswahl {
    min-width: 260px;
}

.CloseTelerikModalIcon {
    top: 0;
}

.Close_Modal {
    position: absolute;
    top: 20px;
    right: 10px;
    border: none;
    background: transparent;
}

    .Close_Modal:hover {
        color: #145FB4;
        transition: all 0.3s ease;
        transform: scale(1.1);
    }

    .Close_Modal:active {
        transform: scale(0.9);
        transition: all 0.3s ease;
    }

.modal-title-container {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 10px;
}

/*.k-window-titlebar {
    border-style: none !important;
    padding: 16px 16px 0px 16px;
}*/

/* Hamburger Icon nur für kleine Bildschirme anzeigen */
.hamburger {
    display: none;
}

/* Media Query für Mobile */
@media screen and (max-width: 768px) {

    .container-mobile-header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        background-color: #FFFFFF;
    }

    .nav-slide-mobile {
        position: fixed;
        top: 0;
        left: 0;
        background-color: #ffffff;
        overflow-y: auto; /* Erlaube Scrollen, falls nötig */
        transform: translateY(-100%); /* Starte versteckt über dem Bildschirm */
        transition: transform 0.3s ease-in-out; /* Animiere das Ein- und Ausfahren */
        z-index: 9998; /* Unter dem Header, aber über dem Inhalt */
    }

        .nav-slide-mobile.active {
            transform: translateY(0); /* Wenn aktiv, schiebe das Menü nach unten */
            overflow-x: hidden;
        }

    .hide-mobile {
        display: none !important;
    }

    .hamburger {
        background-color: transparent;
        border: none;
        cursor: pointer;
        outline: none;
        color: inherit;
        display: block;
    }

    .sidebar {
        display: flex; /* Flex Container aktivieren */
        flex-direction: column; /* Elemente vertikal anordnen für das Slide-down Menu */
        width: 100vh !important; /* Breite auf 100% setzen für das Slide-down Menu */
        height: auto !important;
        transform: none; /* Keine Translation notwendig für das Slide-down Menu */
        transition: transform 0.3s ease-in-out; /* Animation für das Slide-down Menu */
    }

        .sidebar.active {
            transform: translateY(0); /* Slide-down Menu anzeigen */
        }

    .nav-item {
        flex: 1 !important; /* Elemente gleichmäßig verteilen */
    }

    .nav-link {
        display: flex !important; /* Flex Container für Links */
        align-items: center !important; /* Vertikal zentrieren */
        justify-content: center !important; /* Horizontal zentrieren */
        width: 100vw;
    }

    hr {
        width: 100vw;
    }

    .content {
        padding-top: 5rem;
    }
}

.Image-delete-icon-button {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
}

    .Image-delete-icon-button button {
        border: none;
        background: none;
        cursor: pointer;
        transition: transform 0.2s;
    }

        .Image-delete-icon-button button:hover {
            transform: scale(1.2); /* Vergrößert das Icon um 20% beim Hovern */
        }

.SmallMarginRightClass {
    margin-right: 10px;
}

.SmallMarginTopClass {
    margin-top: 7px;
}

.SameColorGrid .k-grid-content .k-grid-table tr,
.SameColorGrid .k-grid-content-locked .k-grid-table tr {
    background-color: #FFFFFF; /* Setze deine gewünschte Farbe */
}

.RemoveGridHeader .k-grid-header {
    display: none;
}

.unsupported-file-alert {
    background-color: #dcece8; /* Hintergrundfarbe */
    border-color: #3869ab; /* Randfarbe */
    padding: 20px;
    margin: 20px 0;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    text-align: center;
}

.action-buttons {
    display: flex;
    justify-content: center; /* Zentriert die Buttons horizontal */
    gap: 10px; /* Abstand zwischen den Buttons */
    margin-top: 20px;
}


.AllGridOnTop .k-grid .k-table-th:first-child, .k-grid td:first-child, .k-grid .k-table-td:first-child {
    vertical-align: top;
}

.AllGridOnTop .k-grid .k-table-th:nth-child(2), .k-grid td:nth-child(2), .k-grid .k-table-td:nth-child(2) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(3), .k-grid td:nth-child(3), .k-grid .k-table-td:nth-child(3) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(4), .k-grid td:nth-child(4), .k-grid .k-table-td:nth-child(4) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(5), .k-grid td:nth-child(5), .k-grid .k-table-td:nth-child(5) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(6), .k-grid td:nth-child(6), .k-grid .k-table-td:nth-child(6) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(7), .k-grid td:nth-child(7), .k-grid .k-table-td:nth-child(7) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(8), .k-grid td:nth-child(8), .k-grid .k-table-td:nth-child(8) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(9), .k-grid td:nth-child(9), .k-grid .k-table-td:nth-child(9) {
    vertical-align: top;
}

AllGridOnTop .k-grid .k-table-th:nth-child(10), .k-grid td:nth-child(10), .k-grid .k-table-td:nth-child(10) {
    vertical-align: top;
}

.no-headers-grid .k-grid-header {
    display: none;
}

.no-headers-grid .k-grid-content {
    overflow-y: auto;
}

.no-headers-grid .k-grid-footer-wrap {
    border-right-width: 0;
}

.GridOnTop .k-grid .k-table-th:nth-child(2),
.k-grid td:nth-child(2),
.k-grid .k-table-td:nth-child(2) {
    vertical-align: top;
}

.outlook-email-container {
    background-color: #ffffff;
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #333;
    line-height: 1.5;
    width: 100%;
    height: calc(100vh - 400px);
    padding: 20px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.outlook-email-header {
    /*  border-bottom: 1px solid #e1e1e1; */
    padding-bottom: 15px;
    margin-bottom: 2px;
}

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

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

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

.email-avatar-placeholder-sm {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #666;
}

.email-avatar-placeholder {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #666;
}

.email-to {
    color: #333;
    font-size: 14px;
    margin-left: 5px;
}

.email-from {
    font-weight: bold;
    color: var(--portal-primary-color);
    font-size: 16px;
    margin-left: 5px;
}

.email-subject {
    font-size: 18px;
    font-weight: bold;
    color: #333333;
    margin-bottom: 10px;
    display: block;
}

.email-details {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.email-body {
    color: #333;
    font-size: 14px;
}

    .email-body h1, .email-body h2, .email-body h3 {
        color: #444;
        font-weight: bold;
    }

    .email-body p {
        margin: 0;
        padding: 0;
        line-height: 1.4;
    }

    .email-body ul, .email-body ol {
        margin: 1em 0;
        padding-left: 20px;
    }

    .email-body img {
        max-width: 100%;
        height: auto;
        margin: 10px 0;
        display: block;
    }

    .email-body a {
        color: #1a73e8;
        text-decoration: underline;
    }


.email-body-scrollable {
    max-height: 750px;
    overflow-y: auto;
}

.email-from-line {
    display: flex;
    align-items: center;
    gap: 10px;
}

div.template-dropzone,
.template-dropzone .k-dropzone-inner {
    /* remove flexbox layout */
    display: block;
}

    .template-dropzone .k-dropzone-inner .k-icon {
        /* remove default DropZone icon margin */
        margin-bottom: 0;
        /* enlarge DropZone icon from default size 48px */
        font-size: 64px;
    }

.dropzone-content.vertical {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.template-dropzone .dropzone-content {
    margin: 3em;
    text-align: center !important;
}

.dropzone-content .line {
    display: block;
    margin-bottom: .4em;
}

.dropzone-content p {
    margin-top: 1em;
    font-size: .9em;
}

.text-button {
    background: none;
    border: none;
    color: #333;
    font-size: 14px;
    padding: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: 500;
}

    .text-button svg {
        fill: var(--portal-primary-color);
        width: 18px;
        height: 18px;
    }

    .text-button:hover {
        color: #333;
    }

    .text-button:focus {
        outline: none;
    }

.email-frame {
    flex: 1 auto;
    width: 100%;
    border: none;
    overflow: auto;
}

.attachment-container {
    flex: 1 auto;
    width: 100%;
    border: none;
    overflow: auto;
}


.dragandmagic {
    width: 173px;
    border-radius: 6px;
    overflow: hidden;
    border: solid #91919138 1px;
}

.SelectedChipColor .k-chip {
    color: white;
    background-color: #3869ab;
}

.RecommendedChipColor {
    flex-wrap: nowrap;
}

    .RecommendedChipColor .k-chip {
        color: #979797;
        background-color: #f2fbff;
        border: dotted 2px;
    }

#rv1 {
    position: relative;
    width: 100%;
    height: 880px;
}

.bgimg {
    /*  background-image: url('/images/grundriss.png'); */
    position: relative;
    width: fit-content;
}

.MassTextBox {
    position: absolute;
}

.no-scroll-grid .k-grid-header {
    border-right-width: 0;
}

.no-scroll-grid .k-grid-content {
    overflow-y: auto;
}

.no-scroll-grid .k-grid-footer-wrap {
    border-right-width: 0;
}

div.template-dropzone,
.template-dropzone .k-dropzone-inner {
    /* remove flexbox layout */
    display: block;
    text-align: center !important;
}

    .template-dropzone .k-dropzone-inner .k-icon {
        /* remove default DropZone icon margin */
        margin-bottom: 0;
        /* enlarge DropZone icon from default size 48px */
        font-size: 64px;
    }

/* Custom styling */
.template-dropzone .dropzone-content {
    margin: 3em;
}

.dropzone-content .line {
    display: block;
    margin-bottom: .4em;
}

.dropzone-content p {
    margin-top: 1em;
    font-size: .9em;
}

.no-headers-grid .k-grid-header {
    display: none;
}

.no-headers-grid .k-grid-content {
    overflow-y: auto;
}

.no-headers-grid .k-grid-footer-wrap {
    border-right-width: 0;
}

.GridOnTop .k-grid .k-table-th:nth-child(2),
.k-grid td:nth-child(2),
.k-grid .k-table-td:nth-child(2) {
    vertical-align: top;
}

.selected-dnm-row .k-table-td {
    background-color: #dcece8 !important;
}

.dnm-trash {
    position: absolute;
    top: 5px;
    right: 0;
}

    .dnm-trash:hover {
        color: red;
        cursor: pointer;
    }

.dnm-item {
    position: relative;
}

.dnm-content {
    display: flex;
    gap: 16px;
    height: 100%;
}

.dnm-list-container {
    flex: 0 0 270px;
    display: flex;
    flex-direction: column;
}

    .dnm-list-container > .k-grid {
        overflow: hidden;
    }

.dnm-fileview-container {
    overflow: auto;
    display: flex;
    flex-direction: column;
    flex: auto 1;
}

.dnm-selectpannel {
    border: 1px solid rgba(0, 0, 0, .08);
    background-color: rgba(251, 251, 251, .4196078431);
    padding: 8px;
}

.fileviewer-container {
    height: 100%;
    overflow-y: auto;
}

    .fileviewer-container .outlook-email-container {
        height: 2000px;
    }

.dnm-chiplist-container {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 4px;
}

.dnm-chiplist-scroll {
    max-width: 100%;
    overflow: auto;
    padding-bottom: 4px;
    /*    scrollbar-width: thin;*/
}

.dnm-element-grid {
    max-height: 250px;
}

.kategorie-chip-list {
    flex-wrap: nowrap;
}

    .kategorie-chip-list .k-chip {
        color: white;
        background-color: white;
        font-size: 12px;
        padding: 0;
    }

.kategorie-chip {
    padding: 4px;
    display: flex;
}

    .kategorie-chip > .delete-img {
        width: auto;
        height: 12px;
        cursor: pointer;
        width: 0px;
        margin-left: 0px;
        transition: width 0.1s;
        transition: margin-left 0.1s;
    }

    .kategorie-chip:hover > .delete-img {
        margin-left: 4px;
        width: 12px;
    }

    .kategorie-chip > .delete-img:hover {
        filter: brightness(0) saturate(100%) invert(21%) sepia(89%) saturate(7494%) hue-rotate(0deg) brightness(100%) contrast(104%);
    }

.kategorie-dd-button {
    height: 22px;
    border-radius: 5px;
}

.mail-list-start {
    flex: 1 1 0;
    font-size: 14px;
    color: #333;
    min-width: 0;
    display: flex;
    flex-direction: column;
}


.mail-list-end {
    min-width: 80px;
    max-width: 155px;
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 4px;
}

.flex-justify-end {
    justify-content: flex-end;
}

.width-to-content {
    width: max-content;
}

.dark-gray {
    background-color: #d9d9d9
}

.small-icon {
    width: 12px;
    height: 12px;
    margin: 0 4px;
}

.no-wrap {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pure-upload-button {
    border: none;
}

    .pure-upload-button .k-upload-dropzone {
        padding: 0;
    }

    .pure-upload-button .k-upload-status,
    .pure-upload-button .k-upload-files,
    .pure-upload-button .k-dropzone-hint {
        display: none !important;
    }


.notification {
    bottom: 30px !important;
    right: 30px !important;
}

    .notification .k-notification {
        padding: 13px;
        border: none;
        border-radius: 0px;
    }

        .notification .k-notification:has(.hide) {
            animation: fadeOut 700ms forwards;
        }

    .notification .k-notification-content {
        display: flex;
        gap: 10px;
        width: 400px;
    }

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        visibility: hidden;
    }
}

.upload-notification {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
}

    .upload-notification .n-content {
        flex-grow: 1;
        min-width: 0;
    }

        .upload-notification .n-content b {
            color: var(--portal-primary-color);
            font-size: 15px;
            display: block;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

.mini-progress-bar {
    width: 100%;
    height: 5px;
    background: #d0e9d0;
    border-radius: 5px;
    overflow: hidden;
    margin-top: 5px;
}

    .mini-progress-bar .progress {
        width: 0%;
        height: 100%;
        background: var(--portal-primary-color);
        transition: width 0.2s ease-in-out;
    }


.fullsize {
    width: 100%;
    height: 100%;
}

.bgimg {
    /*  background-image: url('/images/grundriss.png'); */
    position: relative;
    width: fit-content;
}

.horizontal-timeline {
    height: 10px;
    background: lightgray;
    vertical-align: middle;
    margin: 0;
}

.position-line {
    position: relative;
    height: 10px;
    background: gray;
    margin: 0;
    vertical-align: middle;
}

.position-lineSentence {
    position: absolute;
    vertical-align: middle;
    height: 10px;
    font-size: small;
    text-align: center;
    top: 0px;
    border-style: solid;
    border-width: 0;
    background: none;
    border-color: none;
}

.TimelineMarker {
    position: absolute;
    /*   vertical-align: middle;
                                        width: 18px;
                                        height: 18px;
                                        top: -4px; */
    border-radius: 50%;
    border-style: solid;
    background-color: #dcece8;
    color: #3869ab;
    border-color: #3869ab;
    /*z-index: 1;*/
}

.PositionAbsolute {
    position: absolute;
}



.MassTextBox {
    position: absolute;
}

.TimeLineLabel {
    position: absolute;
    vertical-align: middle;
    height: 30px;
    font-size: small;
    text-align: center;
    top: 15px;
    color: black;
}

.Marker1 {
    background-color: #0A84FF;
    border-color: #0A84FF;
    color: white;
}

.separator {
    border: 0;
    height: 1px;
    background: #999999;
    margin-top: 10px;
    margin-bottom: 10px;
}

.k-badge-lg {
    font-size: 20px;
}

.max-height-200 > textarea {
    max-height: 400px;
    overflow-y: auto !important;
}

.grid-container {
    display: grid;
    grid-template-columns: repeat(3, 200px);
    grid-template-rows: repeat(2, 200px);
    gap: 10px;
}

.grid-item {
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    padding: 20px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .grid-item:hover {
        transform: translateY(-2.5px);
        box-shadow: 0 2px 5px rgba(0,0,0,0.50);
    }

    .grid-item:active {
        transform: translateY(-5px) scale(0.98);
        box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    }

.SameColorGrid .k-grid .k-table-th:first-child, .k-grid td:first-child, .k-grid .k-table-td:first-child {
    vertical-align: top;
}

.k-grid td.vertical-aligned-cell {
    vertical-align: top;
}

.grid-no-scroll .k-grid-content {
    overflow-y: auto;
}

.grid-no-scroll .k-grid-header,
.grid-no-scroll .k-grid-footer {
    padding-right: 0; /* version 2.26 and older requires !important here */
}

.grid-no-scroll .k-grid-header-wrap,
.grid-no-scroll .k-grid-footer-wrap {
    border-right-width: 0;
}

.expandable-content {
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

    .expandable-content.expanded {
        max-height: 1000px;
    }

    .expandable-content.collapsed {
        max-height: 0;
    }

.baunr {
    cursor: grab;
}

.org-modal h4 {
    color: black;
    font-size: 20px;
    margin-bottom: 20px;
}

.org-modal p {
    margin: 5px 0;
}

.org-modal a {
    color: #0056b3;
    text-decoration: none;
}

    .org-modal a:hover {
        text-decoration: underline;
    }

.org-modal .button-spacing {
    margin-top: 20px;
}

.org-modal .info-card {
    background: #f9f9f9;
    padding: 15px;
    border: 1px solid #ddd;
    min-width: 485px;
    margin: auto;
    margin-bottom: 20px;
}

.org-modal .info-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.org-modal .info-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    padding: 8px;
    background: white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.org-modal a {
    color: #00775E;
    font-weight: bold;
    text-decoration: none;
}

    .org-modal a:hover {
        text-decoration: underline;
    }

.hunkeler-base-popup > .k-window-actions {
    margin: 0;
    display: block;
    text-align: right;
}

.core-base-popup > .k-window-actions {
    margin: 0;
    display: block;
    text-align: right;
}

.objekt-positionen-content {
    height: calc(100vh - 100px);
    padding: 10px;
}

.flex-grow {
    flex: 1;
}

.flex-position {
    display: flex;
    gap: 25px;
    align-items: stretch;
}

    .flex-position > div {
        flex: 1;
        overflow: hidden;
    }

.image-grid {
    overflow-x: scroll;
    white-space: nowrap;
}

.ausmass-container {
    display: flex;
    gap: 20px;
    flex-direction: row;
    justify-content: center;
}

.ausmass-plan {
    border: solid 1px #00000014;
    padding: 4px;
    position: relative;
}

    .ausmass-plan img {
        width: auto !important;
        height: 350px;
    }

.plan-measurement {
    transform: translate(-50%, -50%);
    position: absolute;
}

.plan-measurement-textbox {
    border: none;
}

    .plan-measurement-textbox input {
        text-align: center;
    }

.badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    white-space: nowrap;
}

    .badge.badge-success {
        background-color: #28a745;
        color: white;
    }

    .badge.badge-warning {
        background-color: #ffc107;
        color: black;
    }

    .badge.badge-error {
        background-color: #dc3545;
        color: white;
    }

.fenster-segment {
    display: flex;
    width: 100%;
    height: 100%;
    background: white;
}

    .fenster-segment.segment-parent {
        width: fit-content;
        height: 420px;
        padding: 10px;
        border: 1px solid black;
        background: lightgray;
    }

.fenster-segment-content {
    background-image: url(/images/Fenster-BG.svg);
    background-size: cover;
    background-position: center center; 
    background-repeat: no-repeat;

    border: 1px solid black;
    height: 100%;
    width: 100%
}

.fenster-segment-devider {
    width: 100%;
    height: 100%;
}

.fenster-segment-devider:hover {
    cursor: pointer;
    background-color: lightgray;
}

.fenster-segment-devider-suggestion {
    position: absolute;
    pointer-events: visible;
}

    .fenster-segment-devider-suggestion .suggestion {
        position: absolute;
        width: 100%;
        height: 100%;
        border-bottom: 2px dashed transparent;
        border-left: 2px dashed transparent;
        transition: border-color 300ms;
    }

    .fenster-segment-devider-suggestion:hover .suggestion {
        border-bottom-color: red;
        border-left-color: red;
    }

    .fenster-segment-devider-suggestion.h {
        top: 50%;
        left: 15%;
        width: 70%;
        height: 20%;
        transform: translateY(-50%);
    }

        .fenster-segment-devider-suggestion.h .suggestion {
            height: 1px;
            transform: translateY(-50%);
            border-left-color: transparent !important;
            top: 50%;
            left: -21%;
            width: 142%;
        }

    .fenster-segment-devider-suggestion.v {
        top: 15%;
        left: 50%;
        width: 20%;
        height: 70%;
        transform: translateX(-50%);
    }

        .fenster-segment-devider-suggestion.v .suggestion {
            width: 1px;
            transform: translateX(-50%);
            border-bottom-color: transparent !important;
            left: 50%;
            top: -21%;
            height: 142%;
        }

.fenster-segment-open-suggestion {
    position: absolute;
    width: 100%;
    height: 100%;
    pointer-events: none;
    filter: contrast(0.1);
    opacity: 0;
    transition: opacity 200ms;
}

    .fenster-segment-content svg,
    .fenster-segment-open-suggestion svg {
        width: 100%;
        height: 100%;
        position: absolute;
    }

    .fenster-segment-open-suggestion .trigger {
        position: absolute;
        width: 80%;
        height: 80%;
        pointer-events: visible;
    }

        .fenster-segment-open-suggestion:has(.trigger:hover) {
            opacity: 1;
        }

        .fenster-segment-open-suggestion.t .trigger {
            top: 0;
            left: 10%;
            height: 10%;
        }

        .fenster-segment-open-suggestion.b .trigger {
            bottom: 0;
            left: 10%;
            height: 10%;
        }

        .fenster-segment-open-suggestion.l .trigger {
            left: 0;
            top: 10%;
            width: 10%;
        }

        .fenster-segment-open-suggestion.r .trigger {
            right: 0;
            top: 10%;
            width: 10%;
        }

.fenster-segment-settings {
    text-align: right;
    top: 0;
    right: 0;
    padding: 10px;
    opacity: 0;
    transition: opacity 200ms;
}

    .fenster-segment-settings button {
        pointer-events: visible;
    }

    .fenster-segment-content:hover .fenster-segment-settings {
        opacity: 1;
    }

.template-list {
    width: 1000px;
    margin: 20px auto;
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

.template-list-item {
    padding: 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    transition: box-shadow 0.15s;
}

    .template-list-item:hover {
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.50);
    }

.k-grid .k-selected .k-table-td {
    background-color: #dcece8 !important;
    color: black !important;
}

.offnungs-nr {
    font-size: 18px;
    padding: 2px 1px 0 0;
    background-color: white;
    border: solid 1px black;
    border-radius: 50%;
    position: absolute;
    text-align: center;
    width: 50px;
    height: 50px;
    bottom: 5px;
    right: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.smallnr {
    font-size: 10px;
    width: 14px;
    height: 14px;
    padding: 0;
}

#GrundrissEditor-container {
    overflow: hidden;
    position: relative;
    cursor: grab;
}

#GrundrissEditor {
    transform-origin: 0 0;
    position: relative;
    display: inline-block;
}

    #GrundrissEditor img {
        display: block;
        max-width: 100%;
    }

.fullsize {
    width: 1000px;
    max-width: none !important;
}

.plan-eintrag {
    position: absolute;
    transform: translate(-50%, -50%) scale(var(--plan-element-scale-factor));
    white-space: nowrap;
    cursor: grab;
}

.plan-trash {
    padding: 10px;
    margin: 10px;
    height: 100px;
}

.tui-image-editor-header-buttons,
.tui-image-editor-header-logo {
    display: none;
}

.tui-image-editor-menu {
    position: relative;
}

.image-editor-container {
    position: absolute;
    right: 10px;
    top: 0px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.image-editor-button {
    padding: 10px 16px;
    border: solid 1px black;
    color: white;
    background-color: #00775e;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .image-editor-button:hover {
        background-color: #005c47;
    }

    .image-editor-button:active {
        background-color: #004d3b;
    }

    .image-editor-button:focus {
        outline: none;
    }

.borderless-window .k-window-content {
    padding: 0;
}

.stop-mouse-events {
    pointer-events: none;
}

td:has(.position-grid-column) {
    position: relative !important;
}

.position-grid-column {
    cursor: pointer;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    padding: 7px;
}

    .position-grid-column * {
        cursor: pointer;
    }

.bilder-gallery-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.bilder-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, 320px);
    justify-content: center;
    gap: 10px;
    width: 100%;
    height: 100%;
    padding: 10px;
}

    .bilder-gallery img {
        object-fit: contain !important;
        border-radius: 10px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        transition: filter 0.3s ease-in-out;
    }

        .bilder-gallery img:hover {
            filter: brightness(0.7) contrast(1.2);
        }

.bilder-gallery-item {
    width: 320px;
    height: 320px;
    display: inline-block;
    position: relative;
}

.bilder-gallery-item button {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 10;
}

.beleg-edit-objektposition {
    background: #f5f5f5;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    position: relative;
}

    .beleg-edit-objektposition .copy-button {
        position: absolute;
        top: 10px;
        right: 10px;
    }

.tab-strip-content {
    overflow: hidden;
    max-height: 80vh;
    transition: max-height 200ms;
}

.tab-strip.hidden .tab-strip-content {
    max-height: 0;
}

.tab-strip-arrow {
    cursor: pointer;
}

.tab-strip-arrow .arrow {
    width: 22px;
    margin-right: 4px;
    text-align: center;
}

.upload-dropzone {
    height: auto;
}

    .upload-dropzone .k-dropzone-inner {
        display: block;
    }


.form-buttons {
    display: flex;
    flex-flow: row;
    gap: 4px;
    flex-direction: row;
    justify-content: flex-end;
}

#rv1 {
    position: relative;
    width: 100%;
    height: 880px;
}

.bgimg {
    position: relative;
    width: fit-content;
}

.MassTextBox {
    position: absolute;
}

.no-scroll-grid .k-grid-header {
    border-right-width: 0;
}

.no-scroll-grid .k-grid-content {
    overflow-y: auto;
}

.no-scroll-grid .k-grid-footer-wrap {
    border-right-width: 0;
}

.avatar {
    width: 60px;
    height: 60px;
    cursor: pointer;
    position: relative;
    transition: filter 0.3s ease-in-out;
}

    .avatar:hover {
        filter: brightness(1.2)
    }

    .avatar .upload-arrow {
        position: absolute;
        bottom: 15px;
        right: 15px;
        width: 30px;
        height: 30px;
        opacity: 0;
        transition: opacity 0.3s ease-in-out;
    }

    .avatar:hover .upload-arrow {
        opacity: 1;
    }

.ReturnToAvatar {
    float: right;
    text-decoration: none;
    transition: border-color 0.3s, transform 0.3s;
}

    .ReturnToAvatar:hover {
        transform: scale(1.1);
    }

.pb-1 {
    margin-top: 150px;
}

.signature-wrapper {
    width: 100%;
}

.notes {
    font-style: italic;
    padding: 1em;
    border-width: 1px;
    border-bottom-width: 0;
    border-style: solid;
    border-radius: 0;
    border-color: rgba(0, 0, 0, 0.08);
}