@charset "UTF-8";
/* CSS Document */
@media(prefers-color-scheme: light) { 
	:root {
		--font-family: "IBM Plex Sans",sans-serif;
		--font-weight: 400;
		--alertsucces: rgba(91,209,139,.9);
        --alertwarning: rgba(255,165,0,.9);
        --alertmissing: rgba(0,149,219,.9);
        --alerterror: rgba(223,37,37,.9);
        --alertcolor: #fbfbfb;
        --action-delete: rgba(255, 103, 87, 1);
        --action-delete-hover: rgba(255, 103, 87, .65);
        --alignbtns-bg: rgba(0, 161, 155, .10);
        --aside-bg: #2e313d;
        --aside-labels: #ffffff;
        --aside-shade-left: inset -7px 0 9px -7px rgba(0,0,0,0.7);
        --aside-shade-right: inset 7px 0 9px -7px rgba(0,0,0,0.7);
        --aside-left-user-border: rgba(255,255,255,.1);
        --aside-left-user-img-border: rgba(255,255,255,.2);
        --aside-left-gray: #9898a0;
        --aside-left-active: #1e202c;
        --aside-left-nav-hover-bg: rgba(255,255,255,.035);
        --aside-left-nav-dropdown: #1e202c;
        --aside-right-dark-bg: rgba(30,32,44,1);
        --aside-right-btn: rgba(30,32,44,1);
        --aside-right-btn-hover: rgba(30,32,44,.5);
        --aside-right-delete-btn-hover: #ff6757;
        --base: white;
        --body: #f2f7fa;
        --border-color: rgba(0,0,0,.08);
        --border-color-focus: rgba(255, 209, 51, .85);
        --borderright: rgba(205,205,205,.3);
        --buttons-color: #1c212d;
        --buttons-disabled: rgba(0,0,0,.05);
        --chosen-border:1px solid #dfdfdf;
        --chosen-border-top:1px solid rgba(255,255,255,0);
        --chosen-border-bottom:1px solid rgba(255,255,255,0);
        --chosen-bg-color:white;
        --chosen-color:#333;
        --chosen-disabled:#dedede;
        --chosen-color-disabled:#bcbcbc;
        --chosen-box-shadow:rgba(0, 0, 0, 0.55);
        --chosen-search-bg: white;
        --chosen-search-border: 1px solid #ededed;
        --chosen-highlighted: #f1f3f1;
        --chosen-close-svg: url(/images/close_lightmode.svg);
        --chosen-active-img: url(/images/select_bars_ce1417.png);
        --chosen-drop-top: 4px;
        --ckeditor-color: #333;
        --ckeditor-focus: #898989;
        --css-errors: #495057;
        --dashboard-donuts-bg: rgba(0, 161, 155, .75);
        --draggable: rgba(255,255,255,.50);
        --droppable: rgba(242,247,250,1);
        --dragdisabled: #e8e8e8;
        --even-row: #f2f7fa;
        --gray_0: #ffffff;
        --gray_2: #fbfbfb;
        --gray_4: #f8f8f8;
        --gray_5: #f6f6f6;
        --gray_6: #f4f4f4;
        --gray_7: #f2f2f2;
        --gray_8: #f0f0f0;
        --gray_9: #efeeee;
        --gray_10: #ededed;
        --gray_20: #dadada;
        --gray_30: #c6c6c6;
        --gray_40: #b2b2b2;
        --gray_50: #9d9d9c;
        --gray_60: #878787;
        --gray_80: #575756;
        --gray_90: #3c3c3b;
        --gray_95: #2e2d2c;
        --input-tools: rgba(245,245,245,1);
        --input-tools-border: #1c212d;
        --input-tools-bg: rgba(255,255,255,.9);
        --input-radius: 5px;
        --input-border: rgba(240,240,240,1);
        --input-bg: #f8f8f8;
        --input-dark: #1e202c;
        --input-error: #d01313;
        --legendfour: rgba(199, 226, 225,1);
        --legendthree: rgba(163, 207, 205,1);
        --legendtwo: rgba(0, 161, 155, 1);
        --legendone: rgba(16, 196, 105,1);
        --legendexvat: rgba(0,0,0,.1);
        --livepreview-shade: inset -7px 0 9px -7px rgba(0,0,0,0.2);
        --nodes-bg: rgba(0,0,0,.5);
        --nodes-bg-hover: rgba(0,0,0,.9);
        --notfication-bg: #cf102d;
        --main-color-opacity: rgba(255, 209, 51, .85);
        --main-color: rgba(255, 209, 51, 1);
        --main-color-hover: rgba(255, 209, 51, .45);
        --modial-bg: rgba(255, 255, 255, .65);
        --odd-row: rgba(255,255,255,0);
        --progress-wrap-bg: #db2638;
        --progress-bar-bg: #e9e9e9;
        --popup-nav-bg: #f0f0f0;
        --popup-shade: 0 0 20px 0 rgba(0, 0, 0, 0.10);
        --radio-pop-img: rgba(0, 161, 155, .20);
        --ruler: #dedede;
        --section: rgba(255,255,255,.70);
        --section-tools: rgba(220,220,233,.8);
        --section-border: #aaa;
        --section-image: #e8e8e8;
        --signin-left-bg: url(/images/bgimglight.webp);
        --signin-container-bg: rgba(255,255,255,1);
        --signin-container-shade: 0 1px 2px rgba(56,65,74,0.15);
		--signin-logo: url(/images/crayoncru_logo_light.svg);
        --slider-bg: #f8f8f8;
        --slider-bg-before: #f4f4f4;
        --topnav-bg: #f2f7fa;
        --topnav-widgets: #f2f7fa;
        --topnav-border-color: rgba(0,0,0,.03);
        --tooltip: #1e202c;
        --wigdets-color: #fff;
        --widgets-shade: 0 0 5px 0 rgba(0, 0, 0, 0.10);
        --widgets-bg: white;
        --widgets-dark-bg: #2e313d;
        --widgets-selected-bg: #f1f3f1;
        --widgets-stroke: rgba(0,0,0,.03);
	}
}
@media(prefers-color-scheme: dark) { 
	:root {
		--font-family: "IBM Plex Sans",sans-serif;
		--font-weight: 400;
		--alertsucces: rgba(91,209,139,.9);
        --alertwarning: rgba(255,165,0,.9);
        --alertmissing: rgba(0,149,219,.9);
        --alerterror: rgba(223,37,37,.9);
        --alertcolor: #fbfbfb;
        --action-delete: rgba(177,41,35, 1);
        --action-delete-hover: rgba(177,41,35, .65);
        --alignbtns-bg: rgba(0, 161, 155, .10);
        --aside-bg: #323843;
        --aside-labels: #c2c6ca;
        --aside-shade-left: inset -7px 0 9px -7px rgba(0,0,0,0.15);
        --aside-shade-right: inset 7px 0 9px -7px rgba(0,0,0,0.15);
        --aside-left-user-border: rgba(255,255,255,.1);
        --aside-left-user-img-border: rgba(255,255,255,.2);
        --aside-left-gray: #9898a0;
        --aside-left-active: #323843;
        --aside-left-nav-hover-bg: rgba(255,255,255,.035);
        --aside-left-nav-dropdown: #0a1318;
        --aside-right-dark-bg: #292e37;
        --aside-right-btn: rgba(41,46,55,1);
        --aside-right-btn-hover: rgba(41,46,55,.5);
        --aside-right-delete-btn-hover: #ff6757;
        --base: #323843;
        --body: #212834;
        --border-color: rgba(255,255,255,.10);
        --border-color-focus: rgba(106, 94, 203, .85);
        --borderright: rgba(255,255,255,.15);
        --buttons-color: #dbdbdb;
        --buttons-disabled: rgba(255,255,255,.1);
        --chosen-border:none;
        --chosen-border-top:1px solid rgba(255,255,255,.1);
        --chosen-border-bottom:1px solid rgba(255,255,255,.05);
        --chosen-bg-color:#393e48;
        --chosen-color:#F2F2F2;
        --chosen-disabled:#3b3b3b;
        --chosen-color-disabled:#a4a4a4;
        --chosen-box-shadow:rgba(0, 0, 0, 0.7);
        --chosen-search-bg: rgba(0,0,0,.15);
        --chosen-search-border: none;
        --chosen-highlighted: rgba(0,0,0,.15);
        --chosen-close-svg: url(/images/close_darkmode.svg);
        --chosen-active-img: url(/images/select_bars_dark.png);
        --chosen-drop-top: 9px;
        --ckeditor-color: #898989;
        --ckeditor-focus: #c6c8c9;
        --css-errors: #495057;
        --dashboard-donuts-bg: rgba(0, 161, 155, 0.35);
        --draggable: rgba(255,255,255,.05);
        --droppable: rgba(41,46,55,1);
        --dragdisabled: rgba(255,255,255,.05);
        --even-row: rgba(255,255,255,.15);
        --gray_0: #ffffff;
        --gray_2: #fbfbfb;
        --gray_4: #f8f8f8;
        --gray_5: #f6f6f6;
        --gray_6: #f4f4f4;
        --gray_7: #f2f2f2;
        --gray_8: #f0f0f0;
        --gray_9: #efeeee;
        --gray_10: #ededed;
        --gray_20: #dadada;
        --gray_30: #c6c6c6;
        --gray_40: #b2b2b2;
        --gray_50: #9d9d9c;
        --gray_60: #9ba6ac;
        --gray_80: #c2c6ca;
        --gray_90: #c2cad2;
        --gray_95: #cbd3dc;
        --input-tools: rgba(57,62,72,1);
        --input-tools-border: rgba(255,255,255,.45);
        --input-tools-bg: rgba(0,0,0,.1);
        --input-radius: 5px;
        --input-border: #3e444e;
        --input-bg: rgba(255,255,255,.02);
        --input-dark: #292e37;
        --input-error: #d01313;
        --legendfour: rgba(69, 75, 87,1);
        --legendthree: rgba(44, 89, 89,1);
        --legendtwo: rgba(0, 113, 109, 1);
        --legendone: rgba(16, 196, 105,1);
        --legendexvat: rgba(255,255,255,.1);
        --livepreview-shade: inset -7px 0 9px -7px rgba(0,0,0,0.8);
        --nodes-bg: rgba(30,32,44,.8);
        --nodes-bg-hover: rgba(30,32,44,.95);
        --notfication-bg: #cf102d;
        --main-color-opacity: rgba(65, 136, 219, .85);
        --main-color: rgba(65, 136, 219, 1);
        --main-color-hover: rgba(65, 136, 219, .45);
        --modial-bg: rgba(0, 0, 0, .85);
        --odd-row: rgba(255,255,255,0);
        --progress-wrap-bg: #db2638;
        --progress-bar-bg: #344652;
        --popup-nav-bg: rgba(30,32,44,1);
        --popup-shade: 0 0 20px 0 rgba(0, 0, 0, 0.60);
        --radio-pop-img: rgba(0, 161, 155, .20);
        --ruler: #dedede;
        --section: rgba(255,255,255,.10);
        --section-tools: rgba(30,32,44,.8);
        --section-border: rgba(255,255,255,.15);
        --section-image: rgba(255,255,255,.25);
        --signin-left-bg: url(/images/bgimgdark.webp);
        --signin-container-bg: #1E242E;
        --signin-container-shade: 0 0.75rem 1.5rem rgba(18,38,63,.09);
		--signin-logo: url(/images/crayoncru_logo.svg);
        --slider-bg: #e0e7ea;
        --slider-bg-before: #2a2f3e;
        --topnav-bg: #292e37;
        --topnav-widgets: #292e37;
        --topnav-border-color: rgba(255,255,255,.03);
        --tooltip: #030608;
        --wigdets-color: #c6c8c9;
        --widgets-shade: 0 0 5px 0 rgba(0, 0, 0, 0.3);
        --widgets-bg: #292e37;
        --widgets-dark-bg: #2e313d;
        --widgets-selected-bg: rgba(0,0,0,.15);
        --widgets-stroke: rgba(255,255,255,.03);
	}
}