
:root {	
	--main-bg: #eee;
	--text-color: #111;
	--text-color-darker: #446;
		
	--main-shadow-color: rgba(0,0,150,0.10);
	--vert-shadow: 0px 3px 3px var(--main-shadow-color);
	
	--bg-l: rgba(0,0,0,0.025);
	--bg-l1: rgba(0,0,0,0.05);
	--bg-l2: rgba(0,0,0,0.1);
	--bg-d: rgba(255,255,255,0.05);
	--bg-d1: rgba(255,255,255,0.1);
	--bg-d2: rgba(255,255,255,0.25);
	--bg-d5: rgba(255,255,255,0.5);
	
	--header-color: #bbb;
	--header-bg: #234;
	--h1-hea-color: #c2d3e4aa;
	/* rgba(194, 211, 228, 0.3); */

	--h-border-color: rgba(255,255,255,0.1);
	
	--a-color: #97c;
	--a-hover-color: #6c8;	
	--a-outline-c: rgba(0,0,100,0.5);
	
	--list-line-even-bg: rgba(0,0,100,0.03);
	--list-line-odd-bg: rgba(0,0,100,0.05);
	
	--table-line-even-bg: rgba(0,0,100,0.05);
	--table-line-odd-bg: rgba(0,0,100,0.1);
	
	--code-line-even-bg: rgba(0,0,100,0.03);
	--code-line-odd-bg: rgba(0,0,100,0.05);
	
	--bg-fail: rgba(205, 50,50, 0.8);
	--bg-ok: rgba(50, 205, 205, 0.8);
	
	--ui-username-bg: rgba(0,0,100,0.1);
	--ui-logout-icon-bg: rgba(255,255,255,0.3);
	--ui-logout-icon-hover-bg: rgba(255,255,255,0.6);
	
	--debug-bg: rgba(255,255,255,0.3);
	--debug-color: #333;
}


nav {
	/* SHARED  */
	--menu-text-color: #555;
	--menu-border-b: 1px solid rgba(255,255,255,0.15);
	
	--menu-a-color: #232;
	--menu-a-bg: rgba(255,255,255,0.5);
	--menu-a-border: 1px solid #ccc;
	
	--menu-a-hover-color: #343;
	--menu-a-hover-bg: rgba(255,255,255,0.75);
	--menu-a-hover-border: 1px solid #3a9;
	
	--menu-a-curr-color: #343;
	--menu-a-curr-bg: rgba(255,255,255,0.75);
	--menu-a-curr-border: 1px solid rgba(0,100,0,0.3);
	
	/* MAIN */
	--menu-main-bg: rgba(0,0,0,0.05);
	--menu-main-border-b: 1px solid #ddd;
	--menu-main-shadow: var(--vert-shadow);
	
	--menu-main-a-color: #55bb88;
	--menu-main-a-bg: rgba(255,255,255,0.2);
	--menu-main-a-border: 1px solid rgba(255,255,255,0.2);
	
	--menu-main-a-hover-color: #fff;
	--menu-main-a-hover-bg: rgba(0,0,0,0.2);
	--menu-main-a-hover-border: 1px solid rgba(0,0,0,0.1);
	
	--menu-main-a-curr-color: #fff;
	--menu-main-a-curr-bg: rgba(0,0,0,0.2);
	--menu-main-a-curr-border: 1px solid rgba(0,100,0,0.3);

	/* SUB */
	--menu-sub-color: var(--menu-text-color);
	--menu-sub-bg: rgba(100,100,200,0.1);
	--menu-sub-border-b: var(--menu-border-b);
	--menu-sub-shadow: var(--vert-shadow);
	
	--menu-sub-a-color: var(--menu-a-color);
	--menu-sub-a-bg: var(--menu-a-bg);
	--menu-sub-a-border: var(--menu-a-border);
	
	--menu-sub-a-hover-color: var(--menu-a-hover-color);
	--menu-sub-a-hover-bg: var(--menu-a-hover-bg);
	--menu-sub-a-hover-border: var(--menu-a-hover-border); 
	
	--menu-sub-a-curr-color: var(--menu-a-curr-color);
	--menu-sub-a-curr-bg: var(--menu-a-curr-bg);
	--menu-sub-a-curr-border: var(--menu-a-curr-border);
	
	/* NODE */
	--menu-node-color: var(--menu-text-color);
	--menu-node-bg: rgba(100,100,200,0.06);
	--menu-node-border-b: var(--menu-border-b);
	--menu-node-shadow: var(--vert-shadow);
	
	--menu-node-a-color: var(--menu-a-color);
	--menu-node-a-bg: var(--menu-a-bg);
	--menu-node-a-border: var(--menu-a-border);
	
	--menu-node-a-hover-color: var(--menu-a-hover-color);
	--menu-node-a-hover-bg: var(--menu-a-hover-bg);
	--menu-node-a-hover-border: var(--menu-a-hover-border); 
	
	--menu-node-a-curr-color: var(--menu-a-curr-color);
	--menu-node-a-curr-bg: var(--menu-a-curr-bg);
	--menu-node-a-curr-border: var(--menu-a-curr-border);
	
	/* CAT */
	--menu-cat-color: var(--menu-text-color);
	--menu-cat-bg: rgba(100,100,200,0.06);
	--menu-cat-border-b: var(--menu-border-b);
	--menu-cat-shadow: var(--vert-shadow);
	
	--menu-cat-a-color: var(--menu-a-color);
	--menu-cat-a-bg: var(--menu-a-bg);
	--menu-cat-a-border: var(--menu-a-border);
	
	--menu-cat-a-hover-color: var(--menu-a-hover-color);
	--menu-cat-a-hover-bg: var(--menu-a-hover-bg);
	--menu-cat-a-hover-border: var(--menu-a-hover-border); 
	
	--menu-cat-a-curr-color: var(--menu-a-curr-color);
	--menu-cat-a-curr-bg: var(--menu-a-curr-bg);
	--menu-cat-a-curr-border: var(--menu-a-curr-border);
}

article {
	--h1-art-bg: rgba(100,100,200,0.01);
	--h2-art-bg: rgba(255,255,255,0.07);
	
	--h1-art-color: #557;
	--h2-art-color: #557;
	
	--a-link-btn-bg: rgba(0,0,100,0.05);
	--a-link-btn-hover-bg: rgba(0,0,100,0.01);
	--a-link-btn-border-c: 1px solid rgba(0,0,100,0.1);
}

section {

	--section-bg: #fafafa;
	--section-color: var(--text-color);

	--h-sec-color: #446;
	--h1-sec-color: var(--h-sec-color);
	--h2-sec-color: var(--h-sec-color);
	--h3-sec-color: var(--h-sec-color);
	--h4-sec-color: var(--h-sec-color);
	--h5-sec-color: var(--h-sec-color);
	
	--h-sec-bg: rgba(0,0,100,0.05);
	--h1-sec-bg: var(--h-sec-bg);
	--h2-sec-bg: var(--h-sec-bg);
	--h3-sec-bg: var(--h-sec-bg);
	--h4-sec-bg: var(--h-sec-bg);
	--h5-sec-bg: var(--h-sec-bg);
	
}

div.mdl-item {
	
	--item-color: var(--text-color);
	--bg-odd: rgba(0,0,100,0.01);
	--bg-even: rgba(0,0,100,0.03);
	--item-h: rgba(0,0,100,0.1);

	--item-meta-color: var(--item-color);
	--item-meta-bg: rgba(0,0,100,0.01);
	--item-meta-bit-color: #777;
	--item-meta-bit-bg: rgba(255,255,255,0.5);

	--item-meta-a-color: var(--a-color);
	--item-meta-a-bg: rgba(255,255,255,0.5);
	--item-meta-a-border: 1px solid rgba(0,0,0,0.05);

	--item-meta-a-hover-color: var(--a-hover-color);
	--item-meta-a-hover-bg: rgba(255,255,255,0.2);
	--item-meta-a-hover-border: 1px solid rgba(0,0,0,0.1);
	--im-icon-color: var(--a-color);
	
	--item-desc-bg: rgba(0,0,100,0.05);
	--item-desc-border-color: rgba(100,255,255,0.3);
	--item-content-biusc: #555;
	--item-content-bg: transparent;
	--item-content-border-c: rgba(255,100,255,0.3);
	
	--mark-search:  rgba(255,255,200, 0.75);
}


div.ask-item {
	--item-ask-que-bg: rgba(100,255,255,0.01);
	--item-ask-ans-border-c: rgba(255,100,255,0.3);
	--item-ask-ans-bg: rgba(255,100,255,0.04);
	
	--ask--qa-icon-color: #fafafa;
	--ask--qa-que-icon-bg: rgba(10,155,155,0.5);
	--ask--qa-ans-icon-bg: rgba(155,10,155,0.5);
}


form.form--mdl {
	--inputs-bg: #fff;
	--inputs-border: 1px solid rgba(0,0,0,0.2);
	
	--inputs-readonly-bg: #eef;
	--inputs-disabled-bg: #eef;
	--inputs-invalid-border-c: #d8d;
	--inputs-viewmode-color: #eee;
	--inputs-outline-c: #aaf;
	
	--label-bg: rgba(50,50,200,0.1);
	--label-border: 1px solid rgba(0,0,0,0.2);
	
	--optgroup-border-b: 1px solid #888;
	
	--button-color: #333;
	--button-bg:  rgba(0,0,0,0.05);
	
	--button-hover-border-c:  #555;
	--button-hover-bg: rgba(0,0,0,0.1);
	
	--btn-submit-bg:  rgba(200,200,255,0.8);
	--btn-submit-hover-bg:  rgba(200,200,255,0.4);
	--btn-action-bg:  rgba(255,200,255,0.3);
	--btn-action-hover-bg:  rgba(255,200,255,0.5);
	--btn-reset-bg: rgba(200,145,145,0.4);
	--btn-reset-hover-bg: rgba(200,145,145,0.6);
	
	--abtn-bg:  rgba(0,0,0, 0.1); 
	--abtn-border:  1px solid rgba(255,255,255,0.2);
	--abtn-hover-bg:  rgba(255,255,255, 0.1);
	
	--form-notes-bg: rgba(255,255,255,0.3);
}