/*!
 * OverlayScrollbars
 * https://github.com/KingSora/OverlayScrollbars
 *
 * Version: 1.13.0
 *
 * Copyright KingSora | Rene Haas.
 * https://github.com/KingSora
 *
 * Released under the MIT license.
 * Date: 02.08.2020
 */

/*
OVERLAY SCROLLBARS CORE:
*/

html.os-html,
html.os-html > .os-host {
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    height: 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    position: absolute !important; /* could be position: fixed; but it causes issues on iOS (-webkit-overflow-scrolling: touch) */
}
html.os-html > .os-host > .os-padding {
    position: absolute; /* could be position: fixed; but it causes issues on iOS (-webkit-overflow-scrolling: touch) */
}
body.os-dragging,
body.os-dragging * {
    cursor: default;
}
.os-host,
.os-host-textarea {
    position: relative;
    overflow: visible !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -ms-flex-line-pack: start;
        align-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
                -ms-grid-row-align: flex-start;
            align-items: flex-start;
}
.os-host-flexbox {
    overflow: hidden !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.os-host-flexbox > .os-size-auto-observer {
    height: inherit !important;
}
.os-host-flexbox > .os-content-glue {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}
.os-host-flexbox > .os-size-auto-observer,
.os-host-flexbox > .os-content-glue {
    min-height: 0;
    min-width: 0;
    -webkit-box-flex: 0;
        -ms-flex-positive: 0;
            flex-grow: 0;
    -ms-flex-negative: 1;
        flex-shrink: 1;
    -ms-flex-preferred-size: auto;
        flex-basis: auto;
}
#os-dummy-scrollbar-size {
    position: fixed;
    opacity: 0;
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';
    visibility: hidden;
    overflow: scroll;
    height: 500px;
    width: 500px;
}
#os-dummy-scrollbar-size > div {
    width: 200%;
    height: 200%; 
    margin: 10px 0;
}
/* fix restricted measuring */
#os-dummy-scrollbar-size:before,
#os-dummy-scrollbar-size:after,
.os-content:before,
.os-content:after {
    content: '';
    display: table;
    width: 0.01px;
    height: 0.01px;
    line-height: 0;
    font-size: 0;
    flex-grow: 0;
    flex-shrink: 0;
    visibility: hidden;
}
#os-dummy-scrollbar-size,
.os-viewport {
    -ms-overflow-style: scrollbar !important;
}
.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size,
.os-viewport-native-scrollbars-invisible.os-viewport {
    scrollbar-width: none !important;
}
.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size::-webkit-scrollbar,
.os-viewport-native-scrollbars-invisible.os-viewport::-webkit-scrollbar,
.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size::-webkit-scrollbar-corner,
.os-viewport-native-scrollbars-invisible.os-viewport::-webkit-scrollbar-corner {
    display: none !important;
    width: 0px !important;
    height: 0px !important;
    visibility: hidden !important;
    background: transparent !important;
}
.os-content-glue {
    box-sizing: inherit;
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    pointer-events: none;
}
.os-padding {
    box-sizing: inherit;
    direction: inherit;
    position: absolute;
    overflow: visible;
    padding: 0;
    margin: 0;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: auto !important;
    height: auto !important;
	z-index: 0;
}
.os-host-overflow > .os-padding {
    overflow: hidden;
}
.os-viewport {
    direction: inherit !important;
    box-sizing: inherit !important;
    resize: none !important;
    outline: none !important;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 0;
    margin: 0;
    -webkit-overflow-scrolling: touch;
}
.os-content-arrange {
    position: absolute;
    z-index: -1;
    min-height: 1px;
    min-width: 1px;
    pointer-events: none;
}
.os-content {
    direction: inherit;
    box-sizing: border-box !important;
    position: relative;
    display: block;
    height: 100%;
    width: 100%;
    height: 100%;
    width: 100%;
    visibility: visible;
}
.os-content > .os-textarea {
    box-sizing: border-box !important;
    direction: inherit !important;
    background: transparent !important;
    outline: 0px none transparent !important;
    overflow: hidden !important;
    position: absolute !important;
    display: block !important;
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    border-radius: 0px !important;
    float: none !important;
    -webkit-filter: none !important;
            filter: none !important;
    border: none !important;
    resize: none !important;
    -webkit-transform: none !important;
            transform: none !important;
    max-width: none !important;
    max-height: none !important;
    box-shadow: none !important;
    -webkit-perspective: none !important;
            perspective: none !important;
    opacity: 1 !important;
    z-index: 1 !important;
    clip: auto !important;
    vertical-align: baseline !important;
    padding: 0px;
}
.os-host-rtl > .os-padding > .os-viewport > .os-content > .os-textarea {
    right: 0 !important;
}
.os-content > .os-textarea-cover {
    z-index: -1;
    pointer-events: none;
}
.os-content > .os-textarea[wrap='off'] {
    white-space: pre !important;
    margin: 0px !important;
}
.os-text-inherit {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    font-variant: inherit;
    text-transform: inherit;
    text-decoration: inherit;
    text-indent: inherit;
    text-align: inherit;
    text-shadow: inherit;
    text-overflow: inherit;
    letter-spacing: inherit;
    word-spacing: inherit;
    line-height: inherit;
    unicode-bidi: inherit;
    direction: inherit;
    color: inherit;
    cursor: text;
}
.os-resize-observer,
.os-resize-observer-host {
    box-sizing: inherit;
    display: block;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: -1;
}
.os-resize-observer-host {
    padding: inherit;
    border: inherit;
    border-color: transparent;
    border-style: solid;
    box-sizing: border-box;
}
.os-resize-observer-host.observed {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.os-resize-observer-host > .os-resize-observer,
.os-resize-observer-host.observed > .os-resize-observer {
    height: 200%;
    width: 200%;
    padding: inherit;
    border: inherit;
    margin: 0;
    display: block;
    box-sizing: content-box;
}
.os-resize-observer-host.observed > .os-resize-observer,
.os-resize-observer-host.observed > .os-resize-observer:before {
    display: flex;
    position: relative;
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: auto;
    box-sizing: border-box;
}
.os-resize-observer-host.observed > .os-resize-observer:before {
    content: '';
    box-sizing: content-box;
    padding: inherit;
    border: inherit;
    margin: 0;
}
.os-size-auto-observer {
    box-sizing: inherit !important;
    height: 100%;
    width: inherit;
    max-width: 1px;
    position: relative;
    float: left;
    max-height: 1px;
    overflow: hidden;
    z-index: -1;
    padding: 0;
    margin: 0;
    pointer-events: none;
    -webkit-box-flex: inherit;
        -ms-flex-positive: inherit;
            flex-grow: inherit;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
}
.os-size-auto-observer > .os-resize-observer {
    width: 1000%;
    height: 1000%;
    min-height: 1px;
    min-width: 1px;
}
.os-resize-observer-item {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: -1;
    opacity: 0;
    direction: ltr !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: none !important;
    flex: none !important;
}
.os-resize-observer-item-final {
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: none !important;
    transition: none !important;
    -webkit-box-flex: 0 !important;
    -ms-flex: none !important;
    flex: none !important;
}
.os-resize-observer {
    -webkit-animation-duration: 0.001s;
    animation-duration: 0.001s;
    -webkit-animation-name: os-resize-observer-dummy-animation;
    animation-name: os-resize-observer-dummy-animation;
}
object.os-resize-observer {
    box-sizing: border-box !important;
}
@-webkit-keyframes os-resize-observer-dummy-animation {
    from {
        z-index: 0;
    }
    to {
        z-index: -1;
    }
}
@keyframes os-resize-observer-dummy-animation {
    from {
        z-index: 0;
    }
    to {
        z-index: -1;
    }
}

/*
CUSTOM SCROLLBARS AND CORNER CORE:
*/

.os-host-transition > .os-scrollbar,
.os-host-transition > .os-scrollbar-corner {
    -webkit-transition: opacity 0.3s, visibility 0.3s, top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
    transition: opacity 0.3s, visibility 0.3s, top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
}
html.os-html > .os-host > .os-scrollbar {
    position: absolute; /* could be position: fixed; but it causes issues on iOS (-webkit-overflow-scrolling: touch) */
    z-index: 999999; /* highest z-index of the page */
}
.os-scrollbar,
.os-scrollbar-corner {
    position: absolute;
    opacity: 1;
    -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';
    z-index: 1;
}
.os-scrollbar-corner {
    bottom: 0;
    right: 0;
}
.os-scrollbar {
    pointer-events: none;
}
.os-scrollbar-track {
    pointer-events: auto;
    position: relative;
    height: 100%;
    width: 100%;
    padding: 0 !important;
    border: none !important;
}
.os-scrollbar-handle {
    pointer-events: auto;
    position: absolute;
    width: 100%;
    height: 100%;
}
.os-scrollbar-handle-off,
.os-scrollbar-track-off {
    pointer-events: none;
}
.os-scrollbar.os-scrollbar-unusable,
.os-scrollbar.os-scrollbar-unusable * {
    pointer-events: none !important;
}
.os-scrollbar.os-scrollbar-unusable .os-scrollbar-handle {
    opacity: 0 !important;
}
.os-scrollbar-horizontal {
    bottom: 0;
    left: 0;
}
.os-scrollbar-vertical {
    top: 0;
    right: 0;
}
.os-host-rtl > .os-scrollbar-horizontal {
    right: 0;
}
.os-host-rtl > .os-scrollbar-vertical {
    right: auto;
    left: 0;
}
.os-host-rtl > .os-scrollbar-corner {
    right: auto;
    left: 0;
}
.os-scrollbar-auto-hidden,
.os-padding + .os-scrollbar-corner,
.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-corner,
.os-host-scrollbar-horizontal-hidden > .os-scrollbar-horizontal,
.os-host-resize-disabled.os-host-scrollbar-vertical-hidden > .os-scrollbar-corner,
.os-host-scrollbar-vertical-hidden > .os-scrollbar-vertical,
.os-scrollbar-horizontal.os-scrollbar-auto-hidden + .os-scrollbar-vertical + .os-scrollbar-corner,
.os-scrollbar-horizontal + .os-scrollbar-vertical.os-scrollbar-auto-hidden + .os-scrollbar-corner,
.os-scrollbar-horizontal.os-scrollbar-auto-hidden + .os-scrollbar-vertical.os-scrollbar-auto-hidden + .os-scrollbar-corner {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.os-scrollbar-corner-resize-both {
    cursor: nwse-resize;
}
.os-host-rtl > .os-scrollbar-corner-resize-both {
    cursor: nesw-resize;
}
.os-scrollbar-corner-resize-horizontal {
    cursor: ew-resize;
}
.os-scrollbar-corner-resize-vertical {
    cursor: ns-resize;
}
.os-dragging .os-scrollbar-corner.os-scrollbar-corner-resize {
    cursor: default;
}
.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden > .os-scrollbar-vertical {
    top: 0;
    bottom: 0;
}
.os-host-resize-disabled.os-host-scrollbar-vertical-hidden > .os-scrollbar-horizontal,
.os-host-rtl.os-host-resize-disabled.os-host-scrollbar-vertical-hidden > .os-scrollbar-horizontal {
    right: 0;
    left: 0;
}
.os-scrollbar:hover,
.os-scrollbar-corner.os-scrollbar-corner-resize {
    opacity: 1 !important;
    visibility: visible !important;
}
.os-scrollbar-corner.os-scrollbar-corner-resize {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgICB3aWR0aD0iMTAiICAgaGVpZ2h0PSIxMCIgICB2ZXJzaW9uPSIxLjEiPiAgPGcgICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwNDIuMzYyMikiICAgICBzdHlsZT0iZGlzcGxheTppbmxpbmUiPiAgICA8cGF0aCAgICAgICBzdHlsZT0iZmlsbDojMDAwMDAwO2ZpbGwtb3BhY2l0eTowLjQ5NDExNzY1O2ZpbGwtcnVsZTpldmVub2RkO3N0cm9rZTpub25lIiAgICAgICBkPSJtIDcuNDI0MjE4NywxMDQyLjM2MjIgYyAtMC43MjM1NzkyLDAgLTEuMzEwMTU2MiwwLjU4NjYgLTEuMzEwMTU2MiwxLjMxMDIgMCwwLjI5OSAwLjEwNDM0MTksMC41NzEgMC4yNzI5NDkyLDAuNzkxNSAwLjIwOTEwMjQsMC4xNDEzIDAuNDY1NjIwNiwwLjIxODQgMC43MzY5NjI5LDAuMjE4NCAwLjcyMzU3OTMsMCAxLjMxMDE1NjMsLTAuNTg2NiAxLjMxMDE1NjMsLTEuMzEwMiAwLC0wLjI3MTMgLTAuMDc3MDkzLC0wLjUyNzggLTAuMjE4MzU5NCwtMC43MzcgLTAuMjIwNDk0MSwtMC4xNjg2IC0wLjQ5MjU0NDMsLTAuMjcyOSAtMC43OTE1NTI4LC0wLjI3MjkgeiBtIDAsMy4wODQzIGMgLTAuNzIzNTc5MiwwIC0xLjMxMDE1NjIsMC41ODY2IC0xLjMxMDE1NjIsMS4zMTAyIDAsMC4yOTkgMC4xMDQzNDE5LDAuNTcxIDAuMjcyOTQ5MiwwLjc5MTUgMC4yMDkxMDI0LDAuMTQxMyAwLjQ2NTYyMDYsMC4yMTg0IDAuNzM2OTYyOSwwLjIxODQgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjYgMS4zMTAxNTYzLC0xLjMxMDIgMCwtMC4yNzEzIC0wLjA3NzA5MywtMC41Mjc4IC0wLjIxODM1OTQsLTAuNzM2OSAtMC4yMjA0OTQxLC0wLjE2ODYgLTAuNDkyNTQ0MywtMC4yNzMgLTAuNzkxNTUyOCwtMC4yNzMgeiBtIC0zLjA4NDMyNjEsMCBjIC0wLjcyMzU3OTMsMCAtMS4zMTAxNTYzLDAuNTg2NiAtMS4zMTAxNTYzLDEuMzEwMiAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MSAwLjI3Mjk0OTIsMC43OTE1IDAuMjA5MTAyNCwwLjE0MTMgMC40NjU2MjA3LDAuMjE4NCAwLjczNjk2MjksMC4yMTg0IDAuNzIzNTc5MywwIDEuMzEwMTU2MywtMC41ODY2IDEuMzEwMTU2MywtMS4zMTAyIDAsLTAuMjcxMyAtMC4wNzcwOTMsLTAuNTI3OCAtMC4yMTgzNTk0LC0wLjczNjkgLTAuMjIwNDk0LC0wLjE2ODYgLTAuNDkyNTQ0MiwtMC4yNzMgLTAuNzkxNTUyNywtMC4yNzMgeiBtIC0zLjAyOTczNjQsMy4wMjk4IEMgMC41ODY1NzY5MywxMDQ4LjQ3NjMgMCwxMDQ5LjA2MjggMCwxMDQ5Ljc4NjQgYyAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MTEgMC4yNzI5NDkyMiwwLjc5MTYgMC4yMDkxMDIyOSwwLjE0MTIgMC40NjU2MjA2NSwwLjIxODMgMC43MzY5NjI4OCwwLjIxODMgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjUgMS4zMTAxNTYzLC0xLjMxMDEgMCwtMC4yNzE0IC0wLjA3NzA5MywtMC41Mjc5IC0wLjIxODM1OTQsLTAuNzM3IC0wLjIyMDQ5NDEsLTAuMTY4NiAtMC40OTI1NDQzLC0wLjI3MjkgLTAuNzkxNTUyOCwtMC4yNzI5IHogbSAzLjAyOTczNjQsMCBjIC0wLjcyMzU3OTMsMCAtMS4zMTAxNTYzLDAuNTg2NSAtMS4zMTAxNTYzLDEuMzEwMSAwLDAuMjk5IDAuMTA0MzQxOSwwLjU3MTEgMC4yNzI5NDkyLDAuNzkxNiAwLjIwOTEwMjQsMC4xNDEyIDAuNDY1NjIwNywwLjIxODMgMC43MzY5NjI5LDAuMjE4MyAwLjcyMzU3OTMsMCAxLjMxMDE1NjMsLTAuNTg2NSAxLjMxMDE1NjMsLTEuMzEwMSAwLC0wLjI3MTQgLTAuMDc3MDkzLC0wLjUyNzkgLTAuMjE4MzU5NCwtMC43MzcgLTAuMjIwNDk0LC0wLjE2ODYgLTAuNDkyNTQ0MiwtMC4yNzI5IC0wLjc5MTU1MjcsLTAuMjcyOSB6IG0gMy4wODQzMjYxLDAgYyAtMC43MjM1NzkyLDAgLTEuMzEwMTU2MiwwLjU4NjUgLTEuMzEwMTU2MiwxLjMxMDEgMCwwLjI5OSAwLjEwNDM0MTksMC41NzExIDAuMjcyOTQ5MiwwLjc5MTYgMC4yMDkxMDI0LDAuMTQxMiAwLjQ2NTYyMDYsMC4yMTgzIDAuNzM2OTYyOSwwLjIxODMgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjUgMS4zMTAxNTYzLC0xLjMxMDEgMCwtMC4yNzE0IC0wLjA3NzA5MywtMC41Mjc5IC0wLjIxODM1OTQsLTAuNzM3IC0wLjIyMDQ5NDEsLTAuMTY4NiAtMC40OTI1NDQzLC0wLjI3MjkgLTAuNzkxNTUyOCwtMC4yNzI5IHoiLz4gIDwvZz4gIDxnICAgICBzdHlsZT0iZGlzcGxheTppbmxpbmUiPiAgICA8cGF0aCAgICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpldmVub2RkO3N0cm9rZTpub25lIiAgICAgICBkPSJtIDguMjE1NzcxNSwwLjI3Mjk0OTIyIGMgMC4xNDEyNjY3LDAuMjA5MTAyMjkgMC4yMTgzNTk0LDAuNDY1NjIwNjUgMC4yMTgzNTk0LDAuNzM2OTYyODggMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MyAtMS4zMTAxNTYzLDEuMzEwMTU2MyAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTk0IDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDc2IC0wLjIwNTUxNzYsLTAuNzk3Nzk2NTkgLTAuNTE4NjAzNSwtMS4wMzcyMDY5OCB6IG0gMCwzLjA4NDMyNjE4IGMgMC4xNDEyNjY3LDAuMjA5MTAyMyAwLjIxODM1OTQsMC40NjU2MjA2IDAuMjE4MzU5NCwwLjczNjk2MjkgMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MiAtMS4zMTAxNTYzLDEuMzEwMTU2MiAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTkzIDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY3IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogbSAtMy4wODQzMjYyLDAgYyAwLjE0MTI2NjcsMC4yMDkxMDIzIDAuMjE4MzU5NCwwLjQ2NTYyMDYgMC4yMTgzNTk0LDAuNzM2OTYyOSAwLDAuNzIzNTc5MyAtMC41ODY1NzcsMS4zMTAxNTYyIC0xLjMxMDE1NjMsMS4zMTAxNTYyIC0wLjI3MTM0MjIsMCAtMC41Mjc4NjA1LC0wLjA3NzA5MyAtMC43MzY5NjI5LC0wLjIxODM1OTMgMC4yMzk0MTA0LDAuMzEzMDg1OSAwLjYxMjYzNjMsMC41MTg2MDM1IDEuMDM3MjA3MSwwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYyLC0wLjU4NjU3NyAxLjMxMDE1NjIsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NSwtMC43OTc3OTY3IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogTSAyLjEwMTcwOSw2LjM4NzAxMTcgYyAwLjE0MTI2NjcsMC4yMDkxMDI0IDAuMjE4MzU5NCwwLjQ2NTYyMDYgMC4yMTgzNTk0LDAuNzM2OTYyOSAwLDAuNzIzNTc5MyAtMC41ODY1NzcsMS4zMTAxNTYzIC0xLjMxMDE1NjMsMS4zMTAxNTYzIC0wLjI3MTM0MjIzLDAgLTAuNTI3ODYwNTksLTAuMDc3MDkzIC0wLjczNjk2Mjg4LC0wLjIxODM1OTQgMC4yMzk0MTAzOSwwLjMxMzA4NTkgMC42MTI2MzYyMiwwLjUxODYwMzUgMS4wMzcyMDY5OCwwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY2IC0wLjUxODYwMzUsLTEuMDM3MjA3IHogbSAzLjAyOTczNjMsMCBjIDAuMTQxMjY2NywwLjIwOTEwMjQgMC4yMTgzNTk0LDAuNDY1NjIwNiAwLjIxODM1OTQsMC43MzY5NjI5IDAsMC43MjM1NzkzIC0wLjU4NjU3NywxLjMxMDE1NjMgLTEuMzEwMTU2MywxLjMxMDE1NjMgLTAuMjcxMzQyMiwwIC0wLjUyNzg2MDUsLTAuMDc3MDkzIC0wLjczNjk2MjksLTAuMjE4MzU5NCAwLjIzOTQxMDQsMC4zMTMwODU5IDAuNjEyNjM2MywwLjUxODYwMzUgMS4wMzcyMDcxLDAuNTE4NjAzNSAwLjcyMzU3OTMsMCAxLjMxMDE1NjIsLTAuNTg2NTc3IDEuMzEwMTU2MiwtMS4zMTAxNTYzIDAsLTAuNDI0NTcwOCAtMC4yMDU1MTc1LC0wLjc5Nzc5NjYgLTAuNTE4NjAzNSwtMS4wMzcyMDcgeiBtIDMuMDg0MzI2MiwwIGMgMC4xNDEyNjY3LDAuMjA5MTAyNCAwLjIxODM1OTQsMC40NjU2MjA2IDAuMjE4MzU5NCwwLjczNjk2MjkgMCwwLjcyMzU3OTMgLTAuNTg2NTc3LDEuMzEwMTU2MyAtMS4zMTAxNTYzLDEuMzEwMTU2MyAtMC4yNzEzNDIzLDAgLTAuNTI3ODYwNSwtMC4wNzcwOTMgLTAuNzM2OTYyOSwtMC4yMTgzNTk0IDAuMjM5NDEwNCwwLjMxMzA4NTkgMC42MTI2MzYyLDAuNTE4NjAzNSAxLjAzNzIwNywwLjUxODYwMzUgMC43MjM1NzkzLDAgMS4zMTAxNTYzLC0wLjU4NjU3NyAxLjMxMDE1NjMsLTEuMzEwMTU2MyAwLC0wLjQyNDU3MDggLTAuMjA1NTE3NiwtMC43OTc3OTY2IC0wLjUxODYwMzUsLTEuMDM3MjA3IHoiIC8+ICA8L2c+PC9zdmc+);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    pointer-events: auto !important;
}
.os-host-rtl > .os-scrollbar-corner.os-scrollbar-corner-resize {
    -webkit-transform: scale(-1, 1);
    transform: scale(-1, 1);
}
.os-host-overflow {
    overflow: hidden !important;
}
.os-host-overflow-x {
} 
.os-host-overflow-y {
} 

/*
THEMES:
*/

/* NONE THEME: */
.os-theme-none > .os-scrollbar-horizontal,
.os-theme-none > .os-scrollbar-vertical,
.os-theme-none > .os-scrollbar-corner {
    display: none !important;
}
.os-theme-none > .os-scrollbar-corner-resize {
    display: block !important;
    min-width: 10px;
    min-height: 10px;
}
/* DARK & LIGHT THEME: */
.os-theme-dark > .os-scrollbar-horizontal,
.os-theme-light > .os-scrollbar-horizontal {
    right: 10px;
    height: 10px;
}
.os-theme-dark > .os-scrollbar-vertical,
.os-theme-light > .os-scrollbar-vertical {
    bottom: 10px;
    width: 10px;
}
.os-theme-dark.os-host-rtl > .os-scrollbar-horizontal,
.os-theme-light.os-host-rtl > .os-scrollbar-horizontal {
    left: 10px;
    right: 0;
}
.os-theme-dark > .os-scrollbar-corner,
.os-theme-light > .os-scrollbar-corner {
    height: 10px;
    width: 10px;
}
.os-theme-dark > .os-scrollbar-corner,
.os-theme-light > .os-scrollbar-corner {
    background-color: transparent;
}
.os-theme-dark > .os-scrollbar,
.os-theme-light > .os-scrollbar {
    padding: 2px;
    box-sizing: border-box;
    background: transparent;
}
.os-theme-dark > .os-scrollbar.os-scrollbar-unusable,
.os-theme-light > .os-scrollbar.os-scrollbar-unusable {
    background: transparent;
}
.os-theme-dark > .os-scrollbar > .os-scrollbar-track,
.os-theme-light > .os-scrollbar > .os-scrollbar-track {
    background: transparent;
}
.os-theme-dark > .os-scrollbar-horizontal > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-light > .os-scrollbar-horizontal > .os-scrollbar-track > .os-scrollbar-handle {
    min-width: 30px;
}
.os-theme-dark > .os-scrollbar-vertical > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-light > .os-scrollbar-vertical > .os-scrollbar-track > .os-scrollbar-handle {
    min-height: 30px;
}
.os-theme-dark.os-host-transition > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-light.os-host-transition > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-light > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle,
.os-theme-dark > .os-scrollbar > .os-scrollbar-track,
.os-theme-light > .os-scrollbar > .os-scrollbar-track {
    border-radius: 10px;
}
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
    background: rgba(0, 0, 0, 0.4);
}
.os-theme-light > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
    background: rgba(255, 255, 255, 0.4);
}
.os-theme-dark > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle {
    background: rgba(0, 0, 0, .55);
}
.os-theme-light > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle {
    background: rgba(255, 255, 255, .55);
}
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active {
    background: rgba(0, 0, 0, .7);
}
.os-theme-light > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active {
    background: rgba(255, 255, 255, .7);
}
.os-theme-dark > .os-scrollbar-horizontal .os-scrollbar-handle:before,
.os-theme-dark > .os-scrollbar-vertical .os-scrollbar-handle:before,
.os-theme-light > .os-scrollbar-horizontal .os-scrollbar-handle:before,
.os-theme-light > .os-scrollbar-vertical .os-scrollbar-handle:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: block;
}
.os-theme-dark.os-host-scrollbar-horizontal-hidden > .os-scrollbar-horizontal .os-scrollbar-handle:before,
.os-theme-dark.os-host-scrollbar-vertical-hidden > .os-scrollbar-vertical .os-scrollbar-handle:before,
.os-theme-light.os-host-scrollbar-horizontal-hidden > .os-scrollbar-horizontal .os-scrollbar-handle:before,
.os-theme-light.os-host-scrollbar-vertical-hidden > .os-scrollbar-vertical .os-scrollbar-handle:before {
    display: none;
}
.os-theme-dark > .os-scrollbar-horizontal .os-scrollbar-handle:before,
.os-theme-light > .os-scrollbar-horizontal .os-scrollbar-handle:before {
    top: -6px;
    bottom: -2px;
}
.os-theme-dark > .os-scrollbar-vertical .os-scrollbar-handle:before,
.os-theme-light > .os-scrollbar-vertical .os-scrollbar-handle:before {
    left: -6px;
    right: -2px;
}
.os-host-rtl.os-theme-dark > .os-scrollbar-vertical .os-scrollbar-handle:before,
.os-host-rtl.os-theme-light > .os-scrollbar-vertical .os-scrollbar-handle:before {
    right: -6px;
    left: -2px;
}



:root {
    --bl-main-width: 350px;
    --bl-text-width: 170px;
    --bl-font-size: 15px;
    --bl-back-color: rgb(255, 255, 255);
    --bl-active-color: rgb(219, 35, 46);  
    --bl-main-color: rgb(234,237,242); 

    --tp-monitor-background-color: var(--bl-back-color);
    --tp-monitor-foreground-color: rgb(100,100,100);

    --tp-font-family: 'Montserrat';   
    --tp-base-background-color:  var(--bl-back-color);  /* цвет фона */
    --tp-input-foreground-color: var(--tp-monitor-foreground-color);   /*цвет текста в окне ввода и полоса слева*/
    --tp-input-background-color: var(--bl-main-color);    /* цвет в окне ввода и полоса слева*/

    --tp-button-background-color-hover: rgb(243, 243, 245);
    --tp-button-background-color-focus: var(--bl-main-color);

    --tp-container-background-color-hover: var(--bl-main-color);
    --tp-container-background-color-focus: var(--bl-main-color);
    --tp-button-background-color: var(--bl-main-color);
    --tp-label-foreground-color: rgb(100,100,100);     /* цвет текста*/
    --tp-container-foreground-color: var(--bl-active-color); /* цвет заголовка*/
    --tp-base-shadow-color: hsla(0, 0%, 0%, 0);  /*тень*/
    --tp-container-background-color: var(--bl-main-color); /*цвет папки*/
     
    --tp-blade-unit-size: 30px;  /*высота элемента*/
    --tp-blade-spacing: 10px;
    --tp-container-horizontal-padding: 10px;
    --tp-container-vertical-padding: 10px;
    --tp-element-border-radius: 4px;   /*радиус скругления в окне ввода и слайдера*/
    --tp-base-border-radius: 8px;     /*радиус скругления общего окна*/
 }

.os-scrollbar-vertical {
    width: 8px !important; /* 4 это 0*/
    right: 1px !important;
    autoHide : "move";
}

.svg-blueprint-statusbar { visibility: hidden !important }
.svg-blueprint-grid[style] { border-radius: 6px !important }




    
.mainclass2 { 
    overflow-y: hidden;
    overflow-x: hidden;
    scrollbar-width: none;  /* Firefox */
    }/*hidden*/

/*
 .mainclass::-webkit-scrollbar {
  display: none;
      width: 30px; 

::-webkit-scrollbar {
    width: 30px; 
}
*/

.mainclass {
    overflow-y: scroll;
    overflow-x: hidden;
    -ms-overflow-style: none;  /* IE and Edge */
    overflow: -moz-scrollbars-none; /* Firefox */
    scrollbar-width: thin;
}


/* Скрыть вертикальную полосу прокрутки */
::-webkit-scrollbar {
    width: 0; /* для Chrome, Safari и Opera */
}



.fixed {
position:fixed; /*позицианируем чтобы исчез скролл*/
width:100%; /*что бы верстка не складывалась по ширине*/
}

 .main-window { 
    border: solid 0px;
    border-color: var(--bl-main-color); 
    margin: 0 auto;
    width: 1320px;
    height: 700px; 
    margin-top: 0px;
 }


.gui { 
    width: calc(var(--bl-main-width) + 10px); 
    height: 600px; 
    float: left; 
    position: absolute; 
    z-index: 0;
   
 }

.drawing { 
    position: absolute; 
    width: 919px; 
    height: 600px; 
    border: solid 2px;
    border-color: var(--bl-main-color); 
    border-radius: var(--tp-base-border-radius); 
    margin-left: calc(var(--bl-main-width) + 10px) ;
     }



.tp-txtv_k { visibility: hidden } /* выключение точной горизонтальной настройки*/
.tp-txtv_i { padding-left: 4px !important; padding-right: 4px !important;}
.tp-sglv_i { border: 0px !important;}

.tp-rotv_c { width: var(--bl-main-width) !important }

/* сепаратор */
.tp-sprv_r { 
    background-color: var(--bl-main-color) !important;
    height: 1px !important;
    margin-bottom: 10px !important;
  };




.tp-fldv_t { font-size: var(--bl-font-size) }
.tp-lblv_v { font-size: var(--bl-font-size) } 
.tp-lblv   { font-size: var(--bl-font-size) } 
.tp-fldv_t { font-weight: 400 }   /*жирность шрифта подкаталога*/
.tp-lblv_v { font-weight: 400 }   /*жирность шрифта инпута*/
.tp-lblv   { font-weight: 400 }   /*жирность шрифта параметра*/
.tp-fldv_t { margin-left: 4px }   /*сдвиг шрифта подкаталога*/

.tp-lblv_v { min-width: calc( var(--bl-main-width) - var(--bl-text-width)) !important }  /*ширина инпута и полосы*/

.tp-btnv_t { height: 40px  !important }

.tp-fldv_c { border: var(--cnt-bg) solid 1px !important }
.tp-sldv_k::after { background-color: var(--bl-active-color) !important }

.tp-lblv_l { 
  padding-right: 0px !important;

}
/* слайдер */
.tp-sldv_k::after {
    border: var(--bl-back-color) solid 2px; 
    border-radius: 8px !important;
    height: 16px !important;
    width: 16px !important;
}

.tp-sldv_k::before { height: 1px !important }
.tp-sldv_t::before { height: 1px !important }

.tp-fldv_b { height: 40px !important}

.tp-lstv_s {
  width: 70px !important;
  margin-left:  calc( var(--bl-main-width) - var(--bl-text-width) - 70px) !important;
  font-weight: 400 !important;
}

.tp-ckbv_w { margin-left: calc( var(--bl-main-width) - var(--bl-text-width) - 30px) !important; }
.tp-lstv_s { padding-left: 10px !important }

.tp-lblv {
    margin-top: 0px !important;
    margin-bottom: 8px !important }



/* draw selector ========================================================================================================================================*/

.draw-selector {
    margin-left: 0px !important;
    width: 180px !important }

.draw-selector-140 {
    margin-left: 40px !important;
    width: 120px !important }

/*  button =============================================================================================================================================*/

.tp-btnv_b {
    margin-top: 8px !important;
    width: calc(var(--bl-main-width) - 20px) !important;
    margin-left: -2px !important;
    border-radius: 4px !important;
    height: 40px !important;
    transition: background-color 0.05s ease-in-out }

.tp-btnv_b:hover {
    background-color: var(--bl-active-color)  !important;
    transition: background-color 0.05s ease-in-out }

.tp-btnv_t { 
    padding-top: 5px !important;
    color: var(--bl-active-color);
    transition: color 0.05s ease-in-out }

.tp-btnv_t:hover { 
    color: white;
    transition: color 0.05s ease-in-out }

/* remove button =====================================================================================================================================*/

.remove_b {
    height: 30px !important;
    width: 180px !important;
    margin-left: 92px !important }

.remove_t { 
    font-weight: 400 !important;
    padding-top: 0px !important }



.tp-fldv_m {
  height: 12px !important;
  right: 14px !important;
  width: 12px !important;
  opacity:1 !important;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6.8 12' width='12' height='12'%3E%3Cpath fill='%23db232e' d='M6.69,5.34L1.66,0.31c-0.38-0.38-0.99-0.38-1.36,0c-0.38,0.38-0.38,0.99,0,1.36l4.35,4.35l-4.35,4.35c-0.38,0.38-0.38,0.99,0,1.36c0.38,0.38,0.99,0.38,1.36,0l5.04-5.04C7.07,6.33,7.07,5.72,6.69,5.34z'/%3E%3C/svg%3E") !important;
}

/* color ================================================================================================================================================*/

.tp-colswv_b {
  border: solid 1px !important;
  border-radius: 5px  !important;
  border-color: var(--tp-monitor-foreground-color) !important;
}

/* расстояние между квадратом с цветом и текстом */
.tp-colv_t { margin-left: 10px !important }



/* overall dimensions =====================================================================================================================================*/

.tp-sglv_i {
    text-align: right !important;
    padding-right: 0px !important;
}



/*-------------------*/
/* tabs */
.tp-rotv {
  font-size: var(--bl-font-size) !important;
  font-weight: 700 !important;
}

.tp-tbiv_b {
  height: 50px !important;
}

.tp-tabv_c {
  border-left: var(--bl-main-color) solid 2px !important;
  border-right: var(--bl-main-color) solid 2px !important;
  border-bottom: var(--bl-main-color) solid 2px !important;
  padding-bottom: 2px !important;

}



.tp-fldv { 
margin-right: 8px !important;
margin-left: 8px !important;
margin-bottom: 8px !important; /* расстояние между элементами */

}
/*tp-brkv tp-fldv_c tp-v-fst tp-v-vfst*/


.tp-fldv_b { border-radius:  4px 4px 4px 4px!important }

.tp-brkv {
  border-radius:  0px 0px 4px 4px!important;
  border-top-width: 4px !important;
  top: -4px !important;
  padding-bottom: 0px !important;

}


.tp-fldv-expanded { margin-bottom: 4px !important; } 
/*.tp-fldv-cpl {margin-bottom: 2px !important}*/

.tp-rotv { margin-top: 4px !important }

/* top folder radius */
.tp-tbiv_b { border-radius: var(--tp-base-border-radius) var(--tp-base-border-radius) 0px 0px !important }
.tp-tabv_c { border-radius: 0px 0px var(--tp-base-border-radius) var(--tp-base-border-radius) !important }

/* тень круг */
.tp-p2dpv_p { border-radius: 75px !important }




.swal2-title {
    color: black !important;
    font-family: Montserrat;
    font-weight: 700 !important;
    font-size: 25px;

  }

  .swal2-html-container {
      overflow-y: hidden !important;
    /*margin-left: 35px;
    //margin-right: 35px;
    //margin-bottom: 10px;*/
    text-align: center;
    font-family: Montserrat;
    font-weight: 300 !important;
    line-height: 150% !important;
    font-size: 16px !important;
    color: rgb(150,150,150) !important;
  }

  .swal2-confirm {
    background-color: var(--bl-active-color) !important;
    font-weight: 700 !important;
    font-family: Montserrat;
    margin: 8px; 
    margin-left: 15px;
  /*  //margin: 15px !important;
       // margin-left: 30px !important;*/
  }

  .swal2-deny {
    /* background-color: var(--bl-active-color) !important;*/
     font-weight: 400 !important;
     font-family: Montserrat;
     color: var(--bl-active-color) !important;
     background-color: var(--bl-main-color) !important;
         margin: 8px; 
  /* //  margin: 5px !important;*/
   }

  .swal2-cancel {

     background-color: var(--bl-main-color) !important;
    color: var(--bl-active-color) !important;
     font-weight: 400 !important;
     font-family: Montserrat;
         margin: 8px; 
         margin-right: 15px;

   }

.swal2-close:focus{ box-shadow: none !important }
.swal2-cancel:focus{ box-shadow: none !important }
.swal2-confirm:focus{ box-shadow: none !important }
.swal2-deny:focus{ box-shadow: none !important }

/*////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*// ThreeJS /////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////*/

#bl1 > canvas{ border-radius: 8px }   /* скругление углов блока с 3d */

/* Variables */
/* Animation */
@-webkit-keyframes ssc-loading {
  from {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  to {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@keyframes ssc-loading {
  from {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  to {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
/* Animation partial */
.ssc-square, .ssc-head-line, .ssc-line, .ssc-hr, .ssc-circle {
      width: 937px; 
    height: 600px; 
  display: block;
  background-color: rgba(0, 0, 0, 0.17);
  position: relative;
  overflow: hidden;
}
.ssc-square:after, .ssc-head-line:after, .ssc-line:after, .ssc-hr:after, .ssc-circle:after {
  content: "";
  -webkit-animation: ssc-loading 1.3s infinite;
          animation: ssc-loading 1.3s infinite;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  z-index: 1;
  background: linear-gradient(90deg, transparent, hsla(0deg, 0%, 100%, 0.3), transparent);
}

/** Main class */
.ssc {
  cursor: progress;
  -webkit-user-select: none;
          user-select: none;
}

/** Helpers classes */
.ssc .mb {
  margin-bottom: 16px;
}
.ssc .mt {
  margin-top: 16px;
}
.ssc .mr {
  margin-right: 16px;
}
.ssc .ml {
  margin-left: 16px;
}
.ssc .mbs {
  margin-bottom: 8px;
}
.ssc .mts {
  margin-top: 8px;
}
.ssc .mrs {
  margin-right: 8px;
}
.ssc .mls {
  margin-left: 8px;
}
.ssc .w-10 {
  width: 10%;
}
.ssc .w-20 {
  width: 20%;
}
.ssc .w-30 {
  width: 30%;
}
.ssc .w-40 {
  width: 40%;
}
.ssc .w-50 {
  width: 50%;
}
.ssc .w-60 {
  width: 60%;
}
.ssc .w-70 {
  width: 70%;
}
.ssc .w-80 {
  width: 80%;
}
.ssc .w-90 {
  width: 90%;
}
.ssc .w-100 {
  width: 100%;
}
.ssc .flex {
  display: flex;
}
.ssc .inline-flex {
  display: inline-flex;
}
.ssc .flex-column {
  flex-direction: column;
}
.ssc .flex-column-reverse {
  flex-direction: column-reverse;
}
.ssc .flex-row {
  flex-direction: row;
}
.ssc .flex-row-reverse {
  flex-direction: row-reverse;
}
.ssc .align-center {
  align-items: center;
}
.ssc .align-start {
  align-items: flex-start;
}
.ssc .align-end {
  align-items: flex-end;
}
.ssc .align-stretch {
  align-items: stretch;
}
.ssc .justify-start {
  justify-content: start;
}
.ssc .justify-center {
  justify-content: center;
}
.ssc .justify-end {
  justify-content: end;
}
.ssc .justify-between {
  justify-content: space-between;
}
.ssc .justify-around {
  justify-content: space-around;
}

/** Wrapper class */
.ssc-wrapper {
  padding: 16px;
}

/* Figures, Objects */
.ssc-card {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 5px;
  box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.17);
  background-color: #ffffff;
}

.ssc-circle {
  border-radius: 50%;
  width: 50px;
  height: 50px;
}

.ssc-hr {
  width: 100%;
  height: 2px;
}

.ssc-line {
  border-radius: 15px;
  width: 100%;
  height: 12px;
}

.ssc-head-line {
  border-radius: 15px;
  width: 100%;
  height: 24px;
}

.ssc-square {
  width: 100%;
  height: 150px;
}

/*# sourceMappingURL=/index.css.map */.ldBar {
  position: relative;
}
.ldBar.label-center > .ldBar-label {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-shadow: 0 0 3px #fff;
}
.ldBar-label:after {
  content: "%";
  display: inline;
}
.ldBar.no-percent .ldBar-label:after {
  content: "";
}
:root {
    --bl-main-width: 370px !important;
    --bl-text-width: 190px;
}

.os-scrollbar-vertical {
    width: 8px !important; /* 4 это 0*/
    right: 1px !important;
    autoHide : "move";
}

.drawing { 
  margin-top: 48px;
   height: 550px; 
  border-radius: 0 var(--tp-base-border-radius) 0 0; 
  }


.gui { 
  z-index: 0;
  width: calc(var(--bl-main-width) + 10px); 
  height: 660px; 
  float: left; 
  position: absolute; 
}

.tabs  .tp-rotv_c {
    width: 550px !important;

}

.tabs { 
    width: 550px;
    z-index: 0;
    height: 50px; 
    position: absolute; 
    margin-left: calc(var(--bl-main-width) + 10px);
  }


  .render { 
    --tp-button-background-color: rgb(85, 195, 125);
    --bl-active-color: white;
    --tp-button-background-color-hover: rgb(45, 155, 85);
    --bl-main-width: 250px;
    margin-left: 147px !important;
    margin-top: -378px;
    z-index: 4;
    width: 200px !important; 
    height: 200px !important; 
    float: left; 
    position: absolute; 
  }
  
  .ldBar-label {
    color: rgb(150,150,150);
    font-family: 'Montserrat';
    font-size: 20px;
    font-weight: 400;
  }

  .ldBar path.mainline {
    stroke-width: 4;
    stroke: #db232e;
    stroke-linecap: round;
  }

.options { 
    width: 919px; 
    margin-top: 596px;
    height: 64px; 
    position: absolute; 
    border: solid 2px;
    margin-left: calc(var(--bl-main-width) + 10px); 
background-color: var(--bl-main-color); 
    border-color: var(--bl-main-color); 
    border-radius: 0 0 var(--tp-base-border-radius) var(--tp-base-border-radius) ; 
}

  .option1 { 
    --bl-main-width: 170px;
    --bl-text-width: 140px;
    margin-top: 8px;
    margin-left: 10px;
    float: left; 
    position: absolute; 
  }

.option1 .tp-ckbv_w { 
    margin-left: 0px!important; 
        margin-top: -3px !important;
    border: 1px solid;
    background-color: var(--tp-button-background-color-hover) !important; }
.option1 .tp-lblv_v { width: 30px;
    margin-top: 0px !important; }



.option2 { 
    --bl-main-width: 170px;
    --bl-text-width: 140px;

    margin-left: 200px;
    float: left; 
    position: absolute; 
  }
  .option2 .tp-ckbv { width: 30px }
  .option2 .tp-lblv_v { width: 30px; }

  .filetype { 
    --bl-main-width: 300px;
    --tp-button-foreground-color: var(--bl-active-color);
    margin-left: 130px;
    top: -6px !important;
    float: left; 
    position: absolute; 
  }

  .download { 
    --bl-main-width: 181px;
    --tp-button-background-color: var(--bl-active-color);
    margin-left: 395px;
    width: 200px; 
    float: left; 
    position: absolute; 
  
  }

  .download  .tp-btnv_t {
      color: white;
  }

.tp-radgridv {
    margin-top: -2px !important;
    width: 260px;
    height: 40px;

}

.tp-radv_b {

    height: 40px !important;
}

.tp-radv_t {
    top: 5px !important;
}



.test {
    background-repeat: no-repeat;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI3LjIuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMCIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAxNC4yIDE0LjIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDE0LjIgMTQuMjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNGRkZGRkY7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNC4yLDEzLjRIMGMtMC40LDAtMC44LDAuMy0wLjgsMC44YzAsMC40LDAuMywwLjgsMC44LDAuOGgxNC4yYzAuNCwwLDAuOC0wLjMsMC44LTAuOAoJCUMxNC45LDEzLjgsMTQuNiwxMy40LDE0LjIsMTMuNHoiLz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik02LjYsMTFjMC4xLDAuMSwwLjIsMC4xLDAuMiwwLjJjMC4yLDAuMSwwLjQsMC4xLDAuNiwwYzAuMSwwLDAuMi0wLjEsMC4yLTAuMmwzLjgtMy44YzAuMy0wLjMsMC4zLTAuOCwwLTEuMQoJCWMtMC4zLTAuMy0wLjgtMC4zLTEuMSwwTDcuOCw4LjZWMGMwLTAuNC0wLjMtMC44LTAuOC0wLjhDNi43LTAuOCw2LjMtMC40LDYuMywwdjguNkwzLjgsNi4xYy0wLjMtMC4zLTAuOC0wLjMtMS4xLDAKCQljLTAuMywwLjMtMC4zLDAuOCwwLDEuMUw2LjYsMTF6Ii8+CjwvZz4KPC9zdmc+Cg==);
  }
  /*
.button { 
  top: calc(600px + 16px);
  width: calc(var(--bl-main-width) + 10px); 
  height: 50px; 
  float: left; 
  position: absolute; 
}
*/



.drawing:hover ~ .mainclass{  background-color: black  } 






/* слайдер */
.tp-sldv_k::after {
  border: var(--bl-back-color) solid 2px; 
  border-radius: 8px !important;
}

.tp-sldv_k::before { height: 1px !important }
.tp-sldv_t::before { height: 1px !important }

.tp-fldv_b { height: 40px !important}

.tp-lstv_s {
  width: 70px !important;
  margin-left:  calc( var(--bl-main-width) - var(--bl-text-width) - 70px) !important;
  font-weight: 400 !important;
}
.tp-ckbv_w { margin-left: calc( var(--bl-main-width) - var(--bl-text-width) - 30px) !important; }
.tp-lstv_s { padding-left: 10px !important }

.tp-lblv{
margin-top: 0px !important;
margin-bottom: 8px !important;
}

/* draw selector ***************************************************************/

.draw-selector
{
    margin-left: 0px !important;
    width: 180px !important;
}

.draw-selector-140
{
    margin-left: 40px !important;
    width: 120px !important;
}



/* кнопка ***************************************************************/

.tp-btnv_b 
{
  /*  
    width: calc(var(--bl-main-width) - 20px) !important;
    margin-left: -2px !important;
    border-radius: 4px !important;
        transition: background-color 0.05s ease-in-out;*/
    height: 40px !important;
    margin-top: -2px !important;
    background-color: var(--bl-active-color) !important;

}

.tp-btnv_t { 
 /* padding-top: 5px !important;*/
  color: var(--bl-active-color);

}


.tp-btnv_b:hover 
{
  background-color: rgb(196, 31, 42) !important;
  transition: background-color 0.15s ease-in-out;
}










/*-------------------*/
/* tabs */
.tp-rotv {

  font-weight: 700 !important;
  background-color: transparent;

}

.tp-tbiv_b {
  height: 50px !important;
  cursor: pointer !important;

}

.tp-radv_i:checked+.tp-radv_b {
  background-color: white !important; /**/
  font-weight: 700 !important;
  border: 1px solid;
  border-radius: 4px;
  border-color: #db232e!important;

}

.tp-radv_b {
  font-weight: 500 !important;
  border-radius: 4px !important;
  border: 1px solid !important;
  border-color: white !important;
    background-color: white !important; /**/

}

.tp-radgridv {
  gap: 4px !important;
}

.tp-tbiv
{
  font-weight: 500 !important;

}
.tp-tbiv-sel
{
  font-weight: 700 !important;
}

.tp-tabv_c {
  border-left: var(--bl-main-color) solid 2px !important;
  border-right: var(--bl-main-color) solid 2px !important;
  border-bottom: var(--bl-main-color) solid 2px !important;
  padding-bottom: 2px !important;

}




.tp-fldv { 
margin-right: 8px !important;
margin-left: 8px !important;
margin-bottom: 8px !important; /* расстояние между элементами */

}
/*tp-brkv tp-fldv_c tp-v-fst tp-v-vfst*/


.tp-fldv_b { border-radius:  4px 4px 4px 4px!important }

.tp-brkv {
  border-radius:  0px 0px 4px 4px!important;
  border-top-width: 4px !important;
  top: -4px !important;
  padding-bottom: 0px !important;

}


.tp-fldv-expanded { margin-bottom: 4px !important; } 
/*.tp-fldv-cpl {margin-bottom: 2px !important}*/

.tp-rotv { margin-top: 4px !important }

/* top folder radius */
.tp-tbiv_b { border-radius: var(--tp-base-border-radius) var(--tp-base-border-radius) 0px 0px !important }
.tp-tabv_c { border-radius: 0px 0px var(--tp-base-border-radius) var(--tp-base-border-radius) !important }








/*////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*// ThreeJS /////////////////////////////////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////////////////////////////////////////////*/

#bl1 > canvas{ border-radius:  0 var(--tp-base-border-radius) 0 0  }   /* скругление углов блока с 3d */



.tp-induv .tp-induv_t {
    font-weight: 400 !important;
    font-size: 12px !important;
    margin-bottom: 8px !important;
}
body {
    margin: 0;
}

/*
.main-window {
    width: 100vw;
    height: 100vh;
}

.drawing {
    width: 100vw;
    height: 100vh;
    border: none;
    margin: 0;
}
*/
.bl-constructor-preloader {
    position: absolute;
    z-index: 100;
    top: 0%;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(255,255,255,.9);
    height: 100vh;
}

.bl-constructor-preloader img {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    opacity: .4;
    animation: pulseLogo 1.6s infinite;
    max-width: 90%;
}

@keyframes pulseLogo {
	0% {
		opacity: 0.4;
	}

	50% {
		opacity: 0.1;
	}
	100% {
		opacity: 0.4;
	}
}

img {
    vertical-align: middle;
    border-style: none;
}

.tp-rotv {
    background-color: transparent !important;
}

.tp-radv_t {
    height: 35px !important;
}

.tp-radv_b {
    height: 38px !important;
}

.tp-btnv_t {
    height: 38px !important;
}

:root {
    --bl-main-width: 340px !important;
    /*--bl-text-width: 190px;*/
}

.drawing {
    width: 640px;
    height: 540px;
}

.options {
    width: 100%;
    margin-left: 0px;
    min-width: 900px;
}
/* .option2 {
    margin-left: 0px;
}

#option2-container > .tp-brkv {
    display: none;
} */
.main-window {
    width: -webkit-fill-available;
    overflow: hidden;
}