/* -------- NETFIVE COLORS 24 --------------------- */
.bg-white,.bg-paper-0 {background-color: #ffffff !important}
.bg-black {background-color: #000000 !important; color: #ebebeb}
.bg-white-soft {
	color: #383838;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f1f1f1 27%, #e1e1e1 77%, #f6f6f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f1f1f1 27%,#e1e1e1 77%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffffff 0%,#f1f1f1 27%,#e1e1e1 77%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.bg-black-soft {
	color: #d5d5d5;
	background: #000000;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to bottom, #434343, #000000);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to bottom, #434343, #000000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-gray1,.cl-page-header {background-color: #161616 !important; color: #ebebeb}
.bg-gray2 {background-color: #2b2b2b !important; color: #ebebeb}
.bg-gray3 {background-color: #585858 !important; color: #ebebeb}
.bg-gray4 {background-color: #7f7f7f !important; color: #ebebeb}
.bg-gray5,.bg-gray {background-color: #a0a0a0 !important; color: #242424}
.bg-gray6,.bg-paper-3 {background-color: #b6b6b6 !important; color: #242424}
.bg-gray7,.bg-paper-2,.cl-page-bar {background-color: #c9c9c9 !important; color: #242424}
.bg-gray8,.bg-paper-1,.tab-content,.cl-page-content {background-color: #e7e7e7 !important; color: #242424}

.bg-red1 {background-color: #651818 !important; color: #ebebeb}
.bg-red2,.cl-system {background-color: #850047 !important; color: #d5d5d5}
.bg-red3,.bg-app {background-color: rgba(206,5,56,1) !important; color: #242424}
.bg-red4 {background-color: #ffbfb9 !important; color: #242424}

.bg-green1 {background-color: #055900 !important; color: #ebebeb}
.bg-green2 {background-color: #469b0b !important; color: #ebebeb}
.bg-green3 {background-color: #56ea0e !important; color: #242424}
.bg-green4 {background-color: #d2ffbc !important; color: #242424}

.bg-teal1,.bg-ent {background-color: #00674f !important; color: #ebebeb}
.bg-teal2,.bg-work {background-color: #008d7f !important; color: #ebebeb}
.bg-teal3 {background-color: #0febb0 !important; color: #242424}
.bg-teal4 {background-color: #beffea !important; color: #242424}

.bg-blue-soft {background: rgb(4,3,27); background: linear-gradient(90deg, rgba(4,3,27,1) 0%, rgba(14,7,36,1) 49%, rgba(4,23,46,1) 100%); color: #ebebeb}
.bg-blue1 {background-color: #171865 !important; color: #ebebeb}
.bg-blue2 {background-color: #1c5bb7 !important; color: #ebebeb}
.bg-blue3 {background-color: #2ba2fb !important; color: #242424} /* .bk-mark { background-color: #cde4ef !important} */
.bg-blue4 {background-color: #e0ecff !important; color: #242424}
.bg-blue-dark {
	background-color: #020f31;
	background-image: linear-gradient(0deg, #000613 0%, #09154c 55%, #00113d 100%);
}

.bg-orange1 {background-color: #cc6900 !important; color: #ebebeb}
.bg-orange2,.bg-perso {background-color: #f38205 !important; color: #ebebeb}
.bg-orange3 {background-color: #ffc900 !important; color: #242424}
.bg-orange4 {background-color: #fdeeb8 !important; color: #242424}

.bg-purple1 {background-color: #a900bb !important; color: #f0cbf8}

.bg-focus:hover { background-color: rgba(0, 156, 222, 1) !important; color: white !important; }
.bg-focus-black:hover { background-color: #464646 !important; color: white !important; }
.bg-focus-light:hover { background-color: #e8eef3 !important; color: #4c4242 !important;}
.bg-focus-danger:hover { background-color: #ff0000 !important; color: #ffffff !important;}

.bg-transp { background-color: transparent !important}
.bg-transp-dark { background-color: rgba(13, 14, 14, 0.62) !important}
.bg-transp-light { background-color: rgba(210, 210, 210, 0.5) !important}



.borline {border:1px solid lightgray !important}
.borline-dark {border:1px solid #78716a !important}
.borline-blue {border:1px solid #2670f0 !important}

/* Blemd mode - Experimental */
.blend-diference { style="mix-blend-mode: difference;" }
.blend-multiply {style="mix-blend-mode: multiply;" }
.blend-lighten {style="mix-blend-mode: lighten;" }
.blend-darken {style="mix-blend-mode: darken;" }

.cl-paper { color: rgba(255, 253, 251, 1) !important; }
.cl00 {background-color: rgba(32, 32, 32, 1) !important; color: white !important;}
.cl10,.cnavbar {background-color: rgba(60, 60, 60, 1) !important; color: white !important;}
.cl15 {background-color: rgba(74, 74, 74, 1) !important; color: #b3b3b3 !important;}
.cl20,.csidebar {background-color: rgba(95, 94, 85, 1) !important; color: rgba(205,205,199,1) !important;}
.cl30,.cheaderbar {background-color: rgba(136, 136, 134, 1) !important; color: rgba(205,205,199,1) !important;}
.cl40,.cworktitlebar {background-color: rgba(179, 178, 173, 1) !important; color: rgba(131,130,114,1) !important;}
.cl50,.cworksearckbar {background-color: rgba(205,205,199,1) !important; color: rgba(131,130,114,1) !important;}
.cl60,.cworkarea {background-color: rgba(230,230,227,1) !important; color: rgba(131,130,114,1) !important;}
.cl70 {background-color: rgba(240, 240, 240, 1) !important; color: rgba(131,130,114,1) !important;}
.cl80 {background-color: white !important; color: rgba(131,130,114,1) !important;}

.cl-work { color: #25B492 !important; }
.cl-perso,.cl-orange { color: #F7972A !important; }

.cl-app { color: rgba(206,5,56,1) !important; }
.cl-dwork { color: #18735d !important; }
.cl-dperso { color: #b57123 !important; }
.cl-maroon { color: maroon !important; }
.cl-green, .cl-credit { color: #20a217 !important; }
.cl-red, .cl-debit { color: #e42121 !important; }
.cl-yellow { color: #ffea00 !important; }
.cl-blue { color: #008dff !important; }
.cl-focus:hover {color: rgba(0, 156, 222, 1) !important; }
.cl-focus-red:hover {color: rgba(255, 0, 0, 1) !important; }
.cl-attention { -webkit-animation: cl-attchange 2s infinite; -moz-animation: cl-attchange 2s infinite; -o-animation: cl-attchange 2s infinite; -ms-animation: cl-attchange 2s infinite; animation: cl-attchange 2s infinite;}
	@-webkit-keyframes cl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@-moz-keyframes cl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@-ms-keyframes ccl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@-o-keyframes cl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@keyframes ccl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }

.cl-emboss {
	box-shadow: inset 3px 3px 3px 1px #6c6a6a;
}