
.picker {
	position: fixed !important;
	height: 100% !important;
	width: 100% !important;
	top: 0px !important;
	left: 0px !important;
	z-index: 100005 !important;
	
}

div.context_menu_cover {
	position: fixed;
	z-index: 99999;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	
	background-color: rgba(0, 0, 0, 0.0);
	
	display: flex;
	justify-content: center;
	align-items: center;
}

div.context_menu_window {
	position: fixed;
	padding: 0px;
	background-color: white;
	border-style: solid;
	border-width: 1px;
	border-color: #999999;
}

div.context_menu_window label {
}

div.context_menu_window button {
	display: inline-block;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	
	font-size: 0.9em;
	color: #232323;
	background: none;
	white-space: normal;
	
	padding: 4px;
	padding-left: 1em;
	padding-right: 0.25em;
	margin: 0px;
	min-width: 64px;
}

div.context_menu_window button:hover {
	background: #a0b5d2;
}

div.context_menu_window button:active {
	background: #E9A385;
	color: rgb(250,250,250);
}

a, abbr, acronym, address, applet, area, article, aside,
audio, b, basefont, bdi, bdo, big, blockquote, body,
button, canvas, caption, center, cite, code, col, colgroup,
data, datalist, dd, del, details, dfn, dialog, dir, div,
dl, dt, em, embed, fieldset, figcaption, figure, font,
footer, form, frame, frameset, h1, h2, h3, h4, h5, h6,
head, header, html, i, iframe, input, ins,
kbd, label, legend, li, link, main, map, mark, meta,
meter, nav, noframes, noscript, object, ol, optgroup, option,
output, p, param, picture, pre, progress, q, rp, rt,
ruby, s, samp, section, select, small, source, span,
strike, strong, style, sub, summary, sup, svg, table,
tbody, td, template, textarea, tfoot, th, thead, time,
title, tr, track, tt, u, ul, var, video, wbr,
area, base, br, col, embed, hr, img, input, keygen,
link, meta, param, source, track, wbr {
	tab-size: 4;
	margin: 0px;
	padding: 0px;
	font-size: 100%;
	font-family: monospace;
	vertical-align: center;
	text-decoration: none;
	
	border-width: 0px;
	border-collapse: collapse;
	border-spacing: 0;
	border-color: #a0b5d2;
	border-radius: 0px;
	
	line-height: 1;
	list-style: none;
	
	quotes: none;
	
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

input[type=range] {
	border: none;
	background: none;
	width: 94%;
	min-width: 65px;
	margin-left: 0.3125em;
	margin-right: 0.3125em;
	margin-top: 0.1em;
	margin-bottom: 0.1em;
}

@media(pointer:coarse) {
	input[type=range] {
		height: 25px;
	}
}

input[type=range]::-webkit-slider-runnable-track {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	height: 0.3125em;
	padding: 0em;
	
	margin-bottom: 0.1875em;
	
	cursor: default;
	line-height: 1;
	border-color: #323232;
	border-width: 1px;
	border-style: solid;
	background: #d0dff2;
	border-radius: 0.5em;
}
input[type=range]::-moz-range-track {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	height: 0.1875em;
	padding: 0em;
	
	cursor: default;
	line-height: 1;
	border-color: #323232;
	border-width: 1px;
	border-style: solid;
	background: #d0dff2;
	border-radius: 0.5em;
}

@media(pointer:coarse) {
	input[type=range]::-webkit-slider-runnable-track {
		height: 4px;
	}
	input[type=range]::-moz-range-track {
		height: 4px;
	}
}

input[type=range]::-webkit-slider-thumb {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	width: 0.5em;
	height: 1.125em;
	margin-top: -0.5em;
	border-style: solid;
	border-width: 1px;
	border-radius: 0.125em;
	border-color: rgba(0, 0, 0, 0.2);
	background: rgb(240, 240, 240);
}
input[type=range]::-moz-range-thumb {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	width: 0.375em;
	height: 1em;
	border-style: solid;
	border-width: 1px;
	border-radius: 0.125em;
	border-color: rgba(0, 0, 0, 0.2);
}

@media(pointer:coarse) {
	input[type=range]::-webkit-slider-thumb  {
		margin-top: -9px;
		height: 22px;
		width: 16px;
		border-radius: 3px;
	}
	input[type=range]::-moz-range-thumb {
		height: 22px;
		width: 16px;
		border-radius: 3px;
	}
}

input[type=text] {
	border-bottom-style: solid;
	border-bottom-width: 2px;
	background: none;
	margin: 5px;
	margin-left: 10px;
	padding-left: 10px;
}

input[type=text].number {
	font-size: 10px;
	width: 35px;
	padding-left: 0px;
	margin-left: 2px;
}

input[type=text]::placeholder {
	font-style: italic;
}

input[type=checkbox] {
	position: relative;
	width: 16px;
	height: 16px;
	margin: 1px;
	margin-left: 0.1875em;
	border-style: solid;
	border-width: 1px;
	border-radius: 0.1875em;
	vertical-align: middle;
}

input[type=checkbox]:hover, input[type=checkbox]:checked:hover {
	background: #d0dff2;
}

input[type=checkbox]:checked:before, input[type=checkbox]:checked:hover:before {
	position: absolute;
	margin-left: 1px;
	margin-top: 1px;
	content: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAA7klEQVQoz5XRoUoFQRTG8b+zi2C7JmHDsmVf4MwFBbGIgsHkgskg3GAwGCwarBaLySCWG2yKRRA0iC9wnmKX9RmW3R3LrAyWu55ywvw438wc+GctjUEicgTsxnE8i0fgQ2AOmLZtMQvwAfAIv+4rGiKTJDF1XX8HeB94AoZbnKjqgxGRY2DunPu01m54vAc8B/hUVe/xUVu+T5xzHyJyAbwAyx6fqerdkBylafra9/0aMPVoJ5h8rqq34buiqqpclmVvXdetAuvB2aWq3vz9iAigLEuX5/l70zQrwCZwparXCxdUFIWx1m6PWebo+gFookeTsN9DgAAAAABJRU5ErkJggg==');
}

textarea {
	display: inline-block;
	padding: 5px;
	border-style: solid;
	border-width: 2px;
	border-radius: 4px;
	background: none;
	margin: 5px;
	vertical-align: baseline;
}

textarea::placeholder {
	font-style: italic;
}

div.tooltip {
	z-index: 9000;
	padding: 5px;
	margin: 3px;
	
	background: rgb(250, 250, 250);
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	
	max-width: 400px;
}

div.dialog_cover {
	position: fixed;
	z-index: 99999;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	
	background-color: rgba(0, 0, 0, 0.4);
	
	display: flex;
	justify-content: center;
	align-items: center;
}

div.dialog_window {
	padding: 2em;
	background-color: white;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	max-width: 512px;
}

div.dialog_window h1 {
	text-align: center;
	font-size: 1.875em;
	font-weight: normal;
	font-family: 'Cairo';
	white-space: normal;
	border-bottom: 1px #d0dff2 solid;
	padding-bottom: 0.9em;
}

div.dialog_window p {
	line-height: 1.35;
	font-family: 'Signika';
	margin: 1.55em 0.2em;
}

div.dialog_window ul {
	margin: 1em;
	margin-left: 2em;
}

div.dialog_window li {
	margin: 0.1em;
}

div.dialog_window textarea {
	width: 95%;
}

div.dialog_window button {
	display: inline-block;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	
	color: #ffffff;
	font-family: 'Cairo';
	white-space: normal;
	
	padding: 9px;
	margin: 0.2em;
	min-width: 64px;
	border-radius: 5px;
	
	background: #0a76ff;
	transition: background 0.15s, color 0.15s;
}

div.dialog_window button:hover {
	background: #a0b5d2;
	transition: none;
}

div.dialog_window button:active {
	background: #E9A385;
	color: rgb(250,250,250);
	transition: none;
}

div.dialog_window button.secondary {
	background: rgba(255,255,255,0);
	color: #232323;
}

div.dialog_window button.secondary:hover {
	background: #a0b5d2;
	transition: none;
}

div.dialog_window button.secondary:active {
	background: #E9A385;
	color: rgb(250,250,250);
	transition: none;
}

div.toast_window {
	position: fixed;
	z-index: 888888;
	left: 0px;
	right: 0px;
	bottom: 0px;
	height: auto;
	
	display: flex;
	justify-content: space-between;
	align-items: center;
	
	padding: 0em 1.2em;
	background-color: white;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
}

div.toast_window h1 {
	text-align: left;
	font-size: 1.1em;
	font-weight: normal;
	font-family: 'Cairo';
	white-space: normal;
	padding-bottom: 0.1em;
}

div.toast_window p {
	line-height: 1.35;
	font-family: 'Signika';
	margin: 0.7em 0.2em;
}

div.toast_window ul {
	margin: 1em;
	margin-left: 2em;
}

div.toast_window li {
	margin: 0.1em;
}

div.toast_window textarea {
	width: 95%;
}

div.toast_window button {
	display: inline-block;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	
	color: #ffffff;
	font-family: 'Cairo';
	white-space: normal;
	
	padding: 9px;
	margin: 0.2em;
	min-width: 64px;
	border-radius: 5px;
	
	background: #0a76ff;
	transition: background 0.15s, color 0.15s;
}

div.toast_window button:hover {
	background: #a0b5d2;
	transition: none;
}

div.toast_window button:active {
	background: #E9A385;
	color: rgb(250,250,250);
	transition: none;
}

div.toast_window button.secondary {
	background: rgba(255,255,255,0);
	color: #232323;
}

div.toast_window button.secondary:hover {
	background: #a0b5d2;
	transition: none;
}

div.toast_window button.secondary:active {
	background: #E9A385;
	color: rgb(250,250,250);
	transition: none;
}

.gui_icon {
	height: 1em;
}

.gui_horizontal_strip {
	display: flex;
	flex-direction: row;
}

.gui_horizontal_strip_item {
}

.gui_line {
	white-space: nowrap;
}

.gui_box {
	border: solid black 1px;
	border-radius: 4px;
	padding: 2px;
}

.gui_sticky_box {
	position: sticky;
	top: 0px;
	border: solid black 1px;
	border-radius: 4px;
	padding: 2px;
}

.gui_text {	
}

.gui_slider {
}

.gui_field {
}

.gui_item {
	white-space: nowrap;
}

.gui_button {
	border: solid black 1px;
	border-bottom-width: 2px;
	border-right-width: 2px;
	border-radius: 4px;
	padding: 2px;
	margin: 2px;
}

.gui_button:active {
	border-bottom-width: 1px;
	border-right-width: 1px;
	margin-bottom: 3px;
	margin-right: 3px;
}

.gui_list {
	margin-bottom: 3px;
	margin-left: 7px;
	padding-left: 7px;
	border-left: solid black 1px;
}

.gui_list li img {
	height: 10px;
}

.gui_list li button {
	margin: -2px 3px;
}

.gui_list li {
	margin: 6px 0px;
}

.progress {
	position: relative;
	display: inline-block;
	width: 160px;
	height: 1em;
	font-size: 0.9em;
	border-style: solid;
	border-width: 1px;
	border-radius: 0.3125em;
	border-color: #323232;
	padding: 0em;
	background-color: rgb(250, 250, 250);
	vertical-align: middle;
	
	text-align: left;
}

.progress_fill {
	position: absolute;
	top: 0px;
	left: 0em;
	display: inline-block;
	width: 0%;
	height: 100%;
	border-radius: 0.3125em;
	background-color: #a0b5d2;
	
	text-align: left;
}

.progress_text {
	display: inline-block;
	position: absolute;
	margin: 1px 0em 0em calc(50% - 0.625em);
	font-size: 0.9em;
	z-index: 10;
	
	text-align: left;
}

.clover_block_object{
	position: relative;
	display: inline-block;
	border: dashed 1px black;
	padding: 0px 3px;
	
	margin: 2px;
	background-color: rgb(235,235,235);
	border-radius: 8px;
	border: 1px solid #ddd;
	box-shadow: 0 1px 1px #fff inset, 0 -1px 0px #ccc inset;
}

.clover_block_object_label{
	display: block;
	padding: 1px;
	font-size: 10px;
}

.clover_block_object_variables_container{
	padding: 1px 1px;
	box-shadow: 0 1px 1px #ddd inset;
	border: 1px solid #cccccc;
	border-radius: 5px;
	background: #fff;
}
.clover_block_object_variables_container:empty{
	display: none;
}
.clover_block_object_variable{
	display: inline;
}

.clover_block_object_children_container{
	padding: 1px 1px;
	box-shadow: 0 1px 1px #ddd inset;
	border: 1px solid #cccccc;
	border-radius: 5px;
	background: #fff;
}
.clover_block_object_children_container:empty{
	display: none;
}
.clover_block_object_child{
	display: inline;
}

.clover_block_string{
	display: inline;
	padding: 0px;
}
.clover_block_string_field{
	display: inline;
	padding: 1px 3px;
}
.clover_block_string_field:before{
	content: '"';
	opacity: 0.27;
}
.clover_block_string_field:after{
	content: '"';
	opacity: 0.27;
}
.clover_block_string_field:empty:before{
	content: '(empty)';
	opacity: 0.27;
}
.clover_block_string_field:empty:after{
	content: '';
	opacity: 0.27;
}

.clover_block_expression{
	display: inline;
	padding: 0px;
}
.clover_block_expression_field{
	color: #A52A2A;
	display: inline;
	padding: 1px 10px;
}
.clover_block_expression_field:empty:before{
	content: '(null)';
	opacity: 0.27;
}

.clover_block_option_button{
	position: absolute;
	left: 0px;
	top: 0px;
				
	border: none;
	background: none;
	width: 95%;
	height: 15px;
}

.clover_block_insert_button{
	border: solid 1px #bbb;
	border-radius: 4px;
	width: 10px;
	height: 16px;
	overflow: hidden;
	transition: width 0.2s, height 0.2s;
}
.clover_block_insert_button:before {
	content: '^'
}

