.context-menu
{
    /*width: 225px;*/
    position: absolute;
    top: 25px;
    left: 30px;
    z-index: 99999;
    display: none;
    background-color: #fff;
    color: #414C5C;
    padding: 3px;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.25);    
}

.context-menu-el
{
    /* padding: 5px; */
}

.context-menu a
{
    padding: 5px;
    display: flex;
    align-items: left;
    justify-content: left;
    width: 100%;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    color: #414C5C;
}

.context-menu a i
{
    margin-right: 5px;
}

.context-menu input
{
    font-size: 14px;
}

#tree-container {
    display: flex;
    height: calc(100vh - 255px);
    min-height: 300px;
}

#tree-container .resizable {
    cursor: col-resize;
}

#cell-tree {
    padding: 20px 20px 20px 5px;
    width: 25%;
    background-color: #fff;
    border-radius: 6px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #B4B7BE #fff;
}

.overlay-box #cell-tree {
    padding: 30px 0 30px 0;
}

#cell-media-files,
#cell-site-editor {
    color: #818893;
    font-size: 14px;
    padding: 20px;
    width: 75%;
    background-color: #fff;
    /*border-radius: 6px; - macht probleme in chrome in verbindung mit overflow-x hidden; */
}

#cell-media-files
{
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #B4B7BE #fff;
}

#cell-site-editor {
    display: flex;
    flex-direction: column;
    border-radius: 6px;
}

#site-editor-container {
    flex: 1;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #B4B7BE #fff;
}


/*
#breadcrumb
{
    font-size: 16px;
    line-height: 26px;
}
*/


.js-tree-node
{
    position: relative;
}

.js-tree-name
{
    user-select: none;
    cursor: pointer;
    /*color: #434C5B;*/
    position: relative;
    transition: all .25s;
}

.js-tree-content
{
    display: flex;
    align-items: center;
}

.js-tree-marker
{
    background: #fbe5e6;
    border: 1px dashed #D90010;
    border-radius: 18px;
    margin-left: 1px;
    height: 26px;
    width: 180px;
    padding: 0 1em;
}

.js-tree-marker.invalid
{
    background: #e11d1b;
}

.js-tree-expand
{
    width: 15px;
    height: 24px;
    /*margin: 0px 5px 14px 0px;*/
    cursor: pointer;
}

[data-bs-theme="dark"] .js-tree-expand svg path, [data-bs-theme="dark"] .js-tree-expand svg line
{
    stroke: #fff;
    fill: #fff;
}

.js-tree-select
{
    color: #D90010;
    /*border-left: 5px solid #fff;*/
}

.js-tree-select svg path, .js-tree-select svg line
{
    stroke: #D90010;
    fill: #f8cccf;
}

.js-tree-drop
{
    color: #D90010;
}

.js-tree-drop svg path, .js-tree-drop svg line
{
    stroke: #D90010;
    fill: #f8cccf;
}

.js-tree-editable
{
    border: 1px solid #D90010;
    background-color: #f8cccf;
}

.js-tree-fade
{
    opacity: 1;
    animation: fade 1s infinite;
}

.db-name
{
    padding: 0 5px 0 5px;
}

@keyframes fade
{
    0%   { opacity:1; }
    50%  { opacity:0; }
    100% { opacity:1; }
}

.js-tree-arrow
{
    display: block;
    position: absolute;
    top: 16px;
    left: 4px;
    animation: moveArrow 0.4s infinite alternate ease-in-out;
}

@keyframes moveArrow
{
    0% { top: 16px; }
    100% { top: 22px; }
}

.sitetreeUploader .upload-section {
    min-height: unset;
    padding: 20px 0;
}