@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
@import url('ionicons/css/ionicons.min.css'); /* импортвам икони */
@import url("bootstrap-icons/bootstrap-icons.min.css"); /* импортвам икони */

/* зареждам шрифтовете */
@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/Gilroy-Regular.woff2') format('woff2'), url('../fonts/Gilroy-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: fallback;
}

@font-face {
    font-family: 'Gilroy-light';
    src: url('../fonts/Gilroy-Light.woff2') format('woff2'), url('../fonts/Gilroy-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: fallback;
}

@font-face {
    font-family: 'Gilroy-UltraLight';
    src: url('../fonts/Gilroy-UltraLight.woff2') format('woff2'), url('../fonts/Gilroy-UltraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: fallback;
}

@font-face {
    font-family: 'Gilroy-Bold';
    src: url('../fonts/Gilroy-Bold.woff2') format('woff2'), url('../fonts/Gilroy-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: fallback;
}

@font-face {
    font-family: 'Gilroy-Heavy';
    src: url('../fonts/Gilroy-Heavy.woff2') format('woff2'), url('../fonts/Gilroy-Heavy.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: fallback;
}




/* hide scrollbars */
@media screen and (max-width: 992px) {
    .page {
        /*background-color: #2d3237 !important; */
    }
}
/* Add option to scroll, in your case just leave the x option */

.alert-primary {
    color: #212529 !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.alert-primary h3 {
    font-size: 1.2rem !important;
}

.btn-info {
    color: #fff !important;
    background-color: #ff8000 !important;
    border-color: #ff8000 !important;
}

.btn-info:hover {
    background-color: #ed7700 !important;
}

.scrollnoshow {
    overflow-x: scroll;
}
    /* Hide scrollbar for Chrome, Safari and Opera */

    .scrollnoshow::-webkit-scrollbar {
        display: none !important;
    }
/* Hide scrollbar for IE, Edge and Firefox */

.scrollnoshow {
    -ms-overflow-style: none;
    /* IE and Edge */
    
    scrollbar-width: none;
    
   
    /* Firefox */
}
/* hide scrollbars end*/

/* стил - reconnect */

/* position: absolute; */


#components-reconnect-modal {
    position: fixed;
    inset: 0px;
    z-index: 1050;
    display: block;
    overflow: hidden;
    background-color: transparent !important;
    opacity: 1 !important;
    text-align: center;
    font-weight: bold;
    transition: visibility 0s linear 500ms;
    visibility: visible;
    backdrop-filter: blur(0px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

    #components-reconnect-modal a {
        font-family: 'Gilroy';
        /* text-decoration: underline !important; */
        font-size: 1.4rem !important;
        line-height: 1.4rem !important;
        background-color: #000000 !important;
        color: #ff8000 !important;
        padding: 5px 10px !important;
        border-radius: 10px !important;
        margin: 10px !important;
        cursor: pointer !important;        
    }

        #components-reconnect-modal a:hover {
            background-color: #ff8000 !important;
            color: #fff !important;            
        }

    #components-reconnect-modal div {
        border-color: rgb(255 255 255) rgb(255 255 255) #ff8000 !important;
        margin-top: 35vh !important;
        border-width: 0.2em !important;
    }

    #components-reconnect-modal button {
        display: none !important;
    }

    #components-reconnect-modal h5 {
        font-size: 1.25rem;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        position: absolute;
        z-index: 99999 !important;
        bottom: 0;
        top: 0;
        right: 0;
        left: 0;
        display: flex;
        align-content: center;
        justify-content: center;
        align-items: center;
        padding: 40px;
        background-color: #0000 !important;
        color: #fff;
        font-family: 'Gilroy' !important;
        flex-direction: column;
    }


/* стил - reconnect край */

#save .save-icon {
    margin-right: 5px !important;
    color: #fff !important;
    font-size: 1.2rem !important;
}

@media screen and (min-width: 570px) {
    .footer-button-save:hover .save-icon {
        transform: scale(1.2) !important;
        transition: all .15s ease-in-out;
    }

    .footer-button-save:not(:hover) .save-icon {
        transition: all .15s ease-in-out;
    }
}

#clear .clear-icon {
    margin-right: 0px !important;
    color: #fff !important;
    font-size: 1.2rem !important;
}

@media screen and (min-width: 570px) {
    .clear-button:hover .clear-icon {
        transform: scale(1.2) !important;
        transition: all .15s ease-in-out;
    }

    .clear-button:not(:hover) .clear-icon {
        transition: all .15s ease-in-out;
    }
}

a:-webkit-any-link {
    text-decoration: none !important;
}



/**
 * ----------------------------------------
 * animation ring
 * ----------------------------------------
    <i class="bi bi-bell"></i>

    .bell-ringing { 
        position: fixed;
        z-index: 999;
        top: calc(25px - 16px);
        right: 65px;
        color: #fff;
        font-size: 1.3rem;
        cursor: pointer;
        text-shadow: 0px 4px 5px #00000061;
        -webkit-animation: ring 4s .7s ease-in-out infinite;
        -webkit-transform-origin: 50% 4px;
        -moz-animation: ring 4s .7s ease-in-out infinite;
        -moz-transform-origin: 50% 4px;
        -webkit-animation: ring 6s .7s ease-in-out infinite;
        animation: ring 6s .7s ease-in-out infinite;    
    }

 */

/**
 * ----------------------------------------
 * animation slide-fwd-center
 * ----------------------------------------
 */
@-webkit-keyframes slide-fwd-center {
    0% {
        transform: scale(0.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes slide-fwd-center {
    0% {
        transform: scale(0.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}


    /* heartbeat */

    /*
        -webkit-animation: heartbeat 2s ease-in-out 0s infinite normal forwards !important;
                animation: heartbeat 2s ease-in-out 0s infinite normal forwards !important;

    */

    @keyframes heartbeat {
        0% {
            animation-timing-function: ease-out;
            transform: scale(1);
            transform-origin: center center;
        }

        10% {
            animation-timing-function: ease-in;
            transform: scale(0.91);
        }

        17% {
            animation-timing-function: ease-out;
            transform: scale(0.98);
        }

        33% {
            animation-timing-function: ease-in;
            transform: scale(0.87);
        }

        45% {
            animation-timing-function: ease-out;
            transform: scale(1);
        }
    }

    @-webkit-keyframes heartbeat {
        0% {
            animation-timing-function: ease-out;
            transform: scale(1);
            transform-origin: center center;
        }

        10% {
            animation-timing-function: ease-in;
            transform: scale(0.91);
        }

        17% {
            animation-timing-function: ease-out;
            transform: scale(0.98);
        }

        33% {
            animation-timing-function: ease-in;
            transform: scale(0.87);
        }

        45% {
            animation-timing-function: ease-out;
            transform: scale(1);
        }
    }

    /* heartbeat end */


    @-webkit-keyframes ring {
        0% {
        -webkit-transform: rotateZ(0);
    }

    1% {
        -webkit-transform: rotateZ(30deg);
    }

    3% {
        -webkit-transform: rotateZ(-28deg);
    }

    5% {
        -webkit-transform: rotateZ(34deg);
    }

    7% {
        -webkit-transform: rotateZ(-32deg);
    }

    9% {
        -webkit-transform: rotateZ(30deg);
    }

    11% {
        -webkit-transform: rotateZ(-28deg);
    }

    13% {
        -webkit-transform: rotateZ(26deg);
    }

    15% {
        -webkit-transform: rotateZ(-24deg);
    }

    17% {
        -webkit-transform: rotateZ(22deg);
    }

    19% {
        -webkit-transform: rotateZ(-20deg);
    }

    21% {
        -webkit-transform: rotateZ(18deg);
    }

    23% {
        -webkit-transform: rotateZ(-16deg);
    }

    25% {
        -webkit-transform: rotateZ(14deg);
    }

    27% {
        -webkit-transform: rotateZ(-12deg);
    }

    29% {
        -webkit-transform: rotateZ(10deg);
    }

    31% {
        -webkit-transform: rotateZ(-8deg);
    }

    33% {
        -webkit-transform: rotateZ(6deg);
    }

    35% {
        -webkit-transform: rotateZ(-4deg);
    }

    37% {
        -webkit-transform: rotateZ(2deg);
    }

    39% {
        -webkit-transform: rotateZ(-1deg);
    }

    41% {
        -webkit-transform: rotateZ(1deg);
    }

    43% {
        -webkit-transform: rotateZ(0);
    }

    45% {
        -webkit-transform: rotateZ(30deg);
    }

    47% {
        -webkit-transform: rotateZ(-28deg);
    }

    49% {
        -webkit-transform: rotateZ(34deg);
    }

    51% {
        -webkit-transform: rotateZ(-32deg);
    }

    53% {
        -webkit-transform: rotateZ(30deg);
    }

    55% {
        -webkit-transform: rotateZ(-28deg);
    }

    57% {
        -webkit-transform: rotateZ(26deg);
    }

    59% {
        -webkit-transform: rotateZ(-24deg);
    }

    61% {
        -webkit-transform: rotateZ(22deg);
    }

    63% {
        -webkit-transform: rotateZ(-20deg);
    }

    65% {
        -webkit-transform: rotateZ(18deg);
    }

    67% {
        -webkit-transform: rotateZ(-16deg);
    }

    69% {
        -webkit-transform: rotateZ(14deg);
    }

    71% {
        -webkit-transform: rotateZ(-12deg);
    }

    73% {
        -webkit-transform: rotateZ(10deg);
    }

    75% {
        -webkit-transform: rotateZ(-8deg);
    }

    77% {
        -webkit-transform: rotateZ(6deg);
    }

    79% {
        -webkit-transform: rotateZ(-4deg);
    }

    81% {
        -webkit-transform: rotateZ(2deg);
    }

    83% {
        -webkit-transform: rotateZ(-1deg);
    }

    85% {
        -webkit-transform: rotateZ(1deg);
    }

    100% {
        -webkit-transform: rotateZ(0);
    }
}

@-moz-keyframes ring {
    0% {
        -moz-transform: rotate(0);
    }

    1% {
        -moz-transform: rotate(30deg);
    }

    3% {
        -moz-transform: rotate(-28deg);
    }

    5% {
        -moz-transform: rotate(34deg);
    }

    7% {
        -moz-transform: rotate(-32deg);
    }

    9% {
        -moz-transform: rotate(30deg);
    }

    11% {
        -moz-transform: rotate(-28deg);
    }

    13% {
        -moz-transform: rotate(26deg);
    }

    15% {
        -moz-transform: rotate(-24deg);
    }

    17% {
        -moz-transform: rotate(22deg);
    }

    19% {
        -moz-transform: rotate(-20deg);
    }

    21% {
        -moz-transform: rotate(18deg);
    }

    23% {
        -moz-transform: rotate(-16deg);
    }

    25% {
        -moz-transform: rotate(14deg);
    }

    27% {
        -moz-transform: rotate(-12deg);
    }

    29% {
        -moz-transform: rotate(10deg);
    }

    31% {
        -moz-transform: rotate(-8deg);
    }

    33% {
        -moz-transform: rotate(6deg);
    }

    35% {
        -moz-transform: rotate(-4deg);
    }

    37% {
        -moz-transform: rotate(2deg);
    }

    39% {
        -moz-transform: rotate(-1deg);
    }

    41% {
        -moz-transform: rotate(1deg);
    }

    43% {
        -moz-transform: rotate(0);
    }

    45% {
        -webkit-transform: rotateZ(30deg);
    }

    47% {
        -webkit-transform: rotateZ(-28deg);
    }

    49% {
        -webkit-transform: rotateZ(34deg);
    }

    51% {
        -webkit-transform: rotateZ(-32deg);
    }

    53% {
        -webkit-transform: rotateZ(30deg);
    }

    55% {
        -webkit-transform: rotateZ(-28deg);
    }

    57% {
        -webkit-transform: rotateZ(26deg);
    }

    59% {
        -webkit-transform: rotateZ(-24deg);
    }

    61% {
        -webkit-transform: rotateZ(22deg);
    }

    63% {
        -webkit-transform: rotateZ(-20deg);
    }

    65% {
        -webkit-transform: rotateZ(18deg);
    }

    67% {
        -webkit-transform: rotateZ(-16deg);
    }

    69% {
        -webkit-transform: rotateZ(14deg);
    }

    71% {
        -webkit-transform: rotateZ(-12deg);
    }

    73% {
        -webkit-transform: rotateZ(10deg);
    }

    75% {
        -webkit-transform: rotateZ(-8deg);
    }

    77% {
        -webkit-transform: rotateZ(6deg);
    }

    79% {
        -webkit-transform: rotateZ(-4deg);
    }

    81% {
        -webkit-transform: rotateZ(2deg);
    }

    83% {
        -webkit-transform: rotateZ(-1deg);
    }

    85% {
        -webkit-transform: rotateZ(1deg);
    }

    100% {
        -webkit-transform: rotateZ(0);
    }
}

@keyframes ring {
    0% {
        transform: rotate(0);
    }

    1% {
        transform: rotate(30deg);
    }

    3% {
        transform: rotate(-28deg);
    }

    5% {
        transform: rotate(34deg);
    }

    7% {
        transform: rotate(-32deg);
    }

    9% {
        transform: rotate(30deg);
    }

    11% {
        transform: rotate(-28deg);
    }

    13% {
        transform: rotate(26deg);
    }

    15% {
        transform: rotate(-24deg);
    }

    17% {
        transform: rotate(22deg);
    }

    19% {
        transform: rotate(-20deg);
    }

    21% {
        transform: rotate(18deg);
    }

    23% {
        transform: rotate(-16deg);
    }

    25% {
        transform: rotate(14deg);
    }

    27% {
        transform: rotate(-12deg);
    }

    29% {
        transform: rotate(10deg);
    }

    31% {
        transform: rotate(-8deg);
    }

    33% {
        transform: rotate(6deg);
    }

    35% {
        transform: rotate(-4deg);
    }

    37% {
        transform: rotate(2deg);
    }

    39% {
        transform: rotate(-1deg);
    }

    41% {
        transform: rotate(1deg);
    }

    43% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(0);
    }
}

/**
 * ----------------------------------------
 * animation ring край
 * ----------------------------------------
 */


/**
 * ----------------------------------------
 * animation notification-wave
 * ----------------------------------------
 */

@-webkit-keyframes notification-wave {
    0% {
        top: 20px;
        right: 78px;
        height: 0px;
        width: 0px;
        opacity: 1;
    }

    100% {
        top: -440px;
        right: -360px;
        height: 900px;
        width: 900px;
        opacity: 0;
    }
}

@keyframes notification-wave {
    0% {
        top: 20px;
        right: 78px;
        height: 0px;
        width: 0px;
        opacity: 1;
    }

    100% {
        top: -440px;
        right: -360px;
        height: 900px;
        width: 900px;
        opacity: 0;
    }
}

/**
 * ----------------------------------------
 * animation notification-wave край
 * ----------------------------------------
 */


@-webkit-keyframes fade-in-top {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-top {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}


@-webkit-keyframes fade-in-right {
    0% {
        -webkit-transform: translateX(50px);
        transform: translateX(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fade-in-right {
    0% {
        -webkit-transform: translateX(50px);
        transform: translateX(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

/* fade-in blurred */
/*
    -webkit-animation: slide-in-blurred-top 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
    animation: slide-in-blurred-top 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
       */

@-webkit-keyframes blink-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.2;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blink-2 {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.2;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes slide-in-blurred-top {
    0% {
        -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
        transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
        -webkit-transform-origin: 50% 0%;
        transform-origin: 50% 0%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) scaleY(1) scaleX(1);
        transform: translateY(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

@keyframes slide-in-blurred-top {
    0% {
        -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
        transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
        -webkit-transform-origin: 50% 0%;
        transform-origin: 50% 0%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) scaleY(1) scaleX(1);
        transform: translateY(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}
/* fade-in blurred - край */

/**
 * ----------------------------------------
 * animation bounce-in-fwd
 * ----------------------------------------
 */
@-webkit-keyframes bounce-in-fwd {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: scale(0.84);
        transform: scale(0.84);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    89% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

@keyframes bounce-in-fwd {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: scale(0.7);
        transform: scale(0.7);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: scale(0.84);
        transform: scale(0.84);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    89% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

/* pulsate animation */

@-webkit-keyframes pulsate-fwd {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes pulsate-fwd {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
/* pulsate animation - край */

/* -webkit-animation: fade-in 1.5s ease-out both;
           animation: fade-in 1s ease-out .2s both;*/








/* fade-in-top - keyframes за анимациите на логин страницата */
/* opacity */
@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


/* opacity */

@-webkit-keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

@keyframes text-focus-in {
    0% {
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

/* focus-in */
@-webkit-keyframes focus-in-expand {
    0% {
        letter-spacing: -0.5em;
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}

@keyframes focus-in-expand {
    0% {
        letter-spacing: -0.5em;
        -webkit-filter: blur(12px);
        filter: blur(12px);
        opacity: 0;
    }

    100% {
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }
}



@-webkit-keyframes fade-in-top {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fade-in-top {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

/**
 * ----------------------------------------
 * animation slide-fwd-center
 * ----------------------------------------
 */
@-webkit-keyframes slide-fwd-center {
    0% {
        transform: scale(0.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes slide-fwd-center {
    0% {
        transform: scale(0.9);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.animate-from-center {
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

/* стил, когато екранът е по-широк от 992 пиксела */
/*
@media screen and (min-width: 992px) {
    .page {
        background-image: url(css/img/login-bg.svg);    
    }
}
*/

/* стил, когато екранът е по-тесен от 992 пиксела */
/*
@media screen and (max-width: 992px) {
    .page {
        background-image: url(css/img/login-bg-small.svg);
    }
}
*/

/* скривам скролбарите на бодито на сайта */
body {
    -ms-overflow-style: none;
    /* for Internet Explorer, Edge */

    scrollbar-width: none;
    /* for Firefox */
    overflow-y: scroll;
}

    body::-webkit-scrollbar {
        display: none;
        /* for Chrome, Safari, and Opera */
    }
/* скривам скролбарите на бодито на сайта */


html, body {
    /* font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; */
    font-family: Gilroy;
}

/*@media screen and (max-width: 920px) {
    html, body {
        background-color: #fff !important;
    }
}*/


h1:focus {
    outline: none;
}

.dxbl-menu.dxbl-menu-horizontal > .dxbl-menu-nav .dxbl-menu-nav-bar.dxbl-menu-hamburger-btn-pos-left {
    -webkit-flex-direction: row !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
}

/* logo */
.logo-menu {
    height: 100% !important;
    width: 80px;
    position: relative;
    z-index: 9999;
    /* filter: brightness(10) invert(70%); */ /* тъмно лого */
    margin-left: 15px;
}
/* фиксирам логото, когато екранът е по-тесен от 570 пиксела*/
@media screen and (max-width: 992px) {
    .div-logo {
        display: flex;
        position: absolute;
        z-index: 99999 !important;
        top: 8px;
        margin-left: 0px;
    }
}
/* НЕ фиксирам логото, когато екранът е по-широк от 570 пиксела*/
@media screen and (min-width: 922px) {
    .div-logo {
        display: flex;
        position: relative;
        z-index: 99999 !important;
        top: 8px;
        margin-left: 0px;
        margin-bottom: 20px;
    }
}

.label-top {
    font-family: Gilroy-light;
    color: #fff;
    padding-left: 5px;
    margin-top: 5px;
   
}

.popup-container {
    max-height: 70vh;
    overflow-y: auto;
    padding-top: 8px;
    padding-bottom: 8px;
}

#popup-inner-shadow-top {
    position: absolute;
    z-index: 99;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 0px;
    background: linear-gradient(0deg, rgba(55, 60, 67, 0), rgb(55 60 67 / 0%));
    box-shadow: 0px 0px 15px 10px #fff;
}

#popup-inner-shadow-bottom {
    position: absolute;
    z-index: 99;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 0px;
    background: linear-gradient(0deg, #f2f2f6, #f2f2f600);
    box-shadow: 0px 0px 15px 10px #fff;
}

.found-item {
    font-family: 'Gilroy';
    font-size: 1rem;
    line-height: 1.2rem;
    display: flex;
    position: relative;
    margin-bottom: 5px;
    margin-top: 5px;
    margin-left: 5px;
    margin-right: 5px;
    display: flex;
    /* background: linear-gradient(0deg, #ffffff08, #ffffff08); */
    background: linear-gradient(0deg, #ededed, #ededed);
    color: #1e1e1e;
    padding: 10px;
    border-radius: 10px;
    max-height: max-content;
    overflow: hidden;
    transition: height 0.3s ease;
    -webkit-animation: fade-in 0.3s both;
    animation: fade-in 0.3s both;
    flex-direction: column;
}

    .found-item:active {
        background: linear-gradient(0deg, #e3e3e3, #e3e3e3);
        transform: scale(.95) !important;
    }

.selected-operation {
    position: absolute;
    z-index: 9;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    /*background: #b7b7b75e;*/
    animation: fade-in.3s ease;
    -webkit-animation: fade-in .3s ease;
}

.item-button-item-name {
    max-height: 100%;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
}

@media screen and (min-width: 1024px) {
    .database-text {
        position: fixed;
        z-index: 999;
        bottom: 0px !important;
        padding: 15px;
        right: 0px;
        background-color: #fff0;
        /*box-shadow: -1px -1px 11px #212529c9;
        backdrop-filter: blur(1px);
        -webkit-backdrop-filter: blur(1px);*/
        border-radius: 10px 0px 0px 0px;
        -webkit-animation: fade-in-bottom .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both !important;
        animation: fade-in-bottom .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both !important;
        font-size: 0.7rem;
        line-height: 0.7rem;
        color: #fff;
        text-align: left;        
        /* align-content: center; */
        /* background: linear-gradient(0deg, #121a22 0%, #c3c3c300 100%); */
        margin-bottom: 0rem !important;
        /* text-shadow: 0px 0px 7px #000000; */
        opacity: 1 !important;
    }
}
    @media screen and (max-width: 1024px) {
        .database-text {
            position: relative;
            /* z-index: 999; */
            bottom: 0px !important;
            padding: 15px;
            margin-top: 100px;
            /* left: calc(50vw - 70px); */
            margin-bottom: -20px !important;
            background-color: #fff0;
            /* box-shadow: -1px -1px 11px #212529c9; */
            /* backdrop-filter: blur(1px); */
            /* border-radius: 10px 10px 0px 0px; */
            -webkit-animation: fade-in-bottom .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both !important;
            animation: fade-in-bottom .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both !important;
            font-size: 0.8rem;
            line-height: 0.8rem;
            color: #fff;
            width: 100%;
            text-align: center;
            /* align-content: center; */
            /* background: linear-gradient(0deg, #121a22 0%, #c3c3c300 100%); */
            /* margin-bottom: 1rem !important; */
            /* text-shadow: 0px 0px 7px #000000; */
            opacity: 1 !important;
        }
    }

    @media screen and (max-width: 992px) and (min-width: 577px) {
        .database-text {
            position: relative;
            /* z-index: 999; */
            bottom: 0px !important;
            padding: 15px;
            margin-top: 250px;
            /* left: calc(50vw - 70px); */
            /* margin-bottom: -20px !important; */
            background-color: #fff0;
            /* box-shadow: -1px -1px 11px #212529c9; */
            /* backdrop-filter: blur(1px); */
            /* border-radius: 10px 10px 0px 0px; */
            -webkit-animation: fade-in-bottom .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both !important;
            animation: fade-in-bottom .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) 2s both !important;
            font-size: 0.8rem;
            line-height: 0.8rem;
            color: #fff;
            width: 100%;
            text-align: center;
            /* align-content: center; */
            /* background: linear-gradient(0deg, #121a22 0%, #c3c3c300 100%); */
            /* margin-bottom: 1rem !important; */
            /* text-shadow: 0px 0px 7px #000000; */
            opacity: 1 !important;
        }
    }


    /* menu style - начало */

    /* scaling на иконите на менюто  */

    @media screen and (max-width: 570px) {
        .home-menu:hover .nav-button {
            transform: scale(1) !important;
        }
    }

    .home-menu:hover .nav-button {
        transform: scale(1.3);
        transition: all .15s ease-in-out;
    }

    .home-menu:not(:hover) .nav-button {
        transition: all .15s ease-in-out;
    }
    /* scaling на иконите на менюто - край */

    .card {
        background-color: rgb(0 0 0 / 0%) !important;
        border: 0px solid rgba(0,0,0,.125);
        border-radius: 0rem !important;
        /*overflow: hidden;*/
        /* max-height: 93.48px !important; /* да не се оразмерява при първо зареждане! */
    }

    .dxbl-menu-hamburger {
        width: 26px !important;
        height: 26px !important;
    }
    /* главни менюта */
    .dxbl-menu .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn {
        padding: 10px;
    }

        .dxbl-menu .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn:hover {
            /* --dxbl-btn-border-radius: 10px 10px 0 0 !important; */
            background-color: #ffffff02 !important;
        }
        /* стрелки на менютата */
        .dxbl-menu .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn > svg.dxbl-image {
            color: #fff !important;
            opacity: 1 !important;
            margin-left: 5px !important;
        }

    .dxbl-menu-dropdown.dxbl-dropdown-dialog > .dxbl-dropdown-body .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn > svg.dxbl-image {
        color: #fff !important;
        opacity: 1 !important;
    }


    /* меню - тъмен прозрачен стил */
    .card {
        background-color: rgb(0 0 0 / 0%);
    }

    @media screen and (min-width: 1024px) {
        .dxbl-menu {
            --dxbl-menu-bg: rgb(0 0 0 / 0%) !important;
            color: #fff !important;
            width: 100%;
            margin-left: 30px;
            -webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
            animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
        }
    }

    @media screen and (max-width: 1024px) and (min-width: 992px) {
        .dxbl-menu {
            position: relative;
            z-index: 9999 !important;
            width: 100%;
            padding-left: 0px;
            margin-left: 20px;
            --dxbl-menu-bg: rgb(0 0 0 / 0%) !important;
            color: #fff !important;
            -webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
            animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
        }
    }

    @media screen and (max-width: 992px) and (min-width: 576px) {
        .dxbl-menu {
            position: relative;
            z-index: 9999 !important;
            width: 100%;
            padding-left: 150px;
            --dxbl-menu-bg: rgb(0 0 0 / 0%) !important;
            color: #fff !important;
            -webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
            animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
        }
    }

   

    @media (max-width: 576px) {
        .dxbl-menu {
            position: relative;
            z-index: 9999 !important;
            width: 100%;
            padding-left: 200px;
            --dxbl-menu-bg: rgb(0 0 0 / 0%) !important;
            color: #fff !important;
            -webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
            animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
        }
    }


    /* дроп меню навигация */
    @-webkit-keyframes scale-in-ver-top {
        0% {
            -webkit-transform: scaleY(0);
            transform: scaleY(0);
            -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
            opacity: 1;
        }

        100% {
            -webkit-transform: scaleY(1);
            transform: scaleY(1);
            -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
            opacity: 1;
        }
    }

    @keyframes scale-in-ver-top {
        0% {
            -webkit-transform: scaleY(0);
            transform: scaleY(0);
            -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
            opacity: 1;
        }

        100% {
            -webkit-transform: scaleY(1);
            transform: scaleY(1);
            -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
            opacity: 1;
        }
    }

    @media screen and (min-width: 992px) {
        .dxbl-menu-dropdown.dxbl-dropdown-dialog {
            background-color: rgb(0 0 0 / 70%);
            color: #fff;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            padding: 10px;
            border: none;
            border-radius: 0px 0px 0px 0px;
            max-height: 72vh !important;
            margin-top: -1px;
            min-width: 250px;
            -webkit-animation: fade-in 0.2s ease-in-out both;
            animation: fade-in 0.2s ease-in-out both;
            /* -webkit-animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;
            animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;*/
        }
    }

    @media screen and (max-width: 992px) and (min-width: 768px) {
        .dxbl-menu-dropdown.dxbl-dropdown-dialog {
            background-color: rgb(0 0 0 / 60%);
            color: #fff;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 10px;
            padding-bottom: 10px;
            border: none;
            border-radius: 0px 0px 0px 0px;
            max-height: 72vh !important;
            position: relative;
            z-index: 999;
            -webkit-animation: fade-in 0.2s ease-in-out both;
            animation: fade-in 0.2s ease-in-out both;
            /* -webkit-animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;
            animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;*/
        }
    }

                                                              

    @media screen and (max-width: 768px) and (min-width: 576px) {
        .dxbl-itemlist-dropdown[x-drop-alignment=bottom] > .dxbl-menu-dropdown.dxbl-menu-navbar-dropdown {
            background-color: rgb(0 0 0 / 60%);
            color: #fff;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 10px;
            padding-bottom: 10px;
            width: 100vw;
            border: none;
            border-radius: 0px 0px 20px 20px;
            max-height: 72vh !important;
            position: relative;
            z-index: 999;
            -webkit-animation: fade-in 0.2s ease-in-out both;
            animation: fade-in 0.2s ease-in-out both;
            /* -webkit-animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;
            animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;*/
        }
        
    }

    @media screen and (max-width: 576px) {
        .dxbl-itemlist-dropdown[x-drop-alignment=bottom] > .dxbl-menu-dropdown.dxbl-menu-navbar-dropdown {
            border-top-left-radius: 0;
            border-top-right-radius: 0;
            background-color: rgb(0 0 0 / 60%);
            color: #fff;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 10px;
            padding-bottom: 10px;
            width: 100vw;
            border: none;
            border-radius: 0px 0px 20px 20px;
            max-height: 72vh !important;
            position: relative;
            z-index: 999;
            -webkit-animation: fade-in 0.2s ease-in-out both;
            animation: fade-in 0.2s ease-in-out both;
        }

        /*.dxbl-dropdown > .dxbl-dropdown-dialog, .dxbl-itemlist-dropdown > .dxbl-dropdown-dialog {
            background-color: rgb(0 0 0 / 60%);
            color: #fff;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 10px;
            padding-bottom: 10px;
            width: 100vw;
            border: none;
            border-radius: 0px 0px 20px 20px;
            max-height: 72vh !important;
            position: relative;
            z-index: 999;
            -webkit-animation: fade-in 0.2s ease-in-out both;
            animation: fade-in 0.2s ease-in-out both;*/
           /* -webkit-animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;
            animation: scale-in-ver-top 0.3s cubic-bezier(0.190, 1.000, 0.220, 1.000) both;*/
        /*}*/

        /*.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown {
            translate: 19px !important;
        }*/
    }

    .dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown {
        width: 100% !important;
        max-width: 97vw !important;
        border-radius: 0.5rem !important;
        border: none !important;
    }

    .dxbl-sc-hint.dxbl-sc-tooltip {
        max-width: 345px !important;
    }


    /* дроп меню навигация - край*/
    /* меню - тъмен прозрачен стил */
    /* меню - размер на текста */
    @media screen and (max-width: 922px) {
        .dxbl-menu-dropdown.dxbl-dropdown-dialog > .dxbl-dropdown-body .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn {
            --dxbl-btn-font-size: 1.25rem !important;
            --dxbl-btn-line-height: 1.29rem !important;
            border-radius: 10px !important;
            margin-top: 4px;
            -webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
            animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
        }
    }

    @media screen and (min-width: 922px) {
        .dxbl-menu-dropdown.dxbl-dropdown-dialog > .dxbl-dropdown-body .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn {
            --dxbl-btn-font-size: 1rem !important;
            border-radius: 5px !important;
            -webkit-animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
            animation: fade-in .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
        }
    }

    @media screen and (min-width: 992px) {
        .menu-style {
            background-color: rgb(0 0 0 / 70%) !important;
            max-height: 52px !important;
        }

        .location-name {
            position: fixed;
            z-index: 99;
            top: 49px;
            min-width: 90px;
            text-align: center;
            left: 50% !important;
            transform: translateX(-50%);
            padding: 5px 10px 5px 10px;
            border-top: 1px dashed #ffffff;
            border-radius: 0px 0px 10px 10px;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            background: transparent;
            color: #1e1e1e !important;
            font-size: 0.8rem;
            font-family: 'Gilroy';
            box-shadow: 0px 2px 3px #00000069;
            -webkit-animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
            animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
        }
    }

    @media screen and (max-width: 1024px) {
        .menu-style {
            /*display: flex;
            align-content: center;
            justify-content: center;
            align-items: center;
            flex-direction: column;*/
            background-color: rgb(0 0 0 / 80%) !important;
            padding-top: 0px;
            padding-left: 0px;
            overflow: hidden;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            display: flex;
            flex-direction: row;
            max-height: 50px !important;
        }

        .location-name {
            position: fixed;
            z-index: 99;
            top: 50px;
            min-width: 90px;
            text-align: center;
            left: 50% !important;
            transform: translateX(-50%);
            padding: 0px 10px 0px 10px;
            border-top: 1px dashed #fff;
            border-radius: 0px 0px 5px 5px;
            backdrop-filter: blur(1px);
            -webkit-backdrop-filter: blur(10px);
            background: linear-gradient(180deg, #333333, #333333);
            color: #ffffff !important;
            font-size: 0.7rem;
            font-family: 'Gilroy';
            box-shadow: 0px 2px 3px #0000002b;
            -webkit-animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
            animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
        }
    }

    @media screen and (min-width: 1024px) {
        .menu-style {
            /*display: flex;
        align-content: center;
        justify-content: center;
        align-items: center;
        flex-direction: column;*/
            padding-top: 0px;
            padding-left: 5px;
            padding-right: 5px;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            display: flex;
            overflow: hidden;
        }

        /*.location-name {
            position: fixed;
            z-index: 99;
            top: 49px;
            min-width: 90px;
            text-align: center;
            left: 50% !important;
            transform: translateX(-50%);
            padding: 0px 10px 0px 10px;
            border-top: 1px dashed #fff;
            border-radius: 0px 0px 5px 5px;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            background: linear-gradient(180deg, #4c4c4c, #4c4c4c);
            color: #ffffff !important;
            font-size: 0.8rem;
            font-family: 'Gilroy';
            box-shadow: 0px 2px 3px #00000069;
            -webkit-animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
            animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
        }*/
    }

    .dxbl-menu-bar {
        width: min-content !important;
    }

    /* икони в менюто */
    .dxbl-image:not(svg) {
        color: #ff8000 !important;
    }

    .toolbar-button .dxbl-image:not(svg) {
        margin-bottom: 5px;
    }

    .column-chooser .dxbl-image:not(svg) {
        margin-bottom: 0px;
    }

    .dxbl-image:not(svg):hover {
        text-shadow: 0px 0px 2px #6c757d57;
    }


    /* toolbar */
    @media screen and (min-width: 992px) {
        .dxbl-toolbar.dxbl-toolbar-adaptive {
            margin-bottom: 10px !important;
            margin-left: 10px !important;
        }
    }

    @media screen and (max-width: 991px) {
        .dxbl-toolbar.dxbl-toolbar-adaptive {
            margin-bottom: 10px !important;
        }
    }

    /* menu style - край */

    /* тулбар бутони */

    .dxbl-btn-group, .dxbl-btn-group-vertical {
        padding-bottom: 1px !important;
        padding-top: 1px !important;
    }

    .tool-icon-animate {
        font-size: 1.5rem;
        margin-top: 2px;
        margin-left: 7px !important;
    }

    @media screen and (min-width: 992px) {
        .tool-icon-animate {
            font-size: 1.2rem !important;
            margin-top: 2px;
            margin-left: 5px !important;
        }
    }

    #red-icon:hover .dxbl-image:not(svg) {
        transform: rotate(90deg);
        transition: all .10s ease-in-out;
    }

    #red-icon:not(:hover) .dxbl-image:not(svg) {
        transform: rotate(0deg);
        transition: all .10s ease-in-out;
    }


    .toolbar-button:hover .dxbl-image:not(svg) {
        color: #616161 !important;
        transition: all .10s ease-in-out;
    }

    .toolbar-button:not(:hover) .dxbl-image:not(svg) {
        color: #ff8000 !important;
        transition: all .10s ease-in-out;
    }

    @media screen and (max-width: 992px) {
        .toolbar-button:hover .dxbl-image:not(svg) {
            color: #ff8000 !important;
            transition: all .10s ease-in-out;
        }

        .toolbar-button:not(:hover) .dxbl-image:not(svg) {
            color: #ff8000 !important;
            transition: all .10s ease-in-out;
        }
    }

    /* scaling на иконите на тулбар бутоните  */
    .toolbar-button:hover .tool-icon-animate {
        transform: scale(1.1);
        color: #fff;
        transition: all .10s ease-in-out;
    }

    .toolbar-button:not(:hover) .tool-icon-animate {
        transition: all .10s ease-in-out;
    }
    /* scaling на иконите на тулбар бутоните - край */

    @media screen and (max-width: 992px) {
        @-webkit-keyframes fade-in-bottom {
            0% {
                -webkit-transform: translateY(50px);
                transform: translateY(50px);
                opacity: 0;
            }

            100% {
                -webkit-transform: translateY(0);
                transform: translateY(0);
                opacity: 1;
            }
        }

        @keyframes fade-in-bottom {
            0% {
                -webkit-transform: translateY(50px);
                transform: translateY(50px);
                opacity: 0;
            }

            100% {
                -webkit-transform: translateY(0);
                transform: translateY(0);
                opacity: 1;
            }
        }


        .dxbl-toolbar.dxbl-toolbar-adaptive {
            min-width: max-content !important;
            overflow-x: scroll !important;
            position: fixed;
            bottom: 0px;
            left: 0px !important;
            right: 0px !important;
            padding-left: 5px;
            z-index: 998;
            background-color: rgb(0 0 0 / 80%) !important;
            backdrop-filter: blur(5px);
            -webkit-backdrop-filter: blur(5px);
            left: 5px;
            margin-bottom: 0px !important;
            border-radius: 0rem 0rem 0rem 0rem;
            height: 65px !important;
            /* padding-top: 5px; */
            -webkit-animation: fade-in-bottom 0.8s cubic-bezier(0.390, 0.575, 0.565, 1.000) 0s both;
            animation: fade-in-bottom 0.8s cubic-bezier(0.390, 0.575, 0.565, 1.000) 0s both;
        }
    }

    /* да показва текстовете на бутоните на големи екрани */
    @media screen and (min-width: 992px) {
        .dxbl-toolbar.dxbl-toolbar-adaptive > .dxbl-btn-toolbar.dxbl-toolbar-no-item-text > .dxbl-btn-group > .dxbl-btn > .dxbl-image + span {
            display: unset !important;
        }
    }
    /* да показва текстовете на бутоните на малки екрани */

    @media screen and (max-width: 992px) {
        .dxbl-toolbar.dxbl-toolbar-adaptive > .dxbl-btn-toolbar.dxbl-toolbar-no-item-text > .dxbl-btn-group > .dxbl-btn > .dxbl-image + span {
            display: unset !important; /*unset*/
        }
    }


    @media screen and (min-width: 992px) {
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn-split > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn-split > .dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn-split > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn-split > .dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn.dxbl-btn-secondary {
            --dxbl-btn-border-color: #4c4c4c;
            --dxbl-btn-hover-border-color: var(--dxbl-toolbar-btn-border-color);
            --dxbl-btn-active-border-color: var(--dxbl-toolbar-btn-border-color);
            --dxbl-btn-disabled-border-color: var(--dxbl-toolbar-btn-border-color);
            --dxbl-btn-border-style: none;
            --dxbl-btn-border-width: 1px;
            --dxbl-btn-hover-background: #4c4c4c !important;
            margin-right: 15px;
            font-family: 'Gilroy';
            font-size: .83rem;
            color: #505153 /*#ff8000*/ !important;
            margin-bottom: 0px;
            margin-left: 0px;
            padding-left: 3px;
            padding-right: 8px;
            padding-bottom: 2px;
            padding-top: 5px;
            margin-right: 3px !important;
            border-radius: 10px !important;
            min-width: max-content;
            box-shadow: 0px 0px 4px 0px #3d3d3d21;
            background: linear-gradient(0deg, #e3e3e345, transparent);
        }
    }

    @media screen and (max-width: 992px) {
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn-split > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn-split > .dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn-split > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn-split > .dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn.dxbl-btn-secondary {
            --dxbl-btn-border-color: #ffc107;
            --dxbl-btn-hover-border-color: var(--dxbl-toolbar-btn-border-color);
            --dxbl-btn-active-border-color: var(--dxbl-toolbar-btn-border-color);
            --dxbl-btn-disabled-border-color: var(--dxbl-toolbar-btn-border-color);
            --dxbl-btn-border-style: none !important;
            --dxbl-btn-border-width: 1px !important;
            --dxbl-btn-hover-background: #4c4c4c !important;
            margin-right: 5px !important;
            margin-left: 5px !important;
            font-family: 'Gilroy-light' !important;
            font-size: .7rem !important;
            line-height: .7rem !important;
            letter-spacing: 0.03rem !important;
            margin-bottom: 4px !important;
            border-radius: 10px !important;
            margin-top: 3px !important;
            padding-right: 0px !important;
            padding-top: 2px !important;
            padding-left: 0px !important;
            padding-right: 5px !important;
            padding-bottom: 5px !important;
            background-color: #4c4c4c00;
            --dxbl-btn-root-bg: #4c4c4c00;
            /* margin-left: 3px; */
            display: flex !important;
            flex-direction: column !important;
            justify-content: space-around !important;
            min-width: 95px;
            max-height: 56px !important;
            min-height: 56px !important;
            text-wrap: wrap !important;
            overflow-wrap: break-word !important;
            /*word-break: break-word !important;*/
            white-space: pre-wrap !important;
            color: #fff !important;
        }

        .dxbl-image + span {
            display: unset !important;
        }
    }
    /* заглавие в страниците */
    @media screen and (min-width: 992px) {
        .page-heading {
            color: #373737;
            font-family: 'Gilroy-Bold';
            font-size: 1.6rem; /*1.6rem;*/
            position: relative;
            left: 10px;
            max-width: 90vw;
            margin-top: 15px;
            margin-bottom: 30px;
            line-height: 1rem;
            position: relative;
            z-index: 9;
            background-color: #fff;
            -webkit-animation: fade-in 1s ease-out 0s both;
            animation: fade-in 1s ease-out 0s both;
        }
    }


    @media screen and (max-width: 992px) {
        .page-heading {
            background-color: transparent;
            color: #000;
            font-family: 'Gilroy-Bold';
            font-size: 1.18rem;
            line-height: 1rem;
            /* position: relative; */
            margin-top: 15px;
            margin-bottom: 10px !important;
            margin-left: 5px;
            position: relative;
            z-index: 9;
            -webkit-animation: fade-in 1s ease-out 0s both;
            animation: fade-in 1s ease-out 0s both;
        }
    }

    /* search икона */
    .dxbl-grid .dxbl-grid-search-box-container > .dxbl-grid-search-box > .dxbl-btn-icon > .dxbl-image {
        opacity: 1;
        fill: rgba(255,147,1) !important;
    }
    /* search поле */

    .dxbl-grid .dxbl-text-edit {
        --dxbl-text-edit-font-family: var(--dxbl-grid-font-family);
        --dxbl-text-edit-font-size: var(--dxbl-grid-font-size);
        border-radius: 10px;
        /* box-shadow: 3px 2px 8px 1px #3d3d3d70; */
    }
    /* @media (max-width: 768px) {
    .dxbl-grid > .dxbl-grid-top-panel.dxbl-grid-multiple-panel > .dxbl-grid-search-box-container {
        padding-bottom: 0;
        position: fixed;
        z-index: 9;

        bottom: 22px;
        max-width: 340px;
        left: -5px;
    }
} */
    /* search поле - finish */

    /* грид */

    /* header style */
    /* горен панел */
    .dxbl-grid-top-panel.dxbl-grid-multiple-panel {
        border-style: solid !important;
        border-top: 0px !important;
        border-left: 0px !important;
        border-right: 0px !important;
        border-color: rgba(0,0,0,.1) !important;
    }

    .dxbl-grid-top-panel {
        border-style: solid !important;
        border-top: 0px !important;
        border-left: 0px !important;
        border-right: 0px !important;
        border-color: rgba(0,0,0,.1) !important;
    }

    @media (max-width: 992px) {
        .dxbl-grid > .dxbl-grid-top-panel > .dxbl-grid-search-box-container {
            width: 100% !important;
            padding: 5px !important;
        }
    }

    /* горен панел - край */

    .dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-grid-table > thead {
        background-color: inherit;
        top: 0;
        position: -webkit-sticky;
        position: sticky;
        z-index: 2;
        /*background: linear-gradient(#fff, rgb(255 147 0) 200%) !important;*/
        color: #212529;
        box-shadow: 0px 0px 4px 0px #6c757d !important;
        border-width: 1px !important;
        border-color: #ced4da !important;
        border-bottom: 0px !important;
        border-top: 1px !important;
        /* font-family: 'Gilroy-light';*/
    }


    .dxbl-grid .dxbl-grid-table > tbody:nth-child(2) > tr:first-child > td, .dxbl-grid .dxbl-grid-table > tbody:nth-child(2) > tr:first-child > th,
    .dxbl-grid .dxbl-grid-table > tfoot:nth-child(2) > tr:first-child > td, .dxbl-grid .dxbl-grid-table > tfoot:nth-child(2) > tr:first-child > th,
    .dxbl-grid .dxbl-grid-table > thead:nth-child(2) > tr:first-child > td, .dxbl-grid .dxbl-grid-table > thead:nth-child(2) > tr:first-child > th {
        border-top-width: 1px !important;
        font-size: 0.8rem !important;
        line-height: 1rem !important;
        font-family: Gilroy !important;
        background-color: #fff !important;
    }
    /* header style - край*/

    .px-4 {
        padding-right: 0.5rem !important;
        padding-left: 0.5rem !important;
    }

    .dxbl-grid {
        --dxbl-grid-border-radius: .7rem !important;
        overflow: hidden !important;
        --dxbl-grid-focus-frame-size: 0rem !important;
        --dxbl-grid-border-style: none !important;
        --dxbl-grid-focus-frame-color: #ffffff00 !important;
        box-shadow: 0px 0px 4px 0px #3d3d3d21 !important;
        -webkit-animation: fade-in-fwd 0.6s cubic-bezier(0.175, 0.885, 0.320, 1.275) .3s both !important;
        animation: fade-in-fwd 0.6s cubic-bezier(0.175, 0.885, 0.320, 1.275) .3s both !important;
    }

    .dxbl-grid-footer-row {
        background-color: #fff !important;
    }
    /* expand бутон */
    .dxbl-grid .dxbl-grid-table .dxbl-grid-expand-button-cell .dxbl-grid-expand-button {
        --dxbl-btn-color: #ff8000 !important;
    }
    /* expand бутон - край */

    .dxbl-grid .dxbl-grid-table > tbody, .dxbl-grid .dxbl-grid-table > tfoot, .dxbl-grid .dxbl-grid-table > thead {
        border-color: #6c757d29 !important;
        border-style: solid !important;
        border-width: 1px !important;
    }

    .dxbl-scroll-viewer {
        border-top-style: none;
        border-top-width: 1px;
        border-top-color: #e3e3e3;
    }

    /* column chooser */
    @-webkit-keyframes fade-in-fwd {
        0% {
            -webkit-transform: translateZ(-80px);
            transform: translateZ(-80px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateZ(0);
            transform: translateZ(0);
            opacity: 1;
        }
    }

    @keyframes fade-in-fwd {
        0% {
            -webkit-transform: translateZ(-80px);
            transform: translateZ(-80px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateZ(0);
            transform: translateZ(0);
            opacity: 1;
        }
    }

    .dxbl-window > .dxbl-window-dialog > .dxbl-window-body {
        border-radius: 0px !important;
    }

    /* large screen column chooser */
    .align-self-start {
        padding: 0.5rem !important;
        position: fixed !important;
        z-index: 9 !important;
        bottom: 5vh !important;
        right: -38px !important;
        /* left: 0px !important; */
        border: none !important;
        transition: all .25s ease-in-out !important;
    }

        .align-self-start:hover {
            padding: 0.5rem !important;
            position: fixed !important;
            z-index: 9 !important;
            bottom: 5vh !important;
            right: 5px !important;
            border: none !important;
            transition: all .25s ease-in-out !important;
        }
    /* small screen column chooser */

    @media screen and (max-width: 922px) {
        .fab-container {
            padding: 0.5rem !important;
            position: absolute !important;
            z-index: 9 !important;
            bottom: 0px !important;
            right: 15px !important;
            border: none !important;
        }
    }

    @media screen and (min-width: 922px) {
        .fab-container {
            padding: 0.5rem !important;
            position: fixed !important;
            z-index: 9 !important;
            top: 60px !important;
            right: 0px !important;
            border: none !important;
        }
    }



.column-chooser-icon {
    width: 22px !important;
    height: 22px !important;
    background-image: url(../css/img/column-chooser.svg) !important;
    background-repeat: no-repeat;
}

    @media screen and (min-width: 922px) {
        .column-chooser {
            background: #fff !important;
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(10px);
            border: none !important;
            box-shadow: 0px 0px 4px 0px #00000026;
            min-width: 40px !important;
            font-size: 1.2rem !important;
            /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
            animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
            -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
    }

    @media screen and (max-width: 922px) {
        .column-chooser {
            background: #fff !important;
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(10px);
            border: none !important;
            box-shadow: 0px 0px 3px 0px #000000ba;
            min-width: 40px !important;
            font-size: 1.2rem !important;
            /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
            animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
            -webkit-animation: slide-fwd-center 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            animation: slide-fwd-center 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
    }


    .column-chooser .dxbl-image:not(svg) {
        color: #ff8000 !important;
    }

    .column-chooser:hover {
        background: #ff8000 !important;
        transition: all .15s ease-in-out;
    }

    .column-chooser:not(:hover) {
        transition: all .15s ease-in-out;
    }

    .column-chooser:hover .dxbl-image:not(svg) {
        color: #fff !important;
    }
    /* column chooser */
    /* модална форма */

    .dxbl-popup-header-button { /* бутон за затваряне на модална форма */
        width: 30px;
        height: 30px;
    }

    .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content .dxbl-popup-header > .dxbl-modal-header .dxbl-popup-header-button > svg.dxbl-image, .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-header .dxbl-popup-header-button > svg.dxbl-image {
        color: var(--dxbl-popup-header-btn-color,var(--dxbl-image-color,currentcolor));
        opacity: 1 !important;
    }
    .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content {
        border-radius: 20px !important;
    }

    .dxbl-modal {
        --dxbl-popup-border-radius: 20px 20px !important;
        /* --dxbl-popup-bg: #ffffffa8; */
        --dxbl-popup-bg: #fff !important;
        --dxbl-popup-border-width: 0px !important;
    }

    .dxbl-modal-open {
        overflow: hidden;
        padding-right: 0px !important;
    }

.dxbl-popup {
    /* max-width: 380px !important; */
    /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

    .dxbl-text-edit {
        --dxbl-text-edit-border-radius: 0.5rem !important;
        /*overflow: hidden !important;*/
    }
.date-pick {
    width: max-content !important;
}
    .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio) .dxbl-checkbox-check-element {
        margin-right: 5px !important;
    }


    .dxbl-dropdown {
        min-width: max-content;
    }


    /* блър под формата */
    /*
    .dxbl-modal-content {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    }
    */
    .dxbl-modal-body {
        font-size: 1.1rem !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        padding-top: 15px !important;
        padding-bottom: 15px !important;
        overflow-wrap: break-word !important;
        /* word-break: break-word !important; */
        white-space: normal !important;
    }

    .dxbl-text-edit > .dxbl-text-edit-input, .dxbl-text-edit > .dxbl-text-edit-template,
    .dxbl-text-edit > .dxbl-text-edit-template .dxbl-text-edit-input, .dxbl-text-edit > textarea {
        font-size: 1rem !important;
    }

    .dxbl-fl .dxbl-fl-cpt {
        font-family: 'Gilroy-Bold';
        color: #575757;
    }




    .dxbl-modal-header {
        font-size: 1.2rem !important;
        border-radius: 20px 20px 0px 0px;
        background-color: #fff !important;
        color: #000 !important;
        /*
        background-color: #ff8000 !important;
        color: #fff !important; */
        /* background-color: rgba(255, 255, 255, 0.4) !important; 
            color: #212529 !important;*/
        font-family: 'Gilroy-Bold';
        /* font-size: 1.1rem !important;
            font-family: 'Gilroy-Bold';
            border-radius: 20px 20px 0px 0px;
            background-color: #fff !important;
            color: #000 !important; */
    }

    .dxbl-modal-footer {
        background-color: #fff !important;
        padding-bottom: 10px !important;
        padding-top: 0px !important;
        border-radius: 20px !important;
    }

    .dxbl-fl .dxbl-fl-item > .dxbl-fl-ctrl:not(img) {
        width: 100%;
    }



    .dxbl-modal-title {
        font-weight: 100;
    }

    .dxbl-fl .dxbl-fl-gd, .dxbl-fl .dxbl-fl-gt {
        margin-top: calc(var(--dxbl-fl-group-spacing-y) * .5);
        margin-bottom: 0px !important;
    }

    /* нов екран за материал*/
    @media screen and (min-width: 992px) {
        .modal-popup {
            padding-bottom: 15px !important;
            padding-left: 15px !important;
            padding-right: 15px !important;
        }
    }

    @media screen and (max-width: 991px) {
        .modal-popup {
            padding-bottom: 10px !important;
            padding-left: 10px !important;
            padding-right: 10px !important;
        }
    }

    /* модална форма - край */
    a, .btn-link {
        color: #ff8000;
        text-decoration: unset !important;
        font-family: 'Gilroy-Bold';
        font-size: .87rem;
        line-height: 0.85rem;
        text-align: left;
    }

        .btn-link:hover {
            color: rgb(0 0 0) !important;
        }
    /* табове */
    @media screen and (min-width: 920px) {
        .dxbl-fl .dxbl-fl-tab-content {
            padding-top: 20px !important;
        }
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active,
    .dxbl-tabs > .dxbl-tabs-tablist > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active {
        color: #484d51;
        background-color: var(--dxbl-tabs-tab-selected-bg);
        /* border-color: #ff8000 #ff8000 #ff8000 #ff8000; */
        border-radius: 15px 15px 0 0;
        box-shadow: 0px 7px 5px 0px #6c757d;
        padding-right: 8px !important;
        padding-left: 8px !important;
    }
    /* rows margin top */
    @media screen and (max-width: 570px) {
        .dxbl-row {
            margin-top: 5px !important;
        }
    }

    /* cols margin top */


    @media screen and (min-width: 570px) {
        .dxbl-col {
            margin-top: 15px !important;
        }
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl) > .dxbl-image,
    .dxbl-tabs > .dxbl-tabs-tablist > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl) > .dxbl-image {
        font-size: 1.1rem !important;
        margin-bottom: 0px !important;
        margin-top: 0px !important;
    }

    /* Бутони */
.dxbl-btn-danger {
    --dxbl-btn-border-color: #dd2a2a;
    --dxbl-btn-color: #fff;
    --dxbl-btn-hover-bg: #dd2a2a;
    --dxbl-btn-hover-border-color: #dd2a2a;
    background: #dd2a2a;
    border-radius: 10px;
    width: 30%;
    font-size: 1.25rem;
    font-weight: 400;
    padding: 0.65rem 0.75rem;
    /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.dxbl-btn-light {
    --dxbl-btn-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-color: var(--bs-gray-900, #212529);
    --dxbl-btn-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-hover-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-hover-color: var(--bs-gray-900, #212529);
    --dxbl-btn-hover-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-active-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-active-color: var(--bs-gray-900, #212529);
    --dxbl-btn-active-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-disabled-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-disabled-color: var(--bs-gray-900, #212529);
    --dxbl-btn-disabled-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-focus-shadow-color: var(--bs-gray-200, #e9ecef);
    width: 70%;
    font-size: 1.25rem;
    border-radius: 10px;
    /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

    @media screen and (min-width: 920px) {
        .dxbl-btn-primary {
            width: 30% !important;
        }
    }

    @media screen and (max-width: 920px) {
        .dxbl-btn-primary {
            width: 100% !important;
        }
    }

.dxbl-btn-primary {
    --dxbl-btn-bg: var(--bs-primary, var(--primary));
    --dxbl-btn-border-color: rgb(255 147 0 / 0%) !important;
    --dxbl-btn-color: #fff;
    --dxbl-btn-active-bg: var(--bs-primary, var(--primary));
    --dxbl-btn-active-color: #fff;
    --dxbl-btn-active-border-color: var(--bs-primary, var(--primary));
    --dxbl-btn-active-background: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)) !important;
    --dxbl-btn-hover-bg: #ff8000 !important;
    --dxbl-btn-hover-color: #fff;
    --dxbl-btn-hover-border-color: #fff !important;
    --dxbl-btn-hover-background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)) !important;
    --dxbl-btn-disabled-bg: #ced4da !important;
    --dxbl-btn-disabled-color: #ced4da;
    --dxbl-btn-disabled-border-color: #ced4da !important;
    --dxbl-btn-disabled-background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)) !important;
    --dxbl-btn-focus-shadow-color: rgba(var(--bs-primary-rgb), 50%);
    --dxbl-btn-focus-shadow-spread: 0.125rem;
    --dxbl-btn-focus-shadow-blur: 0rem;
    background: linear-gradient(326deg, #ff8000, #ff8000);
    border-radius: 10px;
    width: 100%;
    font-size: 1rem;
    font-weight: 400;
    padding: 0.5rem 0.5rem;
    margin-right: 2px !important;
    /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

        .dxbl-btn-primary:active {
            transform: scale(0.92) !important;
        }

.dxbl-btn-secondary {
    --dxbl-btn-bg: #ced4da;
    --dxbl-btn-color: #000;
    --dxbl-btn-border-color: #ced4da;
    --dxbl-btn-hover-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-hover-color: var(--bs-gray-900, #212529);
    --dxbl-btn-hover-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-active-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-active-color: var(--bs-gray-900, #212529);
    --dxbl-btn-active-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-disabled-bg: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-disabled-color: var(--bs-gray-900, #212529);
    --dxbl-btn-disabled-border-color: var(--bs-gray-300, #dee2e6);
    --dxbl-btn-focus-shadow-color: var(--bs-gray-200, #e9ecef);
    border-radius: 10px;
    width: 20% !important;
    font-size: 1rem;
    font-weight: 400;
    padding: 0.5rem 0.5rem;
    margin-left: 2px !important;
    /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

        .dxbl-btn-secondary:active {
            transform: scale(0.92) !important;
        }

    .clear-button {
        background-color: #dd2a2a !important;
        border-color: #dd2a2a !important;
        color: #fff !important;
        width: 30% !important;
        margin-right: 2px !important;
    }

    .clear-button-time-intervals {
        background-color: #dd2a2a !important;
        border-color: #dd2a2a !important;
        color: #fff !important;
        width: 100%;
        margin-left: 0px;
        height: 40px;
        -webkit-animation: fade-in 0s ease-out 0s both;
        animation: fade-in 0s ease-out 0s both;
    }

    .dxbl-grid-edit-form-buttons > .dxbl-btn:not(:last-child) {
        margin-right: 0px !important;
    }

    .footer-buttons {
        display: inline-flex;
        width: 100%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 5px;
        padding-top: 15px;
        flex-direction: row;
        justify-content: flex-end;
    }

    @media(min-width: 576px) {
        .small-buttons {
            width: 100% !important;
            padding: 0rem 0rem;
            margin-bottom: -10px !important;
            -webkit-animation: none !important;
            animation: none !important;
            color: #ff8000 !important;
            background: #fff !important;
            font-size: 1.5rem;
            /*
        width: 100% !important;
        padding: 0rem 0.75rem;
        -webkit-animation: none !important;
        animation: none !important;
        color: #fff !important;
        */
        }

            .small-buttons:hover {
                transition: all 0.15s ease-in-out;
                transform: scale(1.10);
                border-color: transparent !important;
            }

            .small-buttons:not(:hover) {
                transition: all 0.15s ease-in-out;
            }
    }

    @media(max-width: 576px) {
        .small-buttons {
            width: 100% !important;
            padding: 0rem 0rem;
            margin-bottom: -10px !important;
            -webkit-animation: none !important;
            animation: none !important;
            color: #ff8000 !important;
            background: #fff !important;
            font-size: 2rem;
            /*
        width: 100% !important;
        padding: 0rem 0.75rem;
        -webkit-animation: none !important;
        animation: none !important;
        color: #fff !important;
        */
        }
    }

    @media(min-width: 576px) {
        .small-buttons-clear {
            width: 100% !important;
            padding: 0rem 0rem;
            margin-bottom: -10px !important;
            -webkit-animation: none !important;
            animation: none !important;
            color: rgba(221 42 42) !important;
            background: #fff !important;
            font-size: 1.65rem;
            /*
        width: 100% !important;
        padding: 0rem 0.75rem;
        -webkit-animation: none !important;
        animation: none !important;
        color: #fff !important;
        */
        }

            .small-buttons-clear:hover {
                transition: all 0.15s ease-in-out;
                transform: scale(1.1);
            }

            .small-buttons-clear:not(:hover) {
                transition: all 0.15s ease-in-out;
            }
    }

    @media(max-width: 576px) {
        .small-buttons-clear {
            width: 100% !important;
            padding: 0rem 0rem;
            margin-bottom: -10px !important;
            -webkit-animation: none !important;
            animation: none !important;
            color: rgba(221 42 42) !important;
            background: #fff !important;
            font-size: 1.65rem;
            /*
        width: 100% !important;
        padding: 0rem 0.75rem;
        -webkit-animation: none !important;
        animation: none !important;
        color: #fff !important;
        */
        }
    }
    /* disabled button */
    .dxbl-btn.dxbl-disabled, .dxbl-btn:disabled {
        border-color: #fff0 !important;
    }




    /* Бутони */
    /*
.btn-primary {
color: #fff;
background-color: #1b6ec2;
border-color: #1861ac;
}
*/
    .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
        box-shadow: 0 0 0 0.1rem transparent, 0 0 0 0.25rem transparent;
    }

    .content {
        padding-top: 0.5rem;
    }

    .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."
        }

    @media screen and (max-width: 992px) {
        .gr-h80vh {
            height: calc(100dvh - 170px) !important;
        }
    }

    @media screen and (max-width: 992px) {
        .pricelist-grid {
            height: calc(100dvh - 222px) !important;
        }
    }

    @media screen and (min-width: 992px) {
        .pricelist-grid {
            height: calc(100dvh - 229px) !important;
        }
    }

    @media screen and (min-width: 992px) {
        .pricelist-combo {
            width: 20%;
            margin-bottom: 10px;
            margin-top: 10px !important;
            margin-left: 10px !important;
        }
    }

    @media (orientation: landscape) {
        .pricelist-combo {
            margin-bottom: 0px !important;
        }
    }

    @media screen and (max-width: 992px) {
        .pricelist-combo {
            width: 100%;
            margin-bottom: 17px;
        }
    }

    @media screen and (min-width: 992px) {
        .materialtransfer-combo {
            width: 15%;
            margin-right: 7px;
        }
    }

    @media screen and (max-width: 992px) {
        .materialtransfer-combo {
            width: 100%;
        }
    }

    @media screen and (min-width: 922px) {
        .gr-h80vh {
            height: calc(100dvh - 180px) !important;
        }
    }

    .gr-h100vh {
        height: 100vh !important;
    }
    /* column chooser - header */
    .dxbl-window > .dxbl-window-dialog > .dxbl-window-header {
        cursor: default;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        font-size: var(--dxbl-window-header-font-size);
        line-height: var(--dxbl-window-header-line-height);
        font-weight: 100 !important;
        border-bottom: none !important;
        padding: var(--dxbl-window-header-padding-y) var(--dxbl-window-header-padding-x);
        position: relative;
        background-color: #fff !important;
        /*background-color: #ff8000 !important;*/
        color: #000 !important;
        /*color: #fff !important;*/
        border-radius: 15px 15px 0 0 !important;
    }

.dxbl-window > .dxbl-window-dialog {
    font-family: var(--dxbl-window-font-family);
    font-size: var(--dxbl-window-font-size);
    line-height: var(--dxbl-window-line-height);
    color: var(--dxbl-window-color);
    background-color: var(--dxbl-window-bg);
    border: 0px;
    overflow: hidden;
    border-radius: 15px 15px 15px 15px !important;
    /*-webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
    /* column chooser - header */

    /* margin на модалните форми */
    .dxbl-modal > .dxbl-modal-root > .dxbl-popup {
        margin-right: 10px !important;
        margin-left: 10px !important;
    }

    @media(max-width: 576px) {
        .dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-popup-adaptivity {
            -webkit-align-self: center !important;
            -ms-flex-item-align: center !important;
            align-self: center !important;
            justify-self: stretch;
            width: auto !important;
            min-width: 95vw !important;
            max-width: 95vw !important;
            height: auto !important;
            left: 0 !important;
            right: 0 !important;
        }
    }

    .dxbs-scheduler.dxbs-apt-edit-dialog.dxbs-sc-mobile {
        height: auto !important;
    }

    @media(min-width: 576px) {
        .dxbl-modal > .dxbl-modal-root > .dxbl-popup {
            max-width: 550px;
        }
    }



    /* wrap на текстовете в модалните форми */
    .dxbl-checkbox .dxbl-checkbox-label-ellipsis {
        text-wrap: wrap !important;
    }

    .dxbl-checkbox {
        display: flex !important;
        align-items: center !important;
    }

    @media (min-width: 568px) {
        .home-heading {
            font-family: Gilroy-Bold !important;
            color: #fff;
            font-size: 1.7rem;
            line-height: 1;
            text-align: center;
            padding-right: 20px;
            padding-left: 30px;
            margin-top: 10px !important;
            -webkit-animation: fade-in 1s ease-out .2s both;
            animation: fade-in 1s ease-out .2s both;
        }
    }

    @media (max-width: 568px) {
        .home-heading {
            font-family: Gilroy-Bold !important;
            color: #fff;
            font-size: 1.4rem;
            line-height: 1;
            text-align: center;
            padding-right: 20px;
            padding-left: 10px;
            margin-top: 10px !important;
            -webkit-animation: fade-in 1s ease-out .2s both;
            animation: fade-in 1s ease-out .2s both;
        }
    }




    @media (min-width: 568px) {
        .hello {
            position: absolute;
            left: 0px;
            margin-top: -60px !important;
            width: max-content;
            font-family: Gilroy-Bold !important;
            color: #fff;
            font-size: 2.5rem;
            line-height: 2.55rem;
            text-align: left;
            padding: 10px;
            padding-left: 30px;
            -webkit-animation: fade-in 1s ease-out 0s both;
            animation: fade-in 1s ease-out 0s both;
        }
    }

    @media (max-width: 568px) {
        .hello {
            position: absolute;
            left: 0px;
            margin-top: -140px !important;
            width: 100%;
            font-family: Gilroy-Bold !important;
            color: #fff;
            font-size: 2rem;
            line-height: 2.2rem;
            text-align: left;
            padding: 10px;
            -webkit-animation: fade-in 1s ease-out 0s both;
            animation: fade-in 1s ease-out 0s both;
        }
    }
    /*
    .hello-user {
        color: #fff;
        -webkit-animation: fade-in-top 2s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top 2s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
    }
    */

    /* animation fade-in-bottom */
    @-webkit-keyframes fade-in-bottom {
        0% {
            -webkit-transform: translateY(50px);
            transform: translateY(50px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            opacity: 1;
        }
    }

    @keyframes fade-in-bottom {
        0% {
            -webkit-transform: translateY(50px);
            transform: translateY(50px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            opacity: 1;
        }
    }


    .heading {
        backdrop-filter: blur(0px) !important;
        -webkit-backdrop-filter: blur(0px) !important;
    }

    .slide-in-operations {
        position: relative;
        z-index: 1;
        top: 80px;
        -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both !important;
        animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both !important;
    }

    .slide-in-nomenclature {
        position: relative;
        z-index: 1;
        top: 80px;
        -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both !important;
        animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both !important;
    }

    .slide-in-reports {
        position: relative;
        z-index: 1;
        top: 80px;
        border-radius: 15px !important;
        -webkit-animation: fade-in 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both !important;
        animation: fade-in 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both !important;
    }



    .div-hello {
        -webkit-animation: fade-in 1s ease-out 0s both;
        animation: fade-in 1s ease-out 0s both;
    }

    /* дърво */
    .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container .dxbl-treeview-item-text-container {
        min-width: 0;
        padding-right: 10px;
        padding-left: 10px;
    }

    .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(.dxbl-active) {
        max-width: max-content !important;
    }

    .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-btn {
        --dxbl-btn-color: #ff8000 !important;
        opacity: 1 !important;
    }

        .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-btn > svg.dxbl-image {
            opacity: 1 !important;
        }
    /* дърво */

    /* home екран */
    @media (min-width: 992px) {
        .home {
            margin-bottom: 0px;
            padding-bottom: 50px;
            padding-top: 50px;
        }
    }

    @media screen and (max-width: 992px) and (min-width: 1024px) {
        .home {
            margin-bottom: 50px;
            padding-top: 20px;
        }
    }


    .home {
        position: fixed;
        right: 0px;
        left: 0px;
        bottom: 0.5px;
        top: 0.5px !important;
        padding-top: 80px;
        overflow-x: hidden;
        padding-bottom: 100px;
        overflow-y: auto;
        background-repeat: no-repeat;
        background-attachment: fixed !important;
        /*background-image: url(img/home-background-4.svg);*/
        background-size: cover;
    }


    /* падинг отдолу на таблиците на мобилни */
    @media (max-width: 992px) {
        .dxbl-grid-table {
            padding-bottom: 0px;
        }
    }
    /* падинг отдолу на таблиците на мобилни - край */

    @media (min-width: 992px) {
        .report-buttons {
            grid-template-columns: repeat(5, 1fr) !important;
            top: 150px;
            height: 280px;
            overflow-y: hidden;
            padding-left: 5px;
            padding-right: 5px;
            overflow-x: visible !important;
            transition: all .25s ease-in-out !important;
        }

        .div-operations {
            padding-left: 10px;
            padding-right: 10px;
        }

        .div-nomenclature {
            padding-left: 10px;
            padding-right: 10px;
            margin-top: 90px;
            padding-bottom: 150px;
        }
    }

    @media screen and (max-width: 992px) and (min-width: 576px) {
        .report-buttons {
            top: 150px;
            height: 410px;
            overflow-y: hidden;
            transition: all .25s ease-in-out !important;
        }
    }

    @media (max-width: 576px) {
        .report-buttons {
            top: 150px;
            height: 475px;
            overflow-y: hidden;
            transition: all .25s ease-in-out !important;
        }
    }

    @media screen and (max-width: 992px) and (min-width: 576px) {
        .div-nomenclature {
            padding-left: 10px;
            padding-right: 10px;
            margin-top: 90px;
        }
    }

    @media (orientation: landscape) and (max-width: 992px) {
        .report-buttons {
            top: 150px;
            height: 405px;
            overflow-y: hidden;
            transition: all .25s ease-in-out !important;
        }
    }

    @media (orientation: portrait) and (max-width: 992px) {
        .home-buttons {
            grid-template-columns: repeat(4, 1fr);
            top: 150px;
        }
    }

    @media screen and (min-width: 992px) {
        .home-buttons {
            grid-template-columns: repeat(4, 1fr);
            top: 80px !important;
        }
    }

    @media screen and (max-width: 992px) and (min-width: 576px) {
        .home-buttons {
            grid-template-columns: repeat(4, 1fr);
            top: 80px !important;
        }
    }

    @media screen and (max-width: 576px) and (min-width: 320px) {
        .home-buttons {
            grid-template-columns: repeat(2, 1fr);
            top: 80px !important;
        }
    }

    @media screen and (max-width: 320px) and (min-width: 0px) {
        .home-buttons {
            grid-template-columns: repeat(1, 1fr);
            top: 80px !important;
        }
    }

    @media (min-width: 568px) {
        .home-buttons {
            position: relative;
            padding-top: 10px !important;
            padding-left: 20px;
            padding-right: 20px;
            left: 0px;
            right: 0px;
            bottom: 0px;
            margin-top: 120px;
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            gap: .7rem;
            overflow-x: visible !important;
        }
    }

    @media (max-width: 568px) {
        .home-buttons {
            margin-top: -80px !important;
            position: relative;
            padding-top: 40px !important;
            margin-right: 10px !important;
            margin-left: 10px !important;
            top: 150px;
            left: 0px;
            right: 0px;
            bottom: 0px;
            margin-top: 120px;
            max-width: 1200px;
            margin: 0 auto;
            display: grid;
            gap: .5rem;
            overflow-x: visible !important;
            padding-bottom: 120px !important;
        }
    }

    @media (min-width: 568px) {
        .button-bg {
            height: 130px;
            /*top: 80px !important;*/
            margin-left: 0px;
            margin-right: 0px;
            background: #fffa;
            border-radius: 15px 15px 15px 15px;
            border-width: 1px 1px 1px 1px;
            position: relative;
            left: 0px;
            top: 0px;
            right: 0px;
            bottom: 0px;
            /* margin: 20px; */
            /* height: 150px; */
            /* width: 200px; */
            overflow: hidden;
            z-index: 1;
        }
    }

    @media (max-width: 568px) {
        .slide-in-operations, .slide-in-nomenclature, .slide-in-reports {
            top: 120px !important;
        }
    }

    @media (max-width: 568px) {
        .button-bg {
            height: 120px;
            /*top: 120px !important;*/
            /*margin-left: 10px;
    margin-right: 10px; */
            background: #fffa;
            border-radius: 15px 15px 15px 15px;
            border-width: 1px 1px 1px 1px;
            position: relative;
            left: 0px;
            top: 0px;
            right: 0px;
            bottom: 0px;
            /* margin: 20px; */
            /* height: 150px; */
            /* width: 200px; */
            overflow: hidden;
            z-index: 1;
        }
    }

    @media (max-width: 992px) {
        .button-info {
            display: none !important;
        }
    }

    .button-info {
        height: 0px;
        position: absolute;
        z-index: 2;
        bottom: -90px;
        font-family: 'Gilroy' !important;
        font-size: .9rem !important;
        line-height: 1.1rem !important;
        color: #fff !important;
        left: 0px;
        right: 0px;
        display: flex;
        padding: 10px;
        background-color: transparent !important;
        backdrop-filter: blur(5px) !important;
        transition: all .25s ease-in-out !important;
        align-content: center;
        justify-content: center;
        align-items: center;
        text-align: center;
        transition: all .25s ease-in-out !important;
    }

    .button-bg:hover .button-info {
        height: 90px;
        position: absolute;
        z-index: 2;
        bottom: 0px;
        font-family: 'Gilroy' !important;
        font-size: .9rem !important;
        line-height: 1.1rem !important;
        color: #fff !important;
        left: 0px;
        right: 0px;
        display: flex;
        padding: 10px;
        background-color: #00000033 !important;
        backdrop-filter: blur(5px) !important;
        -webkit-backdrop-filter: blur(5px);
        transition: all .25s ease-in-out !important;
        align-content: center;
        justify-content: center;
        align-items: center;
        text-align: center;
        transform: scale(1) !important;
        transition: all .25s ease-in-out !important;
    }

    @media (min-width: 992px) {
        .button-bg:hover {
            overflow: hidden;
            border-radius: 15px 15px 15px 15px;
            box-shadow: 0px 0px 5px 0px #2125297a;
            transform: scale(1) !important;
            transition: all .15s ease-in-out !important;
        }
    }

    .button-bg:not(:hover) {
        transition: all .15s ease-in-out;
    }

    /* анимация на иконите на хоум бутоните */
    @media (min-width: 992px) {
        .button-bg:hover .main-button span {
            /*color: #fff;*/

            font-size: 2.4rem;
            transform: scale(1.2);
            transition: all .15s ease-in-out;
            /*-webkit-animation: pulsate-fwd 1.2s ease-in-out infinite both;
            animation: pulsate-fwd 1.2s ease-in-out infinite both;*/
        }
    }

    .button-bg:not(:hover) .main-button span {
        transition: all .25s ease-in-out;
    }

    @media (max-width: 992px) {
        .button-bg:hover .main-button span {
            /*color: #fff;*/

            font-size: 2.4rem;
            transform: scale(0.9);
            transition: all .25s ease-in-out;
        }
    }
    /* анимация на иконите на хоум бутоните -  край*/

    .button-bg {
        background: linear-gradient(344deg, #19242f 0%, #667e8f73 100%);
        /* background: linear-gradient(344deg, #19242f 0%, #667e8f 100%); */
    }

    @media (min-width: 568px) {
        .main-button {
            border-radius: 15px 15px 15px 15px;
            height: 100%;
            width: 100%;
            padding-right: 0px;
            padding-left: 0px;
            color: #fff;
            background-color: transparent;
            line-height: 24px;
            font-size: 1.1rem;
            line-height: 1.1rem;
            border: 0px;
            display: flex;
            align-content: center;
            justify-content: space-evenly;
            align-items: center;
            flex-direction: column;
            text-decoration: none;
            padding: 10px;
        }
    }

    @media (max-width: 568px) {
        .main-button {
            border-radius: 15px 15px 15px 15px;
            height: 100%;
            width: 100%;
            padding-right: 0px;
            padding-left: 0px;
            color: #fff;
            background-color: transparent;
            line-height: 24px;
            font-size: 1rem;
            line-height: 1.1rem;
            border: 0px;
            display: flex;
            align-content: center;
            justify-content: space-evenly;
            align-items: center;
            flex-direction: column;
            text-decoration: none;
        }
    }


    .main-button span {
        color: #ff8000;
        font-size: 2.4rem;
    }

    @media (min-width: 568px) {
        .main-button:hover {
            /*background: linear-gradient(344deg, #1a2732 0%, #FF9800 100%);*/
            background-color: rgb(0 0 0 / 30%);
            color: #fff;
            transition: all .15s ease-in-out;
        }
    }

    @media (min-width: 568px) {
        .main-button:hover {
        }
    }

    @media (min-width: 568px) {
        .div-hello {
            position: absolute;
            /* padding-bottom: 50px; */
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1;
            top: 40px !important;
        }
    }

    @media (max-width: 568px) {
        .div-hello {
            position: absolute;
            /* padding-bottom: 50px; */
            display: flex;
            justify-content: left;
            align-items: center;
            width: 100%;
            z-index: 1;
            top: 110px !important;
        }
    }

    /* нов изглед на бутоните на хоум страницата */

    @media screen and (min-width: 992px) {
        .button-bg {
            height: 300px;
            /*box-shadow: 0px 0px 8px 7px #21252921;*/
            /*background: #334655;*/
            background: linear-gradient(0deg, #23313c, #334655);
            height: 180px;
        }
    }

    @media screen and (max-width: 992px) {
        .button-bg {
            height: 300px;
            /*box-shadow: 0px 0px 8px 7px #21252921;*/
            /*background: #334655;*/
            background: linear-gradient(0deg, #23313c, #334655);
            height: 150px;
        }
    }

    @media screen and (min-width: 992px) {
        .main-button {
            font-family: 'Gilroy';
            font-size: 1.2rem;
            line-height: 1.3rem;
            letter-spacing: 0.03rem;
        }
    }

    @media screen and (max-width: 992px) {
        .main-button {
            padding-left: 20px;
            padding-right: 20px;
            font-family: Gilroy;
            font-size: 1rem;
            word-wrap: normal;
        }
    }

    /* нов изглед на бутоните на хоум страницата - край*/
    /* home екран - край*/

    .dxbl-listbox {
        /* border-radius: 10px !important; */
        height: 450px !important;
    }

    /* allign items in rows in a form */

    @media(min-width: 992px) {
        .dxbl-row {
            display: flex !important;
            flex-wrap: wrap !important;
            align-items: center !important;
        }
    }

    @media(max-width: 992px) {
        .dxbl-row {
            display: flex !important;
            flex-wrap: wrap !important;
            align-items: flex-end !important;
        }
    }
    /* allign items in rows in a form - край */

    /* tree view - custom */
    .dxbl-treeview-custom {
        /* border-width: 1px !important; */
        /* border-color: rgba(0,0,0,.1) !important; */
        background-color: #fff;
        /* border-style: solid; */
        /* border-width: 1px; */
        border-radius: 20px;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        border-color: var(--bs-border-color, var(--bs-gray-400, #ced4da)) !important;
        border-radius: 0.8rem;
        border-style: none !important;
        border-width: 1px;
        box-shadow: 0px 0px 2px 2px #0000000d !important;
        -webkit-animation: fade-in-fwd 0.6s cubic-bezier(0.175, 0.885, 0.320, 1.275) .3s both !important;
        animation: fade-in-fwd 0.6s cubic-bezier(0.175, 0.885, 0.320, 1.275) .3s both !important;
    }

    @media screen and (max-width: 992px) {
        .dxbl-treeview-custom {
            /*height: 84vh !important;*/
            height: calc(100dvh - 170px) !important;
        }
    }

    @media screen and (min-width: 992px) {
        .dxbl-treeview-custom {
            height: 83vh !important;
            height: calc(100dvh - 180px) !important;
        }
    }

    .dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(:disabled).dxbl-active {
        color: #fff !important;
        padding-left: 10px !important;
        transition: all 0.15s ease-in-out;
        max-width: max-content !important;
        padding-right: 10px !important;
    }

    /* стил на ховър на табовете */
    .dxbl-tabs-item::before {
        background-color: #fff !important;
        border-style: solid;
        border-width: 0px;
        color: #000000 !important;
    }

    .dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-active):not(.dxbl-disabled):not(:disabled),
    .dxbl-tabs > .dxbl-tabs-tablist > ul > li > .dxbl-tabs-item:not(.dxbl-active):not(.dxbl-disabled):not(:disabled) {
        cursor: pointer;
        border-style: solid !important;
        border-width: 0px !important;
    }
    /* стил на ховър на табовете - край*/

    /* toolbar buttons animation */
    .toolbar-button {
        -webkit-animation: fade-in 0s ease-out 0s both;
        animation: fade-in 0s ease-out 0s both;
    }

    /* линкове в гридове */

    .dxbl-btn.dxbl-btn-link span:not(.dxbl-image), .dxbl-btn.dxbl-btn-outline-link span:not(.dxbl-image), .dxbl-btn.dxbl-btn-text-link span:not(.dxbl-image) {
        /* text-decoration: unset !important; */
        font-family: 'Gilroy-Bold' !important;
        color: #ff8000 !important;
    }


    .dxbl-window {
        /* --dxbl-window-box-shadow: 0rem 0rem .5rem rgb(0 0 0 / 82%) !important; */
        -webkit-animation: fade-in 0s 0s both;
        animation: fade-in 0s 0s both;
    }
    /* tree - категории */
    .categories {
        color: #ff8000;
        font-size: 1.5rem;
        margin-right: 15px;
    }

    .categories-div {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
    }
    /* tree - категории - край */


    /* филтър в гридовете */
    .dxbl-grid-filter-menu-dropdown {
        background-color: #fff !important;
        color: #000 !important;
        width: 100% !important;
        /*height: 600px !important;*/
        box-shadow: 0px 12px 20px 12px #00000021 !important;
        border-radius: 20px 20px 20px 20px !important;
    }

    .dxbl-grid-filter-menu-dropdown, .dxbl-grid-filter-menu-dropdown {
        padding: 10px !important;
    }

    .dxbl-dropdown-footer {
        padding: 0px !important;
    }
    /* филтър в гридовете - край */

    /* филтър в treeview */
    @media screen and (min-width: 992px) {
        #categories .dxbl-navigation-filter { /* само за категориите id="categories" */
            width: 20% !important;
            position: absolute !important;
            z-index: 5 !important;
            right: 40px !important;
        }
    }
    /* филтър в treeview - край */


    /* размер на тулбар бутоните когато са само 3 на мобилни устройства */
    @media screen and (max-width: 992px) {
        #categories .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #types .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #properties .toolbar-button { /* "#" - id в съответната страница на DxToolbar */
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #pricelists .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #timeintervals .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #uoms .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #mealplans .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #pdf .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #ocr .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #materialtransfer .toolbar-button {
            min-width: 47.2vw !important;
            margin-top: 3px !important;
            padding-right: 20px !important;
            padding-left: 20px !important;
        }
    }

    @media screen and (max-width: 992px) {
        #inventory .toolbar-button {
            min-width: 47.2vw !important;
            margin-top: 3px !important;
            padding-right: 20px !important;
            padding-left: 20px !important;
        }
    }

    @media screen and (max-width: 992px) {
        #reports .toolbar-button {
            min-width: 47.2vw !important;
            margin-top: 3px !important;
            padding-right: 20px !important;
            padding-left: 20px !important;
        }
    }

    @media screen and (max-width: 992px) {
        #reports-3 .toolbar-button {
            min-width: 30.5vw !important;
        }
    }

    @media screen and (max-width: 992px) {
        #reports-load .toolbar-button {
            min-width: 97.5vw !important;
            margin-top: 3px !important;
            padding-right: 20px !important;
            padding-left: 20px !important;
        }
    }



    /* размер на тулбар бутоните когато са само 3 на мобилни устройства - край*/


    /* meal planing */
    @media screen and (min-width: 992px) {
        .meal-planing {
            margin-top: 40px;
            height: 84.5vh !important;
        }
    }

    @media screen and (max-width: 992px) {
        .meal-planing {
            /* margin-top: 20px; */
            height: calc(100dvh - 105px) !important;
        }
    }

    .meal-planing {
        background-color: inherit;
        position: -webkit-sticky;
        position: sticky;
        z-index: 2;
        /*background: linear-gradient(#fff, rgb(255 147 0) 200%) !important;*/
        color: #212529;
        box-shadow: 0px 0px 4px 2px #00000014 !important;
        border-width: 1px !important;
        border-color: #ced4da !important;
        border-bottom: 0px !important;
        border-top: 1px !important;
        border-radius: .8rem !important;
        overflow: scroll !important;
    }



    @media screen and (min-width: 992px) {
        .dxsc-toolbar-dropdown-item {
            background-color: #fff !important;
            color: #000 !important;
            width: 100% !important;
            height: auto !important;
            box-shadow: 0px 12px 20px 12px #00000021 !important;
            border-radius: 20px 20px 20px 20px !important;
        }
    }

    @media screen and (max-width: 992px) {
        .dxsc-toolbar-dropdown-item {
            background-color: #fff !important;
            color: #000 !important;
            width: 100% !important;
            height: auto !important;
            position: fixed !important;
            left: 20px !important;
            right: 20px !important;
            box-shadow: 0px 12px 20px 12px #00000021 !important;
            border-radius: 20px 20px 20px 20px !important;
        }
    }

    .dxbl-calendar .dxbl-calendar-header {
        background-color: #fff !important;
    }

    @media screen and (max-width: 992px) {
        .dxbl-scheduler .dxsc-main-container {
            overflow-x: scroll !important;
            overflow-y: scroll !important;
        }
    }

    @media screen and (max-width: 992px) {
        .dxbs-sc-dayview {
            width: 1200px !important;
            overflow-y: scroll !important;
            overflow-x: scroll !important;
        }
    }

    @media screen and (min-width: 992px) {
        .dxbs-sc-dayview {
            overflow-y: scroll !important;
        }
    }

    @media screen and (max-width: 992px) {
        dxbl-scheduler .dxsc-main-container {
            overflow-x: scroll !important;
            overflow-y: scroll !important;
        }
    }



    .dxbl-calendar .dxbl-calendar-footer {
        background-color: #fff !important;
    }

    .dxbs-sc-apt {
        -webkit-animation: scale-in-ver-top 1s cubic-bezier(0.190, 1.000, 0.220, 1.000) .5s both;
        animation: scale-in-ver-top 1s cubic-bezier(0.190, 1.000, 0.220, 1.000) .5s both;
    }

    .box-appointment:hover {
        cursor: pointer !important;
        transform: scale(1.01);
        box-shadow: 5px 8px 13px 0px #0000003d;
        transition: all .10s ease-in-out !important;
    }

    .box-appointment:not(:hover) {
        transition: all .10s ease-in-out !important;
    }

    .dxbl-flyout {
        /*box-shadow: 0px 0px 30px 300vw #21252969 !important; */
    }

    /* meal planing - край */


    /* бутон today на календар */
    .dxbl-calendar .dxbl-calendar-footer .dxbl-btn {
        background-color: #ff8000 !important;
        color: #fff !important;
        border-style: none !important;
        width: 100% !important;
    }

    /* бутон today на календар - край */

    /* поле за партньор */
    .partner-icon {
        margin-right: 3px;
    }

    @media (orientation: landscape) {
        .partner-name {
            top: 40px !important;
        }
    }

    @media screen and (max-width: 992px) {
        .partner-name {
            position: fixed;
            top: 50px;
            z-index: 1 !important;
            /* left: 0px; */
            right: 0px !important;
            /* margin-left: 50px; */
            /* margin-right: 50px; */
            /* align-content: center !important; */
            /* text-align: center; */
            width: 90%;
            color: #fff;
            font-size: .8rem !important;
            /* backdrop-filter: blur(8px); */
            -webkit-backdrop-filter: blur(8px);
            background-color: #ff8000 !important;
            /* box-shadow: 4px -4px 9px 0px #0000004d; */
            box-shadow: 0px 0px 6px 0px #3d3d3d70;
            border-radius: 0px 0px 0px 10px !important;
            padding: 6px;
            padding-top: 2px;
            padding-bottom: 3px;
            padding-right: 8px !important;
            padding-left: 8px !important;
            width: auto;
            height: 25px;
            display: flex;
            align-content: center;
            align-items: center;
            -webkit-animation: scale-in-ver-top 1s cubic-bezier(0.190, 1.000, 0.220, 1.000) .5s both;
            animation: scale-in-ver-top 1s cubic-bezier(0.190, 1.000, 0.220, 1.000) .5s both;
        }
    }

    @media screen and (min-width: 992px) {
        .partner-name {
            margin-bottom: 0rem !important;
            margin-right: 20px !important;
            font-family: 'Gilroy-Bold';
        }
    }
    /* поле за партньор - край*/
    /*.dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content {
        padding-bottom: 100px !important;
    }
        */

    /* itemlist-dropdown */
    .dxbl-dropdown, .dxbl-itemlist-dropdown {
        width: 100% !important;
    }
    /* бутон за премахване от текст едит */
    .dxbl-text-edit > .dxbl-btn.dxbl-edit-btn-clear > .dxbl-image {
        background-color: #ff8000 !important;
    }

        .dxbl-text-edit > .dxbl-btn.dxbl-edit-btn-clear > .dxbl-image:hover {
            background-color: #dd2a2a !important;
            transform: scale(1.2) !important;
            transition: all .10s ease-in-out !important;
        }

        .dxbl-text-edit > .dxbl-btn.dxbl-edit-btn-clear > .dxbl-image:not(:hover) {
            transition: all .10s ease-in-out !important;
        }

    /* бутони в гридовете */
    .grid-btn {
        background: transparent !important;
        font-size: 1.2rem !important;
        width: max-content !important;
        /*padding-bottom: 3px;*/
        text-shadow: 0px 0px 2px #0000 !important;
        -webkit-animation: fade-in 0s ease-out 0s both;
        animation: fade-in 0s ease-out 0s both;
    }

    .dxbl-grid-command-cell {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        background: #fff !important;
        overflow: visible !important;
        border-top: 0px !important;
    }

    #new .dxbl-image:not(svg) {
        font-size: 1.7rem !important;
        line-height: 1.7rem !important;        
    }

    @media screen and (min-width: 992px) {
        #new:hover .dxbl-image:not(svg) {
            color: #000 !important;
        }
    }

    

    .grid-btn:hover {
        transform: scale(1.1);
    }

    .grid-btn-new {
        -webkit-animation: blink-2 1.5s infinite both;
        animation: blink-2 1.5s infinite both;
    }

        .grid-btn-new:hover {
            -webkit-animation: blink-2 0s infinite both;
            animation: blink-2 0s infinite both;
            transform: scale(1);
        }

    #delete .dxbl-image:not(svg) {
        color: rgba(221 42 42) !important;
        font-size: 1rem !important;
    }

    #edit .dxbl-image:not(svg) {
        font-size: 1rem !important;
    }
    /* бутони в гридовете - край*/

    /* combo in deliveries */
    @media screen and (min-width: 992px) {
        .combo-and-partner {
            display: flex;
            align-content: center;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 5px;
        }
    }

    @media screen and (max-width: 992px) {
        .combo-and-partner {
            display: flex;
            align-content: center;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 0px;
        }
    }
    /* combo in deliveries - край*/

    /* combo in material transfer */
    @media screen and (min-width: 992px) {
        .mattransfer {
            display: flex;
            align-content: center;
            flex-direction: row;
            /*justify-content: space-between;*/
            align-items: center;
            margin-bottom: 7px;
            padding-top: 10px !important;
        }

        .combo-material-transfer {
            display: flex;
            gap: 5px;
            align-content: center;
            flex-direction: row;
            /*justify-content: space-between;*/
            align-items: center;
            margin-bottom: 7px;
            padding-top: 10px !important;
            margin-left: 10px !important;
        }
    }

    @media screen and (max-width: 992px) {
        .mattransfer {
            display: flex;
            align-content: center;
            flex-direction: row;
            /* justify-content: space-between; */
            align-items: center;
            margin-bottom: 7px;
            padding-top: 10px !important;
        }

        .combo-material-transfer {
            display: flex;
            align-content: center;
            flex-direction: row;
            /* justify-content: space-between; */
            align-items: center;
            margin-bottom: 7px;
            /*padding-top: 10px !important;*/
        }
    }

    .arow-matierial-transfer {
        color: #6c757d;
    }

    /* combo in material transfer - край*/
    /* select operation icon */
    @-webkit-keyframes fade-in-bottom {
        0% {
            -webkit-transform: translateY(50px);
            transform: translateY(50px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            opacity: 1;
        }
    }

    @keyframes fade-in-bottom {
        0% {
            -webkit-transform: translateY(50px);
            transform: translateY(50px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0);
            opacity: 1;
        }
    }

    @media screen and (min-width: 992px) {
        .select-operation-icon {
            position: fixed;
            height: 200px;
            color: #ff8000;
            font-size: 1.8rem !important;
            -webkit-animation: fade-in-bottom 2s cubic-bezier(0.50, 1.575, 0.565, 1.000) infinite both;
            animation: fade-in-bottom 2s cubic-bezier(0.50, 1.575, 0.565, 1.000) infinite both;
        }
    }

    @media screen and (max-width: 992px) {
        .select-operation-icon {
            color: #ff8000;
            font-size: 2.5rem !important;
            position: relative;
            top: 20px;
            width: 100% !important;
            right: 0px !important;
            left: 0px !important;
            display: flex;
            -webkit-animation: fade-in-bottom 2s cubic-bezier(0.90, 1.575, 0.565, 1.500) infinite both;
            animation: fade-in-bottom 2s cubic-bezier(0.90, 1.575, 0.565, 1.500) infinite both;
            justify-content: center;
            align-items: center;
        }
    }

    @media screen and (max-width: 992px) {
        .select-operation-icon-mat-transfer {
            color: #ff8000;
            font-size: 2.5rem !important;
            position: relative;
            top: 20px;
            /* width: 100% !important; */
            /* right: 0px !important; */
            left: 0px !important;
            display: flex;
            -webkit-animation: fade-in-bottom 2s cubic-bezier(0.90, 1.575, 0.565, 1.500) infinite both;
            animation: fade-in-bottom 2s cubic-bezier(0.90, 1.575, 0.565, 1.500) infinite both;
            justify-content: flex-start;
            align-items: center;
        }
    }
    /* select operation icon - край */




    /* home reports buttons */

    /* цветове на бутоните за справки */
    /*
    .rep-cat-balances {
        
    }

    .rep-cat-sales {
        background-color: #17374d !important;
    }

    .rep-cat-deliveries {
        background-color: #3a3a43 !important;
    }

    .rep-cat-availability {
        background-color: #294f6b !important;
    }

    .rep-cat-transfer {
        background-color: #323539 !important;
    }

    .rep-cat-waste {
        background-color: #212529 !important;
    }

    .rep-cat-others {
        background-color: #152939  !important;
    }
    */


    .reports {
        background-color: #334655;
        /*background-image: url(/css/img/chart.png) !important; */
        background-size: 100% 90%;
        background-repeat: no-repeat;
        background-position: bottom center !important;
        top: 0px;
        bottom: 0px;
        left: 0px;
        right: 0px;
        transition: all .15s ease-in-out !important;
    }

    @media screen and (min-width: 992px) {
        .reports:hover {
            /* background-image: url(/css/img/chart.png) !important; */
            background-size: 100% 100%;
            background-repeat: no-repeat;
            background-position: bottom center !important;
            transition: all .25s ease-in-out !important;
        }
    }

    @media screen and (min-width: 992px) {
        .rep-button-title {
            font-family: 'Gilroy' !important;
            position: absolute;
            width: 100% !important;
            top: 0px !important;
            left: 0px !important;
            padding-top: 20px !important;
            padding-left: 20px !important;
            padding-right: 80px !important;
            padding-bottom: 50% !important;
            font-size: 1.1rem !important;
            line-height: 1.1rem !important;
            color: #fff !important;
            text-align: left !important;
        }
    }

    @media screen and (min-width: 992px) {


        #reports:hover .rep-button-title {
            font-family: 'Gilroy' !important;
            position: absolute;
            width: 100% !important;
            top: 0px !important;
            left: 0px !important;
            padding-top: 20px !important;
            padding-left: 20px !important;
            padding-right: 80px !important;
            padding-bottom: 50% !important;
            transform: scale(1) !important;
            font-size: 1.1rem !important;
            line-height: 1.1rem !important;
            color: #fff !important;
            text-align: left !important;
        }
    }

    @media screen and (max-width: 992px) {
        .rep-button-title {
            background: linear-gradient(180deg, #0000001a, transparent);
            font-family: 'Gilroy' !important;
            position: absolute;
            width: 100% !important;
            top: 0px !important;
            left: 0px !important;
            padding-top: 15px !important;
            padding-left: 15px !important;
            padding-right: 40px !important;
            padding-bottom: 50% !important;
            font-size: 1rem !important;
            letter-spacing: .2px !important;
            line-height: 1rem !important;
            color: #fff !important;
            text-align: left !important;
        }
    }

    @media screen and (max-width: 992px) {
        #reports:hover .rep-button-title {
            background: linear-gradient(180deg, #00000061, transparent);
            font-family: 'Gilroy' !important;
            position: absolute;
            width: 100% !important;
            top: 0px !important;
            left: 0px !important;
            padding-top: 15px !important;
            padding-left: 15px !important;
            padding-right: 40px !important;
            padding-bottom: 50% !important;
            transform: scale(1) !important;
            font-size: 1rem !important;
            line-height: 1rem !important;
            color: #fff !important;
            text-align: left !important;
        }
    }
    /* home reports buttons  - край */



    @media screen and (max-width: 992px) {
        .div-checkboxes {
            position: fixed;
            z-index: 1046;
            display: flex;
            top: 65px;
            left: -500px;
            background: #33333300 !important;
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(10px);
            border: none !important;
            box-shadow: 0px 0px 6px 0px #3d3d3d70;
            border-radius: 10px;
            padding: 2px;
            height: 40px !important;
            transition: all .25s ease-in-out !important;
        }
    }

    @media screen and (min-width: 992px) {
        .div-checkboxes {
            position: relative;
            display: flex;
            margin-left: 10px;
            align-items: center;
            max-height: 40px;
        }
    }
    /* check icon */
    .check-icon {
        font-size: 1.3rem;
        color: #ff8000;
    }

    @media screen and (min-width: 992px) {
        .rep-with-chart {
            height: calc(100vh - 221px) !important;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
        }
    }

    @media screen and (max-width: 992px) {
        .rep-with-chart {
            height: calc(100dvh - 217px) !important;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            max-width: 98vw;
        }
    }

    @media screen and (max-width: 992px) {
        .dx-blazor-widget .dx-chart-with-legend-container {
            padding-bottom: 0px !important;
        }
    }

    .chart {
        padding-bottom: 10px !important;
        padding-top: 10px !important;
        padding-bottom: 0px !important;
        /* margin-bottom: 10px !important; */
        border-radius: 0.8rem !important;
        box-shadow: 0px 0px 2px 2px #0000000d !important;
        -webkit-animation: fade-in-fwd 0.6s cubic-bezier(0.175, 0.885, 0.320, 1.275) .3s both !important;
        animation: fade-in-fwd 0.6s cubic-bezier(0.175, 0.885, 0.320, 1.275) .3s both !important;
    }


    @media screen and (min-width: 992px) {
        .hello-top {
            padding-bottom: 10px !important;
        }
    }

    @media screen and (max-width: 992px) {
        .hello-top {
            padding-bottom: 30px !important;
        }
    }

    .grid-under-chart {
        height: 130% !important;
    }

    @media screen and (min-width: 992px) {
        .grid-btn-link {
            width: 100% !important;
            height: 100% !important;
            padding: 5px !important;
            font-size: .8rem !important;
            border: 0px solid transparent !important;
        }
    }

    @media screen and (max-width: 992px) {
        .grid-btn-link {
            width: 100% !important;
            height: 100% !important;
            padding: 5px !important;
            font-size: .8rem !important;
            border: 0px solid transparent !important;
        }
    }

    .grid-btn-link:active {
        width: 100% !important;
        height: 100% !important;
        border-style: solid !important;
        border: 0px !important;
        border-color: #fff !important;
        background-color: transparent !important;
        font-size: .78rem !important;
        line-height: .78rem !important;
        transition: none !important;
    }

    @media screen and (min-width: 992px) {
        .home-landscape {
            display: none;
        }
    }

    .dxbl-grid > .dxbl-scroll-viewer-content {
        padding-bottom: 50px !important;
    }



    @media all and (orientation:landscape) and (max-width: 992px) {
        .dxbl-toolbar.dxbl-toolbar-adaptive {
            height: 50px !important;
            padding-top: 2px;
        }


        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn-split > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn-split > .dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn.dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn-split > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn-split > .dxbl-btn.dxbl-btn-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn.dxbl-btn-outline-secondary,
        .dxbl-toolbar > .dxbl-btn-toolbar .dxbl-toolbar-btn > .dxbl-btn.dxbl-btn-secondary {
            font-size: .6rem;
            line-height: .6rem;
            max-height: 40px !important;
            min-height: 40px !important;
        }

        .toolbar-button .dxbl-image:not(svg) {
            margin-bottom: 2px !important;
        }

        .menu-style {
            height: 40px !important;
        }

        .location-name {
            position: fixed;
            z-index: 99;
            top: 40px;
            min-width: 90px;
            text-align: center;
            left: 50% !important;
            transform: translateX(-50%);
            padding: 0px 10px 0px 10px;
            border-top: 1px dashed #fff;
            border-radius: 0px 0px 5px 5px;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            background: linear-gradient(180deg, #333333, #333333);
            color: #ffffff !important;
            font-size: 0.8rem;
            font-family: 'Gilroy';
            box-shadow: 0px 2px 3px #00000069;
            -webkit-animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
            animation: fade-in 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both;
        }

        .div-logo {
            display: flex;
            position: absolute;
            z-index: 99999 !important;
            top: 7px;
            margin-left: 0px;
        }

        .logo-menu {
            height: 100% !important;
            width: 70px;
        }

        .label-top {
            font-size: .7rem;
            margin-top: 5px;
        }

        .dxbl-menu.dxbl-menu-horizontal > .dxbl-menu-nav .dxbl-menu-nav-bar.dxbl-menu-hamburger-btn-pos-right > .dxbl-btn {
            max-height: 40px !important;
        }

        .dxbl-menu.dxbl-menu-horizontal > .dxbl-menu-nav .dxbl-menu-nav-bar.dxbl-menu-hamburger-btn-pos-left {
            -webkit-flex-direction: row !important;
            -ms-flex-direction: row !important;
            flex-direction: row !important;
            height: 40px !important;
        }
        /*
        .page-heading {
            display: none;
        }
            */

        .dxbl-grid-group-panel-container {
            height: 0px;
            padding: 0px !important;
        }


        .content {
            padding-top: 0rem !important;
        }



        .dxbl-grid .dxbl-grid-table > tbody > tr:not(.dxbl-grid-edit-row):not(.dxbl-grid-empty-row):not(.dxbl-grid-filter-row) > td:not(.dxbl-grid-indent-cell):not(.dxbl-grid-expand-button-cell):not(.dxbl-grid-empty-cell):not(.dxbl-grid-empty-data):not(.dxbl-grid-edit-form):not(.dxbl-grid-detail-cell), .dxbl-grid .dxbl-grid-table > tbody > tr > th:not(.dxbl-grid-header-indent-cell):not(.dxbl-grid-empty-header), .dxbl-grid .dxbl-grid-table > tfoot > tr:not(.dxbl-grid-edit-row):not(.dxbl-grid-empty-row):not(.dxbl-grid-filter-row) > td:not(.dxbl-grid-indent-cell):not(.dxbl-grid-expand-button-cell):not(.dxbl-grid-empty-cell):not(.dxbl-grid-empty-data):not(.dxbl-grid-edit-form):not(.dxbl-grid-detail-cell), .dxbl-grid .dxbl-grid-table > tfoot > tr > th:not(.dxbl-grid-header-indent-cell):not(.dxbl-grid-empty-header), .dxbl-grid .dxbl-grid-table > thead > tr:not(.dxbl-grid-edit-row):not(.dxbl-grid-empty-row):not(.dxbl-grid-filter-row) > td:not(.dxbl-grid-indent-cell):not(.dxbl-grid-expand-button-cell):not(.dxbl-grid-empty-cell):not(.dxbl-grid-empty-data):not(.dxbl-grid-edit-form):not(.dxbl-grid-detail-cell), .dxbl-grid .dxbl-grid-table > thead > tr > th:not(.dxbl-grid-header-indent-cell):not(.dxbl-grid-empty-header) {
            font-size: .7rem !important;
            line-height: .9rem !important;
            padding: 2px !important;
            padding-right: 5px !important;
        }

        .dxbl-btn.dxbl-grid-filter-menu-funnel-btn {
            display: none !important;
        }

        .gr-h80vh {
            height: calc(100dvh - 133px) !important;
            position: absolute !important;
            left: 0px;
            border-radius: 0px;
            box-shadow: 0px 0px 2px 2px #00000000 !important;
        }

        .pricelist-grid {
            height: calc(100dvh - 167px) !important;
            position: fixed !important;
            left: 0px !important;
            border-radius: 0px !important;
            box-shadow: 0px 0px 2px 2px #00000000 !important;
            margin-top: 0px !important;
            overflow: visible !important;
        }

        .dxbl-grid > .dxbl-grid-top-panel > .dxbl-grid-search-box-container {
            width: 100% !important;
            padding: 5px !important;
            position: fixed;
            z-index: 99;
            top: -46px;
            right: 10px;
            max-width: 200px;
        }

        .page-heading {
            margin-top: 10px;
            margin-bottom: 5px;
        }





        .meal-planing {
            height: calc(100dvh - 81px) !important;
            position: absolute !important;
            left: 0px;
            width: 100vw;
            border-radius: 0px !important;
            box-shadow: 0px 0px 2px 2px #00000000 !important;
        }

        .dxbl-treeview-custom {
            height: calc(100dvh - 134px) !important;
            position: absolute !important;
            left: 0px;
            width: 100vw;
            border-radius: 0px !important;
        }

        .rep-with-chart {
            height: calc(100dvh - 180px) !important;
            position: fixed !important;
            background-color: #fff;
            overflow: scroll;
            left: 0px;
            right: 0px;
            padding-bottom: 0px !important;
            /* bottom: 106px; */
            border-radius: 0px !important;
        }

        .align-self-start {
            padding: 0rem !important;
            position: fixed !important;
            z-index: 1045 !important;
            bottom: 60px !important;
            right: 5px !important;
            border: none !important;
        }
        /*
        .combo-material-transfer {
            position: fixed;
            width: 53px;
            overflow: hidden;
            border-radius: 10px !important;
            padding-left: 5px !important;
            padding-right: 5px !important;
            padding-top: 2px !important;
            padding-bottom: 2px !important;
            height: 40px;
            background-color: rgb(255 147 0 / 55%) !important;
            top: 80px;
            left: -20px;
            opacity: 1;
            -webkit-backdrop-filter: blur(8px);
            z-index: 1045 !important;
            box-shadow: 0px 0px 6px 0px #3d3d3d70;
            transition: all .25s ease-in-out !important;
        }



            .combo-material-transfer:focus-within {
                position: fixed;
                max-width: 100vw !important;
                width: max-content !important;
                border-radius: 10px !important;
                padding-left: 5px !important;
                padding-right: 5px !important;
                padding-top: 2px !important;
                padding-bottom: 2px !important;
                background-color: #fff !important;
                top: 50px !important;
                left: 5px !important;
                opacity: 1;
                -webkit-backdrop-filter: blur(8px);
                z-index: 1045;
                transition: all .25s ease-in-out !important;
            }
            */

        /* показване на контроли в справките */
        /*
        

        .gear {
            background: #333333 !important;
            border-radius: 10px;
            width: 20% !important;
            font-size: 1rem;
            font-weight: 400;
            padding: 0.55rem 0.75rem;
            margin-left: 2px !important;
            margin-right: 2px !important;
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(10px);
            border: none !important;
            box-shadow: 0px 0px 6px 0px #3d3d3d70;
            min-width: 40px !important;
            font-size: 1.2rem !important;
            -webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
            animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        }

        .gear-clicked {
            opacity: 1 !important;
            padding: 8px;
            padding-left: 10px;
            padding-right: 10px;
            transform: rotate(150deg) !important;
            transition: all .25s ease-in-out !important;
            color: rgb(255 147 0) !important;
            background: #333333 !important;
            border-radius: 10px;
            font-size: 1.2rem !important;
            backdrop-filter: blur(10px) !important;
            -webkit-backdrop-filter: blur(10px) !important;
            -webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
            animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        }


        .combo-material-transfer {
            display: none;
        }

        .combo-material-transfer-expanded {
            display: flex;
            align-content: center;
            flex-direction: row;
            position: absolute;
            z-index: 1046;
            top: -35px;
            
            background-color: #fff;
            min-width: -webkit-fill-available;
            border-radius: 10px;
            padding: 10px;
            box-shadow: 0px 0px 20px 20px #0000009c;
            height: auto;
            -webkit-animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
            animation: fade-in-top .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
            
        }
        
            */


        /* показване на контроли в справките -край */
        /*
        .dxbl-grid-search-box-container {
            position: fixed !important;
            top: 25px !important;
            right: 10px;
            z-index: 1045 !important;
            opacity: 1;
            width: 32px !important;
            padding-left: 0px !important;
            padding-top: 0px !important;
            padding-bottom: 0px !important;
            padding-right: 0px !important;
            border-radius: 10px !important;
            background-color: rgb(255 147 0 / 0%) !important;
            box-shadow: 0px 0px 6px 0px #3d3d3d70;
            transition: all .25s ease-in-out !important;
        }

            .dxbl-grid-search-box-container:focus-within {
                position: fixed !important;
                top: 10px !important;
                right: 10px;
                z-index: 1045 !important;
                opacity: 1;
                width: 35vw !important;
                max-width: 100vw !important;
                background-color: rgb(255 147 0 / 0%) !important;
                transition: all .25s ease-in-out !important;
            }


            */



        @media screen and (max-width: 992px) {
            .dx-blazor-widget .dx-chart-with-legend-container {
                padding-bottom: 0px !important;
            }
        }
    }


    /* pulsate-bck */
    @-webkit-keyframes pulsate-bck {
        0% {
            -webkit-transform: scale(1);
            transform: scale(1);
        }

        50% {
            -webkit-transform: scale(0.9);
            transform: scale(0.9);
        }

        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
        }
    }

    @keyframes pulsate-bck {
        0% {
            -webkit-transform: scale(1);
            transform: scale(1);
        }

        50% {
            -webkit-transform: scale(0.9);
            transform: scale(0.9);
        }

        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
        }
    }
    /* pulsate-bck - край */
    .card {
        position: relative;
        z-index: 1040 !important;
    }

    .locked-show {
        position: absolute;
        z-index: 1;
        height: 100dvh;
        width: 100vw;
        left: 0px;
        right: 0px;
        top: 0px;
        background-color: #1e262b;
        display: flex;
        align-content: center;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

.image-locked {
    width: 70px !important;
    height: 70px !important;
    margin-bottom: 20px;
    /*-webkit-animation: fade-in-top 1s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;
        animation: fade-in-top 1s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0s both;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.no-access {
    max-width: 300px;
    font-family: Gilroy !important;
    font-size: 1.5rem !important;
    /* -webkit-animation: fade-in-fwd 1.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) .5s both !important;
        animation: fade-in-fwd 1.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) .5s both !important;*/
    -webkit-animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-fwd-center 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

    .home-redirect {
        padding: 5px !important;
        margin-top: 10px !important;
        width: 120px !important;
        color: #fff !important;
        font-size: 1rem;
        -webkit-animation: fade-in-bottom .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) .5s both;
        animation: fade-in-bottom .5s cubic-bezier(0.680, -0.550, 0.265, 1.550) .5s both;
    }

        .home-redirect:hover {
            border-color: #ff8000 !important;
            background-color: #ff8000 !important;
        }

            .home-redirect:hover .home-icon {
                transform: scale(1.3) !important;
                transition: all .15s ease-in-out !important;
            }

    #home-redirect .dxbl-image:not(svg) {
        color: #fff !important;
    }


    /* цвят на иконата за справките в менюто */
    /*#rep-icon .dxbl-image:not(svg) {
        color: rgb(202 255 0) !important;
    }*/
    /* цвят на иконата за справките в менюто - край */

    /* ховър на бутоните на началния екран */
    @-webkit-keyframes pencil {
        0% {
            -webkit-transform: rotate(-25deg);
        }

        40% {
            -webkit-transform: rotate(0deg);
        }

        50% {
            -webkit-transform: rotateZ(10deg);
        }

        60% {
            -webkit-transform: rotateZ(0deg);
        }

        70% {
            -webkit-transform: rotateZ(10deg);
        }

        80% {
            -webkit-transform: rotateZ(0deg);
        }

        90% {
            -webkit-transform: rotateZ(10deg);
        }

        100% {
            -webkit-transform: rotateZ(-25deg);
        }
    }

    @-webkit-keyframes box {
        0% {
            opacity: 0;
            -webkit-transform: translate(20px, -20px);
        }

        100% {
            opacity: 1;
            -webkit-transform: translate(0px, 0px);
        }
    }

    @-webkit-keyframes document-flip {
        0% {
            -webkit-transform: rotateX(70deg);
            transform: rotateX(70deg);
            -webkit-transform-origin: top;
            transform-origin: top;
        }

        100% {
            -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
            -webkit-transform-origin: top;
            transform-origin: top;
        }
    }

    @keyframes document-flip {
        0% {
            -webkit-transform: rotateX(70deg);
            transform: rotateX(70deg);
            -webkit-transform-origin: top;
            transform-origin: top;
        }

        100% {
            -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
            -webkit-transform-origin: top;
            transform-origin: top;
        }
    }

    @-webkit-keyframes scale-in-bl {
        0% {
            -webkit-transform: scale(0);
            transform: scale(0);
            -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
            opacity: 1;
        }

        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
            -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
            opacity: 1;
        }
    }

    @-webkit-keyframes scale-in-ver-bottom {
        0% {
            -webkit-transform: scaleY(0);
            transform: scaleY(0);
            -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
            opacity: 1;
        }

        100% {
            -webkit-transform: scaleY(1);
            transform: scaleY(1);
            -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
            opacity: 1;
        }
    }

    @keyframes scale-in-ver-bottom {
        0% {
            -webkit-transform: scaleY(0);
            transform: scaleY(0);
            -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
            opacity: 1;
        }

        100% {
            -webkit-transform: scaleY(1);
            transform: scaleY(1);
            -webkit-transform-origin: 0% 100%;
            transform-origin: 0% 100%;
            opacity: 1;
        }
    }

    @-webkit-keyframes waste {
        0% {
            -webkit-transform: translateZ(-1400px);
            transform: translateZ(-1400px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateZ(0);
            transform: translateZ(0);
            opacity: 1;
        }
    }

    @keyframes waste {
        0% {
            -webkit-transform: translateZ(-1400px);
            transform: translateZ(-1400px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateZ(0);
            transform: translateZ(0);
            opacity: 1;
        }
    }

    @-webkit-keyframes fade-in-left {
        0% {
            -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
        }
    }

    @keyframes fade-in-left {
        0% {
            -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
            opacity: 0;
        }

        100% {
            -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
        }
    }

    @-webkit-keyframes transfer {
        0% {
            -webkit-transform: rotateX(0rad);
        }

        100% {
            -webkit-transform: rotateX(3.142rad);
        }
    }

    @media screen and (min-width: 992px) {
        .inventory-icon {
            display: none;
        }

        .button-bg:hover .inventory-icon {
            display: unset;
            position: absolute;
            right: 130px;
            top: 40px;
            font-size: 1.8rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            animation: pencil 1.5s forwards infinite;
            -webkit-animation: pencil 1.5s forwards infinite;
        }

        .delivery-icon {
            display: none;
        }

        .button-bg:hover .delivery-icon {
            display: unset;
            position: absolute;
            left: 130px;
            bottom: 80px;
            font-size: 1.8rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            animation: box .5s forwards;
            -webkit-animation: box .5s forwards;
        }

        .mealplanning-icon {
            display: none;
        }

        .button-bg:hover .mealplanning-icon {
            display: unset;
            position: absolute;
            right: 130px;
            bottom: 80px;
            font-size: 1.8rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            -webkit-animation: waste 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            animation: waste 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }

        .expenses-icon {
            display: none !important;
        }



        .button-bg:hover .expenses-icon {
            display: unset !important;
            position: absolute;
            right: 130px;
            bottom: 80px;
            font-size: 1.8rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            -webkit-animation: waste 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            animation: waste 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }

        .waste-icon {
            display: none;
        }

        .button-bg:hover .waste-icon {
            display: unset;
            position: absolute;
            right: 130px;
            bottom: 120px;
            font-size: 1.8rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            -webkit-animation: waste 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            animation: waste 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }

        .request-icon {
            display: none;
        }

        .button-bg:hover .request-icon {
            display: unset;
            position: absolute;
            right: 130px;
            bottom: 120px;
            font-size: 1.8rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            animation: document-flip .5s forwards;
            -webkit-animation: document-flip .5s forwards;
        }

        .signout-icon {
            display: none;
        }

        .button-bg:hover .signout-icon {
            display: unset;
            position: absolute;
            position: absolute;
            top: 41px;
            font-size: 2.3rem !important;
            display: flex;
            justify-content: center;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            -webkit-animation: scale-in-ver-bottom 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            animation: scale-in-ver-bottom 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }

        .materialtransfer-icon {
            display: none;
        }

        .button-bg:hover .materialtransfer-icon {
            display: unset;
            position: absolute;
            left: 180px;
            bottom: 115px;
            font-size: 2.3rem !important;
            color: #fff !important;
            text-shadow: 0px 0px 10px #000;
            -webkit-animation: transfer .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
            animation: transfer .5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
        }
    }

    @media screen and (max-width: 992px) {
        .inventory-icon {
            display: none !important;
        }

        .delivery-icon {
            display: none !important;
        }

        .request-icon {
            display: none !important;
        }

        .waste-icon {
            display: none !important;
        }

        .mealplanning-icon {
            display: none !important;
        }

        .materialtransfer-icon {
            display: none !important;
        }

        .signout-icon {
            display: none !important;
        }

        .expenses-icon {
            display: none !important;
        }
    }

    .rep {
        position: absolute;
        bottom: 10px;
        right: 15px;
        font-size: 2rem;
    }

    @media screen and (min-width: 992px) {
        .reports:hover .main-button span {
            color: #ff8000 !important;
        }

        .reports:hover .rep {
            display: none !important;
        }
    }

    /* ховър на бутоните за справки */
    @-webkit-keyframes bar1 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 100px;
            opacity: 1;
        }
    }

    @keyframes bar1 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 50px;
            opacity: 1;
        }
    }

    @-webkit-keyframes bar2 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 100px;
            opacity: 1;
        }
    }

    @keyframes bar2 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 70px;
            opacity: 1;
        }
    }

    @-webkit-keyframes bar3 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 30px;
            opacity: 1;
        }
    }

    @keyframes bar3 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 30px;
            opacity: 1;
        }
    }

    @-webkit-keyframes bar4 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 30px;
            opacity: 1;
        }
    }

    @keyframes bar4 {
        0% {
            height: 0px;
            opacity: 0;
        }

        100% {
            height: 90px;
            opacity: 1;
        }
    }


    @-webkit-keyframes bar4-rev {
        0% {
            height: 90px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @keyframes bar4-rev {
        0% {
            height: 90px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @-webkit-keyframes bar3-rev {
        0% {
            height: 30px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @keyframes bar3-rev {
        0% {
            height: 30px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @-webkit-keyframes bar2-rev {
        0% {
            height: 70px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @keyframes bar2-rev {
        0% {
            height: 70px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @-webkit-keyframes bar1-rev {
        0% {
            height: 50px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @keyframes bar1-rev {
        0% {
            height: 50px;
            opacity: 1;
        }

        100% {
            height: 0px;
            opacity: 0;
        }
    }

    @-webkit-keyframes pdf {
        0% {
            bottom: 0px;
            opacity: 0;
            transform: scale(1);
            color: #ff8000 !important;
        }

        100% {
            bottom: 50px;
            opacity: 1;
            transform: scale(1.8);
            color: #ff8000 !important;
        }
    }

    @keyframes pdf {
        0% {
            bottom: 0px;
            opacity: 0;
            transform: scale(1);
            color: #ff8000 !important;
        }

        100% {
            bottom: 50px;
            opacity: 1;
            transform: scale(1.8);
            color: #ff8000 !important;
        }
    }

    @-webkit-keyframes pdf-rev {
        0% {
            bottom: 50px;
            opacity: 1;
            transform: scale(1.8);
            color: #ff8000 !important;
        }

        100% {
            bottom: 0px;
            opacity: 0;
            transform: scale(1);
            color: #ff8000 !important;
        }
    }

    @keyframes pdf-rev {
        0% {
            bottom: 50px;
            opacity: 1;
            transform: scale(1.8);
            color: #ff8000 !important;
        }

        100% {
            bottom: 0px;
            opacity: 0;
            font-size: 4rem !important;
            color: #ff8000 !important;
        }
    }

    .file {
        font-size: 1.7rem !important;
        bottom: 15px !important;
    }

    .pdf {
        position: absolute;
        z-index: 0;
        bottom: -100px;
        color: #ff8000 !important;
    }

    .bar1 {
        position: absolute;
        z-index: 0;
        bottom: 0px;
        left: calc(50% - 45px) !important;
        height: 0px;
        width: 20px;
        border-radius: 5px 5px 0px 0px;
        background: linear-gradient(180deg, #ff8000, transparent) !important;
        bottom: 10px;
    }

    .bar2 {
        position: absolute;
        z-index: 0;
        bottom: 0px;
        left: calc(50% - 20px) !important;
        height: 0px;
        width: 20px;
        border-radius: 5px 5px 0px 0px;
        background: linear-gradient(180deg, #ff8000, transparent) !important;
        bottom: 10px;
    }

    .bar3 {
        position: absolute;
        z-index: 0;
        bottom: 0px;
        left: calc(50% + 5px) !important;
        height: 0px;
        width: 20px;
        border-radius: 5px 5px 0px 0px;
        background: linear-gradient(180deg, #ff8000, transparent) !important;
        bottom: 7px;
    }

    .bar4 {
        position: absolute;
        z-index: 0;
        bottom: 0px;
        left: calc(50% + 30px) !important;
        height: 0px;
        width: 20px;
        border-radius: 5px 5px 0px 0px;
        background: linear-gradient(180deg, #ff8000, transparent) !important;
        bottom: 10px;
    }

    .button-bg:hover .bar1 {
        -webkit-animation: bar1 0.3s linear 0s both;
        animation: bar1 0.3s linear 0s both;
    }

    .button-bg:hover .bar2 {
        -webkit-animation: bar2 0.3s linear 0.1s both;
        animation: bar2 0.3s linear 0.1s both;
    }

    .button-bg:hover .bar3 {
        -webkit-animation: bar3 0.3s linear 0.2s both;
        animation: bar3 0.3s linear 0.2s both;
    }

    .button-bg:hover .bar4 {
        -webkit-animation: bar4 0.3s linear 0.3s both;
        animation: bar4 0.3s linear 0.3s both;
    }

    .button-bg:hover .pdf {
        -webkit-animation: pdf 0.3s linear 0s both;
        animation: pdf 0.3s linear 0s both;
    }



    .button-bg:not(:hover) .bar1 {
        -webkit-animation: bar1-rev 0.2s linear both;
        animation: bar1-rev 0.2s linear both;
    }

    .button-bg:not(:hover) .bar2 {
        -webkit-animation: bar2-rev 0.2s linear both;
        animation: bar2-rev 0.2s linear both;
    }

    .button-bg:not(:hover) .bar3 {
        -webkit-animation: bar3-rev 0.2s linear both;
        animation: bar3-rev 0.2s linear both;
    }

    .button-bg:not(:hover) .bar4 {
        -webkit-animation: bar4-rev 0.2s linear both;
        animation: bar4-rev 0.2s linear both;
    }



    .button-bg:not(:hover) .pdf {
        -webkit-animation: pdf-rev 0.2s linear both;
        animation: pdf-rev 0.2s linear both;
    }


    @media screen and (max-width: 992px) {
        .bar1, .bar2, .bar3, .bar4, .pdf {
            display: none !important;
        }
    }




    /* ховър на бутоните за справки - край */

    /* ховър на бутоните на началния екран - край */


    @media screen and (max-width: 992px) {
        .dxbl-grid-filter-menu-funnel-btn {
            display: none !important;
        }
    }









    @media screen and (min-width: 992px) {
        .rep-settings {
            display: none;
        }

        .rep-settings-escape {
            display: none;
        }
    }


    @media screen and (max-width: 992px) {
        @-webkit-keyframes slide-in-right {
            0% {
                -webkit-transform: translateX(1000px);
                transform: translateX(1000px);
                opacity: 0;
            }

            100% {
                -webkit-transform: translateX(0);
                transform: translateX(0);
                opacity: 1;
            }
        }

        @keyframes slide-in-right {
            0% {
                -webkit-transform: translateX(1000px);
                transform: translateX(1000px);
                opacity: 0;
            }

            100% {
                -webkit-transform: translateX(0);
                transform: translateX(0);
                opacity: 1;
            }
        }


        @-webkit-keyframes shadow {
            0% {
                box-shadow: 0px 0px 30px 6px #fff0;
            }

            100% {
                box-shadow: 0px 0px 20px 2000px #0000006b;
            }
        }

        @keyframes shadow {
            0% {
                box-shadow: 0px 0px 30px 6px #fff0;
            }

            100% {
                box-shadow: 0px 0px 20px 2000px #0000006b;
            }
        }

        .rep-settings {
            position: fixed;
            z-index: 1046;
            right: -25px;
            top: 50vh;
            padding: 5px;
            display: flex;
            background-color: #fff;
            border-style: none;
            border-radius: 30px 0px 0px 30px;
            box-shadow: 0px 0px 7px 0px #00000066;
            justify-content: center;
            align-items: center;
            align-content: center !important;
            transition: all .25s ease-in-out !important;
            height: 55px;
            width: 55px;
            margin-left: calc(50vw - 35px);
            padding: 5px;
            display: flex;
            background-color: rgb(255 147 0 / 0%);
            backdrop-filter: blur(1px);
            -webkit-backdrop-filter: blur(1px);
        }
            /* извивки на бутон настройки */
            /*.rep-settings::before {
                z-index: 1046;
                content: "";
                position: absolute;
                top: 55px;
                height: 18px;
                left: 16px;
                width: 40px;
                border-top-right-radius: 30px;
                border-top-left-radius: 30px;
                border-bottom-left-radius: 0px;
                border-bottom-right-radius: 0px;
                box-shadow: 12px -2px 0 0 #ffffff;
            }

            .rep-settings::after {
                z-index: 1046;
                content: "";
                position: absolute;
                top: -17px;
                height: 17px;
                left: 16px;
                width: 40px;
                border-top-right-radius: 0px;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 30px;
                border-bottom-right-radius: 30px;
                box-shadow: 20px 5px 0 0 #ffffff;
            }*/

        .rep-settings-escape {
            display: none;
        }

        .rep-settings-escape-show {
            display: unset;
            position: fixed;
            top: 0px;
            bottom: 0px;
            left: 0px;
            right: 0px;
            z-index: 1045;
            background-color: #00000045;
            border-style: none;
        }
        /* извивки на бутон настройки  край */

        .rep-settings-shadow {
            background-color: #fff;
            z-index: 1046;
            right: 0px;
            -webkit-animation: shadow 1.8s 1 both;
            animation: shadow 1.8s 1 both;
        }

        .gear-icon {
            /*color: rgb(255 147 0 / 66%);
            font-size: 2rem !important;
            line-height: 2rem !important;
            padding-top: 3px;
            transition: all .55s ease-in-out !important;*/
            font-size: 2rem !important;
            line-height: 2rem !important;
            margin-left: -15px;
            transition: all .3s ease-in-out !important;
        }

        .gear-icon-pressed {
            color: #ff8000 !important;
            font-size: 2rem !important;
            line-height: 2rem !important;
            margin-left: 2px;
            transform: rotate(180deg);
            transition: all .3s ease-in-out !important;
        }

        .div-checkboxes-show {
            position: fixed;
            z-index: 1049;
            display: flex;
            align-items: center;
            top: 20px;
            left: 15px;
            background: #fff !important;
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(10px);
            border: none !important;
            box-shadow: 0px 0px 13px 0px #000000eb;
            border-radius: 10px;
            padding: 2px;
            padding-left: 10px;
            padding-right: 10px;
            height: 60px !important;
            transition: all .25s ease-in-out !important;
        }

        .fab-container {
            display: none;
        }

        .fab-container-show {
            display: unset;
            padding: 0.5rem !important;
            position: fixed !important;
            z-index: 1049 !important;
            bottom: 60px !important;
            right: 0px !important;
            border: none !important;
        }
    }

    @media screen and (max-width: 992px) {
        .grid-btn-new {
            position: fixed !important;
            bottom: 15px !important;
            background-color: #333333 !important;
            box-shadow: 0px 0px 8px #0000006b !important;
            width: 45px !important;
            height: 45px !important;
            border-radius: 100% !important;
            padding-bottom: 5px !important;
            /*left: calc(50vw - 30px) !important;*/
            right: 10px !important;
            transition: all .25s ease-in-out !important;
        }

        .grid-btn-new-hide {
            display: none !important;
            transition: all .25s ease-in-out !important;
        }
    }

    .more-reps-text {
        color: #fff;
        font-size: .9rem;
        line-height: .9rem;
    }

    .morereps-button {
        display: flex;
        position: relative;
        width: 80px;
        top: 150px;
        left: calc(50vw - 48px);
        color: #fff;
        font-size: 2rem;
        line-height: 2rem;
        z-index: 99 !important;
        border: none;
        background-color: transparent;
        transition: all .25s ease-in-out !important;
        align-items: center;
        flex-direction: column;
        -webkit-animation: fade-in .5s ease-out 1.3s both;
        animation: fade-in .5s ease-out 1.3s both;
    }



    @media screen and (min-width: 992px) {
        .morereps-button {
            top: 85px;
            left: 50%;
            transform: translateX(-50%);
        }
    }

    @media screen and (max-width: 992px) and (min-width: 576px) {
        .morereps-button {
            top: 85px;
            left: 50%;
            transform: translateX(-50%);
        }
    }

    @media screen and (max-width: 576px) {
        .morereps-button {
            top: 85px;
            left: 50%;
            transform: translateX(-50%);
        }
    }





    .arrow-more:hover {
        transform: scale(1.2);
        transition: all .25s ease-in-out !important;
    }

    .report-buttons-expand {
        height: auto;
        padding-bottom: 100px;
        transition: all .55s ease-in-out !important;
    }

    .less {
        display: none;
    }

    .more {
        -webkit-animation: fade-in .5s ease-out both;
        animation: fade-in .5s ease-out .2s both;
    }

    .more-visible {
        display: unset;
        -webkit-animation: fade-in .5s ease-out both;
        animation: fade-in .5s ease-out .2s both;
    }

    .more-hidden {
        display: none;
    }

    .less-visible {
        display: unset;
        -webkit-animation: fade-in .5s ease-out both;
        animation: fade-in .5s ease-out .2s both;
    }


    .morereps-button-rotate {
        transform: rotate(180deg) !important;
        transition: all .55s ease-in-out !important;
    }

    @media screen and (min-width: 992px) {
        .labels-totals {
            padding: 10px;
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
            align-items: flex-end;
            flex-wrap: wrap;
            font-family: 'Gilroy-Bold';
        }
    }

    @media screen and (max-width: 992px) {
        .labels-totals {
            /* padding-top: 10px; */
            padding-bottom: 10px;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            align-items: flex-end;
            font-family: 'Gilroy-Bold';
            background-color: #fff !important;
            margin-top: 10px;
            position: relative;
        }
    }

    @media screen and (min-width: 992px) {
        .total {
            margin-right: 5px;
            width: 13.78%;
        }
    }

    @media screen and (max-width: 992px) {
        .total {
            margin-right: 5px;
            width: 31.692%;
        }
    }

    .pdf-small {
        font-size: .95rem !important;
    }



    /* loading panel */
    .dxbl-loading-panel .dxbl-loading-panel-container .dxbl-loading-panel-indicator-area {
        -webkit-box-shadow: -1px -1px 11px #21252933 !important;
        box-shadow: -1px -1px 11px #21252933 !important;
        background: #fff !important;
        border-radius: 100% !important;
        width: 44px !important;
        height: 44px !important;
    }

    .dxbl-wait-indicator {
        --dxbl-wait-indicator-color: #ff8000 !important;
    }
    /* loading panel - край */



    .dxbl-list-box, .dxbl-list-box-render-container {
        --dxbl-list-box-border-color: none !important;
        max-height: 30dvh !important;
    }


    .dxbl-a11y-status-helper {
        display: none !important;
    }

    .partner-tree-row {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* само за партньорите */
    @media (orientation: landscape) and (max-width: 992px) {

        .partners-tree {
            max-height: calc(100dvh - 130px) !important;
        }
    }

    @media (orientation: portrait) and (max-width: 992px) {
        .partners-tree {
            max-height: calc(100dvh - 170px) !important
        }
    }
    /* само за партньорите */

    .dxbl-list-box {
        height: max-content !important;
    }


    #red-icon .dxbl-image:not(svg) {
        color: #dc3545 !important;
    }