:root {
  --c-base: #fff;
  --c-null: #000;
  --r-null: 000, 000, 000;

  --n-font: Courier;

  --c-bars: #ccc;

  --c-user: #fff;
  --c-rect: #bbb;
  --c-edit: #222;
  --c-read: #eee;
  --c-head: #777;

  --c-navy: #55acee;
  --c-bold: #3E79B2;
  --c-font: #fff;

  --c-tool: #fafafa;
  --c-text: #444;
  --c-line: #eee;
  --c-link: #777;

  --c-opos: #222;

  --c-menu: #222;
  --c-p-fc: #3e78b3;
  --c-q-fc: #3e78b3;
  --c-x-fc: red;

  --c-y-bc: green;
  --c-y-fc: #fff;
  --c-n-bc: red;
  --c-n-fc: #fff;

  --c-i-bc: #BDE5F8;
  --c-i-fc: #00529B;

  --c-e-bc: #FFD2D2;
  --c-e-fc: #D8000C;
}

:root- {
  --c-base: #212121;
  --c-null: #fff;
  --r-null: 255, 255, 255;

  --n-font: Courier;

  --c-bars: #ccc;

  --c-user: #fff;
  --c-rect: #111;
  --c-edit: #222;
  --c-read: #eee;
  --c-head: #eee;

  --c-navy: #1C4F82;
  --c-bold: #111;
  --c-font: #fff;

  --c-tool: #444;
  --c-text: #eee;
  --c-line: #111;
  --c-link: #ccc;

  --c-opos: #fff;

  --c-menu: #fff;
  --c-p-fc: #3e78b3;
  --c-q-fc: #3e78b3;
  --c-x-fc: red;

  --c-y-bc: green;
  --c-y-fc: #fff;
  --c-n-bc: red;
  --c-n-fc: #fff;

  --c-i-bc: #BDE5F8;
  --c-i-fc: #00529B;

  --c-e-bc: #FFD2D2;
  --c-e-fc: #D8000C;
}

.c-back {
	background: var(--c-base);
	//color:#444;
}
.c-back .data li label {
	color: var(--c-head);
}

.c-back .page {
	border-bottom-color: var(--c-line);
}

.c-back .data input {
	background: var(--c-user);
	border-color: var(--c-rect);
	box-shadow: 0 0 8px var(--c-rect);
	color: var(--c-edit);
}
.c-back .data input[readonly="yes"] {
	background: var(--c-read);
    box-shadow: 0 0 8px var(--c-rect);
    border: 2px solid var(--c-rect);
}
.c-back .data input[red="yes"]{
	border-color: var(--c-x-fc);
}
.c-back .data input:focus {
    box-shadow: 0 0 8px var(--c-navy);
    border: 2px solid var(--c-navy);
}
.c-back .data input[readonly="yes"]:focus {
    box-shadow: 0 0 8px var(--c-rect);
    border: 2px solid var(--c-rect);
}

.c-back .data select {
	background: var(--c-user);
	border-color: var(--c-navy);
	box-shadow: 0 0 8px var(--c-navy);
	color: var(--c-edit);
}
.c-back .data select[readonly="yes"] {
    box-shadow: 0 0 8px var(--c-rect);
    border: 2px solid var(--c-rect);
}
.c-back .data select[red="yes"]{
	border-color: var(--c-x-fc);
}

.c-back .data li .payment {
	background: var(--c-user);
	border-color: var(--c-rect);
	box-shadow: 0 0 8px var(--c-rect);
	color: var(--c-edit);
}
.c-back .data li[checked="yes"] .payment {
	background: var(--c-navy);
	color: var(--c-font);
}

.c-back .bool {
	color: var(--c-edit);
}
.c-back .bool .check {
	background: var(--c-user);
	border-color: var(--c-rect);
	box-shadow: 0 0 8px var(--c-rect);
	color: var(--c-y-bc);
}

.c-back .data hr {
	border-top-color: var(--c-line);
}
.c-back .form H2 {
	border-color: var(--c-line);
}
.c-back .form .button {
	background: var(--c-navy);
	color: var(--c-font);
	border-color: var(--c-bold);
	box-shadow: 0 0 6px var(--c-rect);
}
.c-back .form .button:hover {
	filter: opacity(80%);
}
.c-back .button[disabled="yes"] {
	filter: grayscale(100%);
}
.c-back .button[disabled="yes"]:hover {
	filter: grayscale(100%);
}
.c-back .form .button[type="login"] {
	background: var(--c-y-bc);
	color:#fff;
	border-color: #777;
}
.c-back .form .button[type="s"] {
	background: #ff8040;
}
.c-back .form .button[type="s"]:hover {
	background-color: #ff8040;
}

.c-back .link {
	background: var(--c-user);
	color: var(--c-edit);
	border-color: var(--c-rect);
	box-shadow: 0 0 6px var(--c-rect);
}

.c-back .data li[sel="1"] .link {
	background: var(--c-navy);
	color: var(--c-font);
	border-color: var(--c-bold);
}
.c-back .data li[sel="1"] .my-count {
	color: var(--c-font);
	border-color: var(--c-font);
	opacity:60%;
}

.c-back .data li[disabled="yes"] .link {
	background: var(--c-read);
}
.c-back .link:hover {
	background: var(--c-navy);
	color: var(--c-font);
	border-color: var(--c-bold);
	box-shadow: 0 0 6px var(--c-rect);
	filter: opacity(80%);
}
.c-back .data li[disabled="yes"] .link:hover {
	background: var(--c-read);
	color: var(--c-edit);
	border-color: var(--c-rect);
	box-shadow: 0 0 6px var(--c-rect);
	cursor: default;
	filter: opacity(100%);
}
.c-back .link[regs="1"]:hover {
	filter: opacity(100%);
}
.c-back .link .go {
	color: var(--c-edit);
	filter: opacity(60%);
}
.c-back li[sel="1"] .link .go {
	color: var(--c-font);
}
.c-back .data li[disabled="yes"] .link .go {
	display:none;
}
.c-back .link:hover .go {
	color: var(--c-font);
}

.c-back .data .disp[type="inf"] {
	background: var(--c-i-bc);
	color: var(--c-i-fc);
}
.c-back .data .disp[type="err"] {
	background: var(--c-e-bc);
	color: var(--c-e-fc);
}
.c-back .data .disp::before {
	border-color: var(--c-base);
	color: var(--c-base);
}

.c-back .bar1, .bar2, .bar3 {
    background-color: var(--c-bars);
}

.c-back .done {
	color: var(--c-null);
}

.c-back .data li[disabled="yes"] {
	filter: grayscale(100%);
}

.c-back .mm-buttons {
	background: var(--c-base);
	color: var(--c-null);
	opacity:0.6;
}

.c-tool {
	background: var(--c-tool);
	color: var(--c-text);
	border-color: var(--c-line);
}
.c-tool, a:visited {
	color: var(--c-text);
}

.c-head {
	background: var(--c-base);
	color: var(--c-text);
	border-color: var(--c-line);
}
.c-head, a:visited {
	color: var(--c-text);
}

.c-link, .c-link a, .c-link a:visited {
	color: var(--c-link);
}

.c-link li {
	color: var(--c-link);
	border-color: var(--c-link);
}

a.tool[shape="y"] {
	background: var(--c-navy);
	color: var(--c-font);
	border-color: var(--c-bold);
	box-shadow: 0 0 6px var(--c-rect);
}
a.tool[shape="n"] {
	background: var(--c-base);
	color: var(--c-rect);
	border-color: var(--c-rect);
	box-shadow: 0 0 6px var(--c-rect);
}

.c-back .combo-list li {
	background: var(--c-tool);
	color: var(--c-text);
	border-color: var(--c-line);
}
.c-back .combo-prev {
//	background: var(--c-line);
	border-color: var(--c-tool);
}
.c-back .combo-prev::before {
	border-right-color: var(--c-navy);
}
.c-back .combo-next {
//	background: var(--c-line);
	border-color: var(--c-tool);
}
.c-back .combo-next::before {
	border-left-color: var(--c-navy);
}

.c-cats li {
	color: var(--c-head);
	font-family: var(--n-font);
}
.c-cats li[sel="1"] {
	border-color: color: var(--c-head);
}
.c-cats li[link="1"]:hover {
	border-color: color: var(--c-head);
}

.c-line .builder-top {
	border-bottom-color: var(--c-line);
}
.c-line .builder-bot {
	border-top-color: var(--c-line);
}

.c-menu {
	color: var(--c-menu);
}
.c-menu li span {
	color:#000;
}
.c-menu li .itm {
	color: var(--c-menu);
}
.c-menu li cat {
	color: var(--c-text);
}
.c-menu li price { 
	color: var(--c-p-fc);
}
.c-menu li[kind="cat"] {
	border-bottom-color: var(--c-line);
	font-family: var(--n-font);
}
.c-menu li[kind="itm"] {
	border-bottom-color: var(--c-line);
	font-family: var(--n-font);
}
.c-menu li[kind="itm"]:hover {
	background: rgba(var(--r-null), 0.05);
}
.c-menu li[kind="itm"] .plus {
	background: linear-gradient(var(--c-menu),var(--c-menu)), linear-gradient(var(--c-menu),var(--c-menu)), var(--c-base); 	
	background-position:center;
  	background-size: 50% 2px,2px 50%; 
  	background-repeat:no-repeat;
}
.c-menu li[kind="hdr"] .caption {
	color:#777;
}
.c-menu li[ro="yes"] .itm {
	color: #ccc;
}

.c-item {
	background-color: var(--c-base);
	color:#444;
}
.c-item li[kind="group"] {
	background:#eee;
}

.c-opos {
	background: var(--c-tool);
	color: var(--c-opos);
	//border-color: #ddd;
	border-color: var(--c-line);
}
.c-opos li[kind="I"]:hover {
	background: rgba(var(--r-null), 0.1);
}
.c-opos li[kind="CLR"] {
	color: var(--c-x-fc);
}
.c-opos li[kind="E"] {
	background: var(--c-navy);
	color: var(--c-font);
	border-color: var(--c-bold);
	box-shadow: 0 0 6px var(--c-rect);
}
.c-opos li[kind="E"]:hover {
	filter: opacity(80%);
}
.c-opos li .quantity {
	color: var(--c-p-fc);
}
.c-opos li .del {
	color: var(--c-x-fc);
}