::-webkit-scrollbar {background:#474344;}
::-webkit-scrollbar {width:23px;height:23px;}
::-webkit-scrollbar-button {width:23px;height:23px;
		background:rgba(44,41,42,1);border-radius:50%;border:6px solid rgba(71,67,68,1);}
/*.htmlscrollbar  ::-webkit-scrollbar-button:after {content:"";display:block;position:absolute;
	background:#fff;width:5px;height:5px;background-color:#f00;}*/
::-webkit-scrollbar-thumb {
	background-clip: padding-box;
	border:6px solid rgba(71,67,68,1);
	height:10px;width:10px;border-radius:10px;
	background-color:rgba(44,41,42,1);
min-height:50px;}
::-webkit-scrollbar-track {/*width:23px;height:23px;*/width:23px;height:23px;background:rgba(71,67,68,1);}
::-webkit-scrollbar-corner {background:rgba(71,67,68,1);border-bottom-right-radius:10px; }
/*::-webkit-resizer — the draggable resizing handle that appears at the bottom corner of some elements.*/




div.pagedata {width: 95%;margin: 0 auto;padding-top: 10px;
	height: calc(100vh - 64px);}
.edit div.projects.pagedata {width: 100%;padding-top: 0;}


div.pagedata {display: grid;padding-top: 10px;
	background: var(--back-darker);
	height: calc(100vh - 54px);box-sizing: border-box;
	grid-template-columns: auto;transition: .1s;
	grid-template-rows: auto 1fr 25px;}

div.pagedatawrapper {
	position:fixed;top:0;left:0;right:0;bottom:0;
	display: flex;align-items: center;justify-content: center;
	backdrop-filter: blur(6px);
}


div.params_wrap {padding: 0 10px 10px 10px}
div.params_wrap ul.params_nav {display: flex;justify-content: center;
	align-items: flex-start;list-style: none;}
div.params_wrap ul.params_nav li {margin-right: 4px}
div.params_wrap ul.params_nav li a {display: block; color: #fff;font-size: 16px;
	background: var(--back-medium);border-bottom: 2px solid var(--back-dark);;
	padding: 3px 10px;border-radius: 8px;color: #999}
/*div.params_wrap ul.params_nav li:first-child a {border-bottom-left-radius: 0;}*/

div.params_wrap ul.params_nav li a:hover {
	background: var(--back-light);text-decoration: none;color: #fff;}
div.params_wrap ul.params_nav li.selected a {
	background: var(--back-light);text-decoration: none;color: #fff;
	border-bottom-left-radius: 0;border-bottom-right-radius: 0;
	border-bottom: 2px solid var(--back-light);}

div.params_wrap ul.params_nav li a.hide {margin-left: 20px;
	background:url(../images/fancy_close.png) no-repeat 50% transparent;
	text-indent: -9000px;opacity: 0;pointer-events: none;
	}
div.params_wrap ul.params_nav li.selected ~ li a.hide {opacity: 1;pointer-events: auto;}


div.params_wrap div.params {background: var(--back-light);
	border-radius: 8px;height: auto;
	padding: 8px;box-sizing: border-box;transition: .2s;}
div.params_wrap div.params:empty {padding: 0px;height: 0;}




div.status_wrap {height: 23px;padding:0 2px;display: flex;
	justify-content: space-between;box-sizing: border-box;
	gap: 2px;margin: 2px 0 2px;}
div.status_wrap div.status {height: 23px;line-height: 25px;font-size: 12px;
	flex-grow: 2;text-transform: uppercase;
	background: var(--back-light);
	border-radius: 3px;
	display: flex;justify-content: flex-start;align-items: stretch;}
div.status_wrap div.status>div {height: 23px;padding: 0 10px 0;border-right: 1px solid var(--back-light);
	font-size: 10px;color: var(--white_60)}
div.status_wrap div.status>div span {display: inline-block;margin:0 4px}
div.status_wrap div.status>div em {color: var(--white);font-weight: inherit;font-style: normal;}
div.status_wrap div.status>div b {font-style: 600;}
div.status_wrap div.status>div span.focus {color: #999;padding-left: 4px}

div.status_wrap div.timerWrap {justify-self: flex-end;display: flex;
	justify-content: flex-start;align-items: flex-start;
	font-size: 12px;line-height: 23px;background: var(--blue_plain);
	margin:0 0 0 0;border-radius: 2px;
position: relative;}
div.status_wrap div.timerWrap div.load {}
div.status_wrap div.timerWrap div.load select {height: 23px;
    font-size: 12px;
    line-height: 23px;
    /*color: #fff;*/
    color: rgb(138,150,156);
    background: url(../images/input_sel_minus.png) no-repeat right 5px top 55% var(--blue_plain);
    border: 0;
    box-sizing: border-box;
    padding: 0 20px 0 10px;
    border-radius: 2px;
    max-width: 150px;
    -webkit-appearance: none;}
div.status_wrap div.timerWrap div.thistimer .timer {width: 80px;
	text-align: center;position: relative;font-size: 12px;color: rgb(138,150,156);
	font-family: Consolas,monaco,monospace;;}
div.status_wrap div.timerWrap div.thistimer {display: flex;}
div.status_wrap div.timerWrap div.thistimer span {display: block;position: relative;z-index: 3;
		background: var(--blue_plain);}
div.status_wrap div.timerWrap div.thistimer a.settime {position: absolute;
    bottom: -25px;
    text-align: center;
    font-family: Manrope;
    color: #fff;
    line-height: 18px;
    font-size: 10px;
    width: 80px;
    left: calc(50% - 30px);
    background: var(--blue_plain);
    padding: 0 10px;
    box-sizing: border-box;
    box-shadow: 0 0 10px rgb(0 0 0 / 40%);
    z-index: 2;
	*/}
div.status_wrap div.timerWrap div.thistimer.ispaused div.timer:hover a.settime {bottom: 100%;}

div.timerform {position: absolute;
	bottom: -50px;
    text-align: center;
    font-family: Manrope;
    color: #fff;
    line-height: 18px;
    font-size: 10px;
    left: 0;
    background: var(--blue_plain);
    padding: 0 5px;
    box-sizing: border-box;
    /*box-shadow: 0 0 10px rgb(0 0 0 / 40%);*/
    z-index: 2;
	/*transition: .1s;*/
	display: flex;justify-content: center;
	border-bottom: 1px solid var(--back-dark);}
	div.timerform div.inp {padding: 0 4px;background-color: var(--back-dark);
		margin: 0 4px;}
div.timerform a.apply {padding: 0 4px;color:rga(123,189,216);font-size: 9px;font-weight: 600;}
div.timerform input {width: 14px;font-size: 12px;color: #fff;
    background: transparent;font-family: monospace;
    -webkit-appearance: none;text-align: center;
    border: 0;}

div.timerform input::-webkit-inner-spin-button,
div.timerform input::-webkit-outer-spin-button { 
      -webkit-appearance: none; }

div.status_wrap div.timerWrap div.thistimer.ispaused:hover  div.timerform {bottom: 100%;}
/*div.status_wrap div.timerWrap div.thistimer.ispaused  div.timerform {bottom: 100%;}*/


/*.timeron div.timerform {bottom: 100%;}
.timeron div.status_wrap div.timerWrap div.thistimer div.timer:hover a.settime {bottom: -25px;}*/

div.thistimer .options {display: flex;align-items: center;justify-content: center;}
div.thistimer .options a {width: 30px;height: 23px;opacity: 0.8;text-indent: -9000px;
	background-repeat: no-repeat;background-position: 50%;}
div.thistimer.isrecording .options a.record {pointer-events: none;opacity: .35;}
div.thistimer.ispaused .options a.pause {pointer-events: none;opacity: .35;}
div.thistimer.isrecording .options a.download {pointer-events: none;opacity: .35;}
div.thistimer.isrecording .options a.delete {pointer-events: none;opacity: .35;}

div.thistimer.new .options a.download {pointer-events: none;opacity: .35;}
div.thistimer.new .options a.delete {pointer-events: none;opacity: .35;}

div.thistimer .options a.record {background-image: url(../images/srt_rec.png);}
div.thistimer .options a.pause {background-image: url(../images/srt_pause.png);}
div.thistimer .options a.download {background-image: url(../images/srt_download.png);}
div.thistimer .options a.delete {background-image: url(../images/srt_delete.png);}

div.thistimer .options a.record {background-image: url(../images/srt_rec.png);}
div.thistimer.ispaused .options a.record:hover {opacity: 1;}
div.thistimer.isrecording .options a.record {opacity: 1;}
div.thistimer.isrecording .options a:hover {opacity: 1;}



div.files_list {max-width: 200px;}

div.gridoptions {display: block;}
div.gridoptions h4 {text-align: center;font-size: 10px;margin: 0 0;
	border-bottom:1px solid var(--back-dark);
	height: 36px;display: flex;align-items: center;justify-content: center;}

div.project.columns {height: auto;box-sizing: border-box;
    overflow-y: hidden;background: transparent;overflow-x: hidden;
    gap: 2px;margin: 0 2px 0px;position: relative;
	display: flex;align-items: stretch;
	justify-content: flex-start;}

div.project.columns > div.desktoppreview {
	position: absolute;
	z-index:1000;
	box-sizing: border-box;
	border:4px solid #fff;
	border-radius:5px;
	background: rgba(0,0,0,.9);
	box-shadow: 0 0 0 rgba(0,0,0,1);
	top:10px;left:10px;right:10px;bottom:10px;
}


div.column.options {width: 48px;min-width: 48px;
	background-color: var(--back-light);
	border-radius: 3px;
	transition: .2s;}
div.grid_wrap {flex-grow: 2;position: relative;
	/*max-width: calc(100% - 108px);*/
	background: url(../images/grid_back_top.png) repeat-x top;
	height: 100%;
	overflow-x: auto;overflow-y: scroll;}

.hideSideButtons div.column.options {display: none;}
/*.hideSideButtons div.flex-headers .selectinput {display: none;}*/
/*div.grid_wrap:before {content: "";display: block;position: sticky;
top: 0;left: 0;right: 0;height: 36px;background: var(--back-light);
z-index: 9;}*/

.gridoptions {display: block;}
div.gridoptions>a {
	z-index: 10;
	font-size: 10px;display:flex;height:28px;margin:3px auto 0;padding:0;
	align-content:center ;
	align-items: center;
	transition: .2s;
	/*text-indent:-9000px;*/
	background: 50% no-repeat;opacity:.7;position:relative;
	/*background-size:contain;*/position:relative;}
/*div.gridoptions>a span {width: 0;padding: 0;overflow-x: hidden;display: block;
	box-sizing: border-box;transition: .2s;}
div.gridoptions>a span em {display: block;font-style: normal;color: #999}*/
.gridoptions a:hover {opacity:1;text-decoration: none;}
.gridoptions span.empty {display:block;margin: 5px 0px;height: 1px;background: var(--back-dark);}
.gridoptions a.disabled {opacity:.3;cursor: auto;}


/*div.gridoptions a.cells span {display: none;position: relative;}*/

/* Tooltip text */
a.tooltip {position: relative;}
a.tooltip span {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  /* Position the tooltip text - see examples below! */
  position: absolute;
  top: 10%;
  z-index: 10;
	box-shadow: 0 0 10px rgba(0,0,0,1);}
a.tooltip span em {display: block;}
a.tooltip span {left: 45px;}
.cells a.tooltip span {right: 45px;left: auto}

/*.rows a.tooltip span {}*/

/* Show the tooltip text when you mouse over the tooltip container */
div.gridoptions>a:hover span {
  visibility: visible;
}

/*input:checked.hint_cells ~ div.project div.column.options.cells {width: 120px;min-width: 120px;}
input:checked.hint_rows ~ div.project div.column.options.rows {width: 120px;min-width: 120px;}
input:checked.hint_cells ~ div.grid_wrap {	max-width: calc(100% - 174px);}
input:checked.hint_cells ~ input:checked.hint_rows~ div.grid_wrap {	max-width: calc(100% - 240px);}




input:checked.hint_cells ~ div.project div.column.options.cells div.gridoptions>a {
	background-position: right 4px top 50%;}
input:checked.hint_cells ~ div.project div.column.options.cells div.gridoptions>a span {
	width:187px;padding: 0 36px 0 0;overflow-x: hidden;display: block;text-align: right}


input:checked.hint_rows ~ div.project div.column.options.rows div.gridoptions>a {
	background-position: right 4px top 50%;}
input:checked.hint_rows ~ div.project div.column.options.rows div.gridoptions>a span {width:187px;padding: 0 36px 0 0;overflow-x: hidden;display: block;text-align: right}
*/


div.headersWrap {position: sticky;top: 0;z-index: 10;
	/*box-shadow: 0 4px 10px rgba(0,0,0,1);*/
	box-shadow: 0px 9px 5px 0px rgba(0,0,0,0.65);
	margin: 0 auto;}
.grid-headers {display: grid;column-gap: 1px;}
.grid-headers>div {margin: 0;padding: 0 2px;display: flex;
	justify-content: space-between;
	align-items: center;font-size: 12px;
	background-color: var(--back-medium);}
.grid-headers>div h2 {margin: 0;padding: 4px 6px 4px 6px;}

.textWrap {height: 100%;width: 100%;}

.gridfontsize {
    position: absolute;
    display: flex;justify-content: flex-start;
    bottom: 24px;
    left: 1px;
    font-size: 20px;
    font-weight: 600;
    z-index: 2;
}
.gridfontsize a {width:23px;height:23px;display: grid;place-content: center;
	font-size:20px;color:rgba(255,255,255,.5);background: var(--back-light);border:1px solid var(--back-darker);
	border-radius: 2px;
}
.gridfontsize a:hover {text-decoration: none;color:rgba(255,255,255,1);}

.grid-text {display: grid;
	width: 100%;
	/*height: 100%;*/
	/*gap: 1px 1px;*/
	/*font-family: Arial;*/
	position: relative;
	/*overflow-y: scroll;*/
	/*overflow-x: hidden;*/
}
.grid-text>* {margin-bottom: 0;border-bottom: 1px solid rgba(255,255,255,.3);}
.grid-text div.cell:hover {color: var(--forecolor);}
.grid-text div.numbers {font-size: 120%;}
.grid-text div.comments {color: #}
.grid-text>* {background-color: #222;margin: 0;padding: 4px;}
.grid-text div.cell {color: var(--forecolor_70);font-weight: 300;font-size: 15px;
	padding: 6px;overflow: hidden;position: relative;}


.grid-text div.cell.text::after {content: "";pointer-events: none;position: absolute;
	left: 140px;right: 0;top: 0;bottom: 0;background: rgba(255,0,0,.2);}


.editColumns {}

.editColumns>div {padding: 0;font-size: 14px;color: #fff;margin-bottom: 2px;}
.editColumns>div>label {display: block;margin: 0 0 2px;background-color:var(--back-medium);border-radius:5px;
	font-size: 14px;color: #fff;cursor: pointer;display: block;padding:5px;}
.editColumns>input {display: none;}
.editColumns input+div div.data {display: none;}
.editColumns input:checked+div div.data {display: block;padding:5px 0 20px 5px;}

@keyframes highlight {
    0% {
        color: var(--forecolor)
    }
    50% {
        color: var(--forecolor)
    }
    100% {
        color: inherit;
    }
}

.changedData {
    animation: highlight 1s;
}

.flex-headers {display: flex;align-items: stretch;position: relative;
	justify-content: flex-start;margin-bottom: 1px;
    background-color: rgba(63,59,60,1);
	border-bottom: 1px solid var(--back-lighter);
	padding-left: 40px;}
.flex-headers div.cellheader{background: var(--back-light);padding:  0 0 0;
	color: var(--forecolor);font-weight: 300;font-size: 15px;
	box-sizing: border-box;border-right: 1px solid var(--back-dark);
	/*overflow: hidden;*/position: relative;white-space: nowrap;}
/*.flex-headers>div.cell {resize: horizontal;}*/
.flex-headers div.h {/*display: flex;justify-content: space-between;align-items: center	;*/
	position: relative;padding: 0 10px 0 6px;display: flex;justify-content: space-between;
	align-items: center;height: 35px;}
.flex-headers div.h h2 {margin: 0;padding: 0 4px;font-size: 11px;
		flex-grow: 2;color: rgba(255,255,255,.5);
		box-sizing: border-box;height: 32px;line-height: 32px;
		text-transform: uppercase;}
.flex-headers div.h:hover h2 {color: rgba(255,255,255,1);}
.flex-headers div.h label.togglecolumnoptions {width: 10px;height: 32px;
	position: relative;cursor: 	pointer;display: none;}
.flex-headers div.h:hover label.togglecolumnoptions {display: block;}
.flex-headers div.h label.togglecolumnoptions span {width: 3px;height:3px;
	background: var(--white_60);border-radius: 50%;z-index: 29;
	position: absolute;right: 0px;}
.flex-headers div.h label.togglecolumnoptions span:nth-child(1) {top: calc(50% - 8px);}
.flex-headers div.h label.togglecolumnoptions span:nth-child(2) {top: calc(50% - 1.5px);}
.flex-headers div.h label.togglecolumnoptions span:nth-child(3) {top: calc(50% + 5px);}

/*.flex-headers div.h div.hover {display: none;position: absolute;
	top: 0;right: 4px;height:height: 32px;line-height: 32px;
	background:var(--back-light); ;}
.flex-headers div.h:hover div.hover {display: block;}
.flex-headers input.showfacts:checked + div div.h div.hover {display: block;background:var(--back-medium);}
*/
.flex-headers div.h div.columnoptions {display: none;position: absolute;
	top: 0px;
	left: calc(100% - 20px);
	left: 0;
	background:var(--back-darker);padding: 5px 12px 10px 12px;
	z-index: 30;border-radius: 2px;font-size:11px;line-height: 1.6;
	/*border: 1px solid var(--back-darker);*/
	box-shadow: 0px 0px 7px 0px rgba(19, 19, 19, 0.44);}

.flex-headers div.h div.columnoptions a {color:var(--white_60);display: block;}
.flex-headers div.h div.columnoptions a:hover {color:var(--white);text-decoration: none;}

.flex-headers div.h input.togglecolumnoptions {display: none;}
.flex-headers div.h input.togglecolumnoptions:checked+div.columnoptions {display: flex;
	flex-wrap: wrap;}
.flex-headers div.h div.columnoptions>* {width:100%;}


.flex-headers div.h div.columnoptions label {color: var(--bluelink)}
.flex-headers div.h div.columnoptions label em{ display: block;font-style: normal;font-size: 400; }
.flex-headers div.h div.columnoptions label span{display: none;}
/*.flex-headers input.showfacts:checked + div div.h div.hover {display: block;background:var(--back-medium);}*/



/*.flex-headers>div div.h label.editCol {background-repeat: no-repeat; padding-right: 20px;width: 100%;height: 28px;line-height: 28px;cursor: pointer;display: block;box-sizing: border-box;}
.flex-headers>div div.h label.editCol span {display: inline;background-color:var(--back-light);}
.flex-headers>div div.h label.editCol:hover {background:url(../images/edit_on.png) no-repeat 100% 50%}*/

/*.flex-headers input.showfacts:checked + div.cell div.h label.editCol {background-image:url(../images/fancy_close.png)}*/

.flex-headers input.showfacts {display:none;}
.flex-headers input.showfacts + div.cell div.data {display: none;position: absolute;top: 100%;left: 0;width: 100%;
	min-width: 300px;box-shadow: 0 10px 10px rgba(0,0,0,.4);
	padding: 8px 8px;background:var(--back-medium);
	box-sizing: border-box;}
.flex-headers input.showfacts:checked + div.cell {background:var(--back-medium);}
.flex-headers input.showfacts:checked + div.cell {overflow: visible;}
.flex-headers input.showfacts:checked + div.cell div.data {display: block;}

.flex-headers input.showlimit {width: 90%}

/*div.columnresizer {position:absolute;height: 100%;top: 0;bottom: 0;width: 3px;background: red;
	right: 0;}
*/

input.showlimit {display: none;}
/*.flex-text {width: 5000px}*/
.flex-text .row {display: flex;align-items: stretch;justify-content: flex-start;
	/*margin-bottom: 1px;*/border-bottom: 1px solid var(--back-lighter);
	position: relative;
	overflow-x: hidden;width: 100%;box-sizing: border-box;
	padding-left: 40px;}

/*.hideSideButtons .flex-text .row {padding-left: 0px;}
.hideSideButtons .flex-headers {padding-left: 0px;}*/

input.selectrow {display: none;}
div.flex-headers div.selectinput {width: 25px;display: flex;align-items: center;justify-content: center;
	position: absolute;z-index: 8;
	top: calc(50% - 9px);left: var(--selectInputLeft);
	display: block;}
div.row div.selectinput {width: 25px;display: flex;align-items: center;justify-content: center;
	position: absolute;z-index: 8;
	top: 5px;left: var(--selectInputLeft);
	display: none;}

div.row:hover div.selectinput {display: block;}
/*.hideSideButtons div.row:hover div.selectinput {display: none;}*/

input.selectrow:checked+div.row div.selectinput {display: block;}
div.selectinput label,div.selectinput a.selall {
	display: block;
	width: 18px;
    height: 18px;
    border: 0;
    border-radius: 3px;
    cursor: pointer;
    background-color: #585354;
    box-shadow: 0 0 5px rgba(0,0,0,.5);
}
input.selectrow:checked+div.row label:after {
    content: "";
    display: block;
    height: 18px;
    width: 18px;
    background: url(../images/check.png) no-repeat 50%;
}
div.selectinput a.checked:after {
    content: "";
    display: block;
    height: 18px;
    width: 18px;
    background: url(../images/check.png) no-repeat 50%;
}

.flex-text .rowWrap {position: relative;margin: 0 auto;}
.flex-text .rowWrap .mobileusage {position: absolute;
    top: 0;
    left: var(--flex-text-width);
    /* right: 0; */
    height: 100%;
    z-index: 7;
    padding: 5px;
    box-sizing: border-box;}
.flex-text .rowWrap .mobileusage a {display: block;
	position: relative;
	width:50px;height:100%;
	border-radius: 10px;text-indent: -9000px;
	background-color: green;margin:0 0 0 4px}
.flex-text .rowWrap .mobileusage a.hidethis {
	background-color: red;display: none}

.projectionOn .flex-text .rowWrap.currentrow .mobileusage a.hidethis {
	display: block;
}
.projectionOn .flex-text .rowWrap.currentrow .mobileusage a.showthis {
	display: none;
}




.flex-text .rowWrap:nth-child(odd) {
    background-color: rgba(67,62,63,1);}
.flex-text .rowWrap:nth-child(even) {
    background-color: rgba(63,59,60,1);}

.flex-text .rowWrap.currentrow:after {position: absolute;
    content: "";
    top: -2px;
    left: 0px;
    right: 0px;
    bottom: -1px;
    border-style: solid;
    border-image: linear-gradient(to left, rgba(145,65,42,1) 0%, rgba(149,36,55,1) 50%, rgba(145,65,42,1) 100%);
    border-image-slice: 1;
    border-width: 4px;
    z-index: 9;
    pointer-events: none;}
.projectionOn .flex-text .rowWrap.currentrow:after {
    border-style: solid;
    border-image: linear-gradient(to left, rgba(28,120,166,1) 0%, rgba(28,171,159,1) 50%, rgba(28,120,166,1) 100%);
    border-image-slice: 1;
    border-width: 4px;
    background-color: rgba(28,120,166,.05);
}
.projectionOn .flex-text .rowWrap.currentrow .row>div.cell {color: var(--forecolor);}



.flex-text input.selectrow:checked + .row {
    background-color: var(--back-dark)}


:root {
  --gridfontsize: 15px;
  --flex-text-width: 100%;
}

.flex-text .row>div.cell{background: transparent;padding: 6px;
	border-right: 1px solid var(--back-lighter);
	color: var(--forecolor_70);font-weight: 300;
	font-size: var(--gridfontsize);
	font-family: Arial;
	overflow: auto;
	overflow-x: hidden;position: relative;white-space: nowrap;
	box-sizing: border-box;}
.flex-text .row>div.cell section div span {
	font-size: var(--gridfontsize) !important;}

.flex-text .row>div.cell.editing{background: var(--back-dark);}
.flex-text .row>div.cell .celldata {position: relative;z-index: 5;min-height: 20px;}

.flex-text .row>div.cell.editing .celldata {display: none;}
.flex-text .row>div.cell.editing textarea {width:100%;min-height:100%;
	color: var(--forecolor_70);font-weight: 300;
	position: relative;z-index: 2;
	font-size: var(--gridfontsize);
	background: transparent;
	font-family: Arial;
	overflow: auto;
	overflow-x: hidden;
	white-space: nowrap;
	box-sizing: border-box;
	border:0;
}
.flex-text .row>div.cell.editing textarea::selection {background-color:rgba(60, 80, 88,1);}

.flex-text .row>div:hover {color: var(--forecolor);}
/*wordwrap*/
.flex-text .row>div.ww {white-space: normal;}
/*rtl*/
.flex-text .row>div.rtl {direction:rtl;text-align: right;white-space: normal;}
/*Show limits*/

div.editButtons {position: absolute;
	transform-origin: 0 0;transform: scale(0);transition: .1s;
	height: 24px;line-height: 24px;background: rgba(60,80,88,1);/*var(--blue_plain);*/
	padding: 0px 4px;box-shadow: 0 0 7px 0 rgba(19,19,19,0.44);
	box-sizing:border-box;z-index: 20;
	border-radius: 2px;display: flex;justify-content: space-between;align-items: center;}
div.editButtons.on {transform: scale(1);}

.editButtons a {padding: 0;line-height: 1.2;height: 24px;min-width: 15px;margin: 0 3px;
	background-repeat: no-repeat;background-position: 50%;text-indent: -9000px;opacity: .6;}
.editButtons a:hover {opacity: 1}
.editButtons a.editor_bold {background-image: url(../images/cell_bold.png);}
.editButtons a.editor_italic {background-image: url(../images/cell_italics.png);}
.editButtons a.editor_role {background-image: url(../images/cell_role.png);}
.editButtons a.editor_comment {background-image: url(../images/cell_brackets.png);width: 20px;}
.editButtons a.editor_placeholder {background-image: url(../images/cell_linethrough.png);}
.editButtons a.editor_setClass {height:12px;font-size:9px;
	color:rgba(255,255,255,.8);
	    vertical-align: middle;
}


.editButtons a.editor_clearformat {background-image: url(../images/reset.png);width: 35px;}

.editButtons span.div {height: 15px;width: 1px; margin: 0 5px;background-color: rgba(255,255,255,.2);}
.editButtons:after{content: "";display: block;position: absolute;
    content: "";
    display: block;
    position: absolute;
    top: 100%;
    left: 20px;
    width: 0;
    height: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-top: 9px solid rgba(60,80,88,1);/*var(--blue_plain);*/
}


.editButtons div.editor_setClass {position: relative;}
.editButtons div.editor_setClass ul {display:none;
	position: absolute;
	bottom:100%;left:-3px;width:80px;padding:2px 0;margin:0;
	list-style:none;font-size:11px;background-color: #000;
	border-radius:4px;}
.editButtons div.editor_setClass ul:hover {display:block;}
.editButtons div.editor_setClass ul li {padding:0px;margin:1px 0 0 0;display:block;}
.editButtons div.editor_setClass ul li a {display: block;opacity: 1;
		text-decoration: none;line-height:22px;
		text-indent: 0;padding:1px 3px !important;margin:0 !important;font-size:14px !important;
		font-family:Arial !important;}
.editButtons div.editor_setClass ul li a:hover {text-decoration: underline;}
.editButtons div.editor_setClass:hover ul {display:block;}

.flex-text .row>div.cell .celldata span.hidden {color: #999900;}
.flex-text .row>div.cell .celldata span.hidden:before {content: " {";}
.flex-text .row>div.cell .celldata span.hidden:after {content: "} ";}
.flex-text .row>div.cell .celldata span.placeholder {text-decoration: line-through;opacity: .7}
.flex-text .row>div.cell .celldata div span.role {text-transform: uppercase;font-weight: 700 !important;font-family: 'Arial Narrow' !important;}
/*.flex-text .row>div.cell .celldata span.role:first-of-type:after {content: ":";}*/
.flex-text .row>div.cell .celldata div span.role:first-child:not(:last-child) + :not(span.role)::after {content: ":";}

.flex-text div.cell div.limit {display: block;position: absolute;overflow: hidden;height:0;
	left: 0;right: 0;bottom: 0;top: 0;
	pointer-events: none;
	display: flex;gap: 0;align-items: stretch;}
.flex-text div.cell div.limit div.red {background: rgba(0,0,0,.25);
	flex-grow: 2;}
.flex-text div.cell div.limit div.tr {background: transparent;min-width: 20px;}

.flex-headers div.cell div.limit {display: block;position: relative;overflow: hidden;height:0;
	/*left: 0;right: 0;bottom: 0;top: 0;*/
	margin: 0;border-top: 1px solid var(--back-dark);
	display: flex;gap: 0;align-items: stretch;}
.flex-headers div.cell div.limit div.red {background: rgba(250,0,0,.25);
	flex-grow: 2;}
.flex-headers div.cell div.limit div.tr {background: transparent;min-width: 20px;}


.flex-text div.cell:before {content: "";
	pointer-events: none;
    display: block;
    position: absolute;
    z-index: 0;
    top: 1px;
    left: 0px;
    bottom: 1px;
    right: 1px;
	}

.flex-text div.cell.selected:before {content: "";
    background: var(--back-dark);
	}


.flex-text div.cell.focus:before {content: "";
	pointer-events: none;
    display: block;
    position: absolute;
    z-index: 1;
    top: 1px;
    left: 0px;
    bottom: 1px;
    right: 1px;
    /*background: #000; */
    border: 2px dashed rgba(149,36,55,1);
	}

.flex-text div.cell.copied:after {content: "";
	pointer-events: none;
    display: block;
    position: absolute;
    z-index: 1;
    top: 1px;
    left: 0px;
    bottom: 1px;
    right: 1px;
    border:2px dotted orange;
	}

.flex-text div.cell.foundin:after {content: "";
	pointer-events: none;
    display: block;
    position: absolute;
    z-index: 1;
    top: 1px;
    left: 0px;
    bottom: 1px;
    right: 1px;
    border:2px dotted green;
	}
.flex-text div.cell.foundin.nowfound:after {
	background:rgba(190,0,0,.5);
}







textarea.copypaste {width: 100%;height: 600px;
font-size: 12px;font-family: arial;white-space: no-wrap;overflow-x: hidden;}



div.gridoptions.cells>a.merge {background-image:url(../images/sdl_merge.png);}
div.gridoptions.cells>a.split {background-image:url(../images/sdl_split.png);}
div.gridoptions.cells>a.duplicate {background-image:url(../images/sdl_duplicate.png);}
div.gridoptions.cells>a.moveUp {background-image:url(../images/sdl_move_up.png);}
div.gridoptions.cells>a.moveDown {background-image:url(../images/sdl_move_down.png);}
div.gridoptions.cells>a.insertBefore {background-image:url(../images/sdl_insert_before.png);}
div.gridoptions.cells>a.insertAfter {background-image:url(../images/sdl_insert_after.png);}
div.gridoptions.cells>a.delete {background-image:url(../images/sdl_delete.png);}
div.gridoptions.cells>a.empty {background-image:url(../images/sdl_empty.png);}
div.gridoptions.cells>a.import {background-image:url(../images/sdl_empty.png);}
div.gridoptions.cells>a.copy {background-image:url(../images/copy.png);}
div.gridoptions.cells>a.paste {background-image:url(../images/paste.png);}

div.gridoptions.rows>a.merge {background-image:url(../images/sdr_merge.png);}
div.gridoptions.rows>a.split {background-image:url(../images/sdr_split.png);}
div.gridoptions.rows>a.duplicate {background-image:url(../images/sdr_duplicate.png);}
div.gridoptions.rows>a.moveUp {background-image:url(../images/sdr_move_up.png);}
div.gridoptions.rows>a.moveDown {background-image:url(../images/sdr_move_down.png);}
div.gridoptions.rows>a.insertBefore {background-image:url(../images/sdr_insert_before.png);}
div.gridoptions.rows>a.insertAfter {background-image:url(../images/sdr_insert_after.png);}
div.gridoptions.rows>a.delete {background-image:url(../images/sdr_delete.png);}
div.gridoptions.rows>a.empty {background-image:url(../images/sdr_empty.png);}



div.limitbord {position: fixed;top: 0;bottom: 23px;left: 50%;
	z-index: 100;opacity: 00;
	width: 1px;border-right: 1px dashed var(--white);}
div.limitbord.on {opacity: 1;}


ul.exporttotxt {margin: 0 0 20px 20px;list-style: none;}
ul.includecolumns {margin: 0 0 20px 20px;list-style: none;}
ul.exporttotxt {margin: 0 0 20px 20px;list-style: none;}

form>div ul.includecolumns label {display: inline-block;}
form>div ul.includecolumns label:after {display: none;}
form>div ul.exporttotxt label {display: inline-block;}

form>div ul.importword {list-style: none;}
form>div ul.importword label {display: inline-block;}
form>div ul.importword label:after {display: none;}


form>div ul.import {list-style: none;width: 100%;}
form>div label.inputfile {display: block;width: auto;
	cursor: pointer;
	margin: 2px 0;
    color: #ccc;
    background: var(--back-light);
    padding: 2px 4px;}
form>div label.inputfile:hover {color: #fff;}
form>div label.inputfile span {display: block;}
form>div label.inputfile span.selected {text-align: right;color: #fff;}
form>div label.inputfile input {display: none;}
form>div label.inputfile:after {display: none;}

form>div.importword {align-items: center;}





.editor_wrap {position: absolute;top: 0;left: 0;width: 500px;height: 200px;
	border: 4px solid #fff;background: #000;z-index: 9}

.editor_wrap textarea {width: 100%;height: 70px;
		font-family: Arial;font-size: 12px;}



.contextMenuWrap {position: fixed;display: none;
	z-index: 10000;max-width: 150px;
	padding: 6px 0;border-radius: 2px;
	background-color: var(--back-darker);
	font-size: 11px;transition: .1s;transform: scale(0);transform-origin: 1,1;
	box-shadow: 0px 0px 7px 0px rgba(19, 19, 19, 0.44);}
.contextMenuWrap.visible {display: block;transform: scale(1);}
.contextMenuWrap ul {list-style: none;}
.contextMenuWrap ul li {padding:0}
.contextMenuWrap ul li a {padding: 3px 10px 3px 20px;line-height: 1.2;
	color: var(--white_60);font-weight: 500;display:block;}
.contextMenuWrap ul li a:hover {color: var(--white);}
.contextMenuWrap ul li.disabled a {color: var(--white_30);pointer-events: none;}



div.install {height: 54px;padding:0 16px;display: none;
	align-content: center;align-items: center;}
div.install.on {display: flex}
div.install a {font-size:12px;display: block;padding:5px 8px;
	font-weight:600;color:#333;border-radius:10px;background: rgb(210,210,210);box-shadow: 0 0 10px rgba(0,0,0,1);}
div.install a:hover {text-decoration: none;background-color: #fff;color:var(--bluelink);box-shadow: none;}


div.extendedEditor_wrap {position: absolute;
	bottom:10px;left:0;right:0;}
div.extendedEditor {position: relative;
	margin:0 autol;display: flex;
	border:4px solid #fff;box-shadow: 0 0 20px rgba(0,0,0,1);
	align-items: flex-start;justify-items: space-between;}
div.extendedEditor div {width:50%;}



/*


.inputfile::-webkit-file-upload-button {
  visibility: hidden;
}
.inputfile::before {
  content: 'Select some files';
  display: inline-block;
  background: linear-gradient(top, #f9f9f9, #e3e3e3);
  border: 1px solid #999;
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 10pt;
}
.inputfile:hover::before {
  border-color: black;
}
.inputfile:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}
*/
/*input[type=range] {
  -webkit-appearance: none;
  margin: 18px 0;
  width: 100%;
  background: transparent;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: var(--back-light);
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -14px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: var(--back-light);
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: var(--back-light);
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #2a6495;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: var(--back-light);
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: var(--back-light);
}
input[type=range]:focus::-ms-fill-upper {
  background: var(--back-light);
}*/