
:root {	
	--main-bg: #112435;
	--text-color: #eee;
	--text-color-darker: #ccc;
	
	--main-shadow-color: rgba(0,0,0,0.15);
	--vert-shadow: 0px 3px 3px rgba(0,0,0,0.3);
	
	--bg-l: rgba(255,255,255,0.05);
	--bg-l1: rgba(255,255,255,0.1);
	--bg-l2: rgba(255,255,255,0.2);
	--bg-d: rgba(0,0,0,0.05);
	--bg-d1: rgba(0,0,0,0.1);
	--bg-d2: rgba(0,0,0,0.25);
	--bg-d5: rgba(0,0,0,0.5);
	
	--header-color: #bbb;
	--header-bg: #234;
	--h1-hea-color: #234;

	--h-border-color: rgba(255,255,255,0.1);
	
	--a-color: #55bb88;
	--a-hover-color: #ddd;	
	--a-outline-c: rgba(255,255,255,0.5);
	
	--list-line-even-bg: rgba(0,0,0,0.1);
	--list-line-odd-bg: rgba(0,0,0,0.2);
	
	--table-line-even-bg: rgba(0,0,0,0.1);
	--table-line-odd-bg: rgba(0,0,0,0.2);
	
	--code-line-even-bg: rgba(0,0,0,0.1);
	--code-line-odd-bg: rgba(0,0,0,0.2);
	
	--bg-fail: rgba(255, 100, 100, 0.3);
	--bg-ok: rgba(100, 255, 255, 0.3);
	
	--ui-username-bg: rgba(255,255,255,0.1);
	--ui-logout-icon-bg: rgba(0,0,0,0.2);
	--ui-logout-icon-hover-bg: rgba(255,255,255,0.1);
	
	--debug-bg: rgba(0,0,0,0.3);
	--debug-color: #ddd;
}


nav {
	/* SHARED  */
	--menu-text-color: #eee;
	--menu-border-b: 1px solid rgba(255,255,255,0.15);
	
	--menu-a-color: #eee;
	--menu-a-bg: rgba(0,0,0,0.3);
	--menu-a-border: 1px solid #115533;
	
	--menu-a-hover-color: #eee;
	--menu-a-hover-bg: rgba(255,255,255,0.1);
	--menu-a-hover-border: 1px solid #117766;
	
	--menu-a-curr-color: #eee;
	--menu-a-curr-bg: rgba(255,100,255,0.1);
	--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 #111;
	--menu-main-shadow: var(--vert-shadow);
	
	--menu-main-a-color: #55bb88;
	--menu-main-a-bg: rgba(0,0,0,0.2);
	--menu-main-a-border: 1px solid rgba(0,0,0,0.1);
	
	--menu-main-a-hover-color: #fff;
	--menu-main-a-hover-bg: rgba(255,255,255,0.1);
	--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.1);
	--menu-main-a-curr-border: 1px solid rgba(0,100,0,0.5);

	/* SUB */
	--menu-sub-color: var(--menu-text-color);
	--menu-sub-bg: rgba(0,0,0,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(255,255,255,0.05);
	--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(255,255,255,0.05);
	--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(0,0,0,0.2);
	--h2-art-bg: rgba(0,0,0,0.1);
	
	--h1-art-color: #ccc;
	--h2-art-color: #ddd;	
	
	--a-link-btn-bg: rgba(255,255,255,0.1);
	--a-link-btn-hover-bg: rgba(255,255,255,0.2);
	--a-link-btn-border-c: 1px solid rgba(255,255,255,0.1);
}

section {	
	--section-bg: #123;
	--section-color: var(--text-color);
	
	--h-sec-color: #ddd;
	--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(255,255,255,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(255,255,255,0.05);
	--bg-even: rgba(255,255,255,0.075);
	--item-h: rgba(255,255,255,0.05);

	--item-meta-color: var(--item-color);
	--item-meta-bg: transparent;
	--item-meta-bit-color: var(--item-color);
	--item-meta-bit-bg: rgba(255,255,255,0.03);

	--item-meta-a-color: var(--a-color);
	--item-meta-a-bg: rgba(255,255,255,0.05);
	--item-meta-a-border: 1px solid rgba(255,255,255,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(255,255,255,0.1);
	--im-icon-color: #ccc;
	
	--item-desc-bg: rgba(255,255,255,0.05);
	--item-desc-border-color: rgba(100,255,255,0.3);
	--item-content-biusc: #ccc;
	--item-content-bg: transparent;
	--item-content-border-c: rgba(255,100,255,0.3);

	--mark-search:  rgba(200,255,255, 0.3);

}

div.ask-item {
	--item-ask-que-bg: rgba(255,255,255,0.05);
	--item-ask-ans-border-c: rgba(255,100,255,0.3);
	--item-ask-ans-bg: rgba(255,255,255,0.03);
	
	--ask--qa-icon-color: #ddd;
	--ask--qa-que-icon-bg: rgba(100,255,255,0.6);
	--ask--qa-ans-icon-bg: rgba(255,100,255,0.6);
}

form.form--mdl {
	--inputs-bg: #fff;
	--inputs-border: 1px solid rgba(255,255,255,0.2);
	
	--inputs-readonly-bg: #bbb;
	--inputs-disabled-bg: #bbb;
	--inputs-invalid-border-c: #a0a;
	--inputs-viewmode-color: #eee;
	--inputs-outline-c: rgba(255,255,255,0.5);
	
	--label-bg: rgba(255,255,255,0.07);
	--label-border: 1px solid rgba(255,255,255,0.2);
	
	--optgroup-border-b: 1px solid #888;
	
	--button-color: #ddd;
	--button-bg:  rgba(255,255,255,0.2);
	
	--button-hover-border-c:  #bbb;
	--button-hover-bg: #333;
	
	--btn-submit-bg:  rgba(200,200,255,0.3);
	--btn-submit-hover-bg:  rgba(200,200,255,0.5);
	--btn-action-bg:  rgba(255,200,255,0.3);
	--btn-action-hover-bg:  rgba(255,200,255,0.5);
	--btn-reset-bg: rgba(255,200,200,0.3);
	--btn-reset-hover-bg: rgba(255,200,200,0.5);
	
	--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);
}
