body {
	font-family: monospace;
}

.optg {
	border: 1px solid grey;
	padding: 7px 4px;
}

.chkbx {
	margin-left: 0;
	vertical-align: middle;
}
.chkbx2 {
	margin: 0;
	vertical-align: middle;
}
.chkbx3 {
	margin: 0;
	vertical-align: text-bottom;
}
.chkbx4 {
	width: 100%;
	/* font-size: x-small; */
}

.tiny {
	font-size: x-small;
}
.tinybtn {
	font-size: x-small;
	padding: 0 2px;
}

.cint {color: blue;}
.cuint {color: rgb(0, 0, 161);}
.cdbl {color: rgb(60, 60, 255);}
.cbool {color: magenta;}
.cstr {color: peru;}
.ccust {color: black;}

.reqrd {color: deeppink;} 
.optnl {color: blueviolet;}

.code {font-size: 0.75em !important;}

.cuscode {
	line-height: 30px;
	font-size: large;
	border-radius: 3px;
	border-style: double;
	padding: 0px 68px;
}


.flasher {border-bottom: 1px solid grey;}
.flasher:last-child {border-bottom: none;}
.flasher-input {
	vertical-align: middle;
	margin: 0 1px 0 0;
	accent-color: #e5e2a6;
}

.badge {
	background: saddlebrown;
	color: lightyellow;
	border-radius: 10px;
	font-size: x-small;
}

.boxy1 {
	width: 22%;
	height: 18px;
	border: 1px solid black;
	text-align: center;
	padding-top: 2px;
	margin-bottom: 7px;
}
.boxy {
	border: 1px solid black;
	text-align: center;
	padding: 1px 8px;
}


/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/* layout conf */
#_controlSection {
	float: left;
	width: 54%;
}
#_optsSectionContainer {
	float: left;
	width: 75%;
}
#_eventsSectionContainer {
	float: left;
	width: 23%;
	margin-left: 4px;
}
#_msg {
	float: left;
	width: 100%;
}

html,body {height: 100%}
#_resSectionContainer {
	float: right;
	width: 46%;
	height: 100%;
}
#_resSectionContainer>.code-toolbar, #_resPre, #_res {height: 100%;}


@media screen and (min-width: 1600px) {
	#_optsSectionContainer { width: 81%;}
	#_eventsSectionContainer { width: 17%; }
}
@media screen and (min-width: 1340px) {
	#_optsSectionContainer { width: 74%;}
	#_eventsSectionContainer { width: 24%; }
}
@media screen and (max-width: 1340px) {
	#_optsSectionContainer { width: 70%;}
	#_eventsSectionContainer { width: 28%; }
}
@media screen and (max-width: 635px) {
	#_optsSectionContainer { width: 66%;}
	#_eventsSectionContainer { width: 32%; }
}


@media screen and (max-width: 1185px) {
	#_controlSection { width: 56%;}
	#_resSectionContainer { width: 44%; }
}
@media screen and (max-width: 1140px) {
	#_controlSection { width: 62%;}
	#_resSectionContainer { width: 38%; }
}
@media screen and (max-width: 1020px) {
	#_controlSection { width: 70%;}
	#_resSectionContainer { width: 30%; }
}
@media screen and (max-width: 905px) {
	#_controlSection { width: 75%;}
	#_resSectionContainer { width: 25%; }
}


@media screen and (max-width: 850px) {
	#_controlSection {
		width: 100%;
	}
	#_resSectionContainer {
		float: left;
		width: 100%;
	}
}
/*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/


.dum {
	background: yellow;
	background: gold;
	background: khaki;
	background: navajowhite;
	background: palegoldenrod;
	background: moccasin;
	background: wheat;
	background: tan;
	background: darkkhaki;
	background: lemonchiffon;
	background: lightgoldenrodyellow;
	background: lightyellow;
	background: papayawhip;
	background: peachpuff;
	background: sandybrown;

	background: lightblue;
	background: lightskyblue;
	background: mediumaquamarine;
	background: mediumturquoise;
}