/* help
http://remont2x2.ru/color/grey.htm
https://colorscheme.ru/#
https://color.adobe.com/ru/create/color-wheel/?base=0&rule=Shades&selected=1&name=%D0%9C%D0%BE%D1%8F%20%D1%82%D0%B5%D0%BC%D0%B0%20Color&mode=rgb&rgbvalues=0.807843137254902,0.807843137254902,0.807843137254902,0.557843137254902,0.557843137254902,0.557843137254902,0.25882352941176473,0.25882352941176473,0.25882352941176473,0.857843137254902,0.857843137254902,0.857843137254902,0.707843137254902,0.707843137254902,0.707843137254902&swatchOrder=1,2,0,3,4
http://www.dasplankton.de/ContrastA/
https://learnui.design/tools/data-color-picker.html#single
https://www.html.am/html-codes/color/color-scheme-combinations.cfm
https://infogra.ru/design/krutaya-shpargalka-po-sochetaniyu-tsvetov

Светлая схема:
фон - самый светлый цвет,
кнопка - ближайший к светлому,
текст - самый тёмный.
Сочетания цветов:
https://lookcolor.ru/nejtralnyj/seryj-cvet/

Тёмная схема (если 2 и более цветов тёмные):
фон - самый тёмный цвет,
кнопка - ближайший к тёмному,
текст - самый светлый.
Сочетания цветов:
https://lookcolor.ru/nejtralnyj/temno-seryj-cvet-sochetanie-v-odezhde-interere/

Маленький текст должен иметь коэффициент контрастности не менее 4,5:1
	по отношению к фону.
Большой текст (при 14 пт. жирный / 18 пт. обычный и выше) должен иметь
	коэффициент контрастности не менее 3:1 по отношению к фону.
*/
/* colors */
:root {
	/* логотип */
	--logo-first-letter-color: #DBDBDB;
	--logo-text-color: #B4B4B4;
	/* главное меню */
	--menu-bg-color: #424242;
	--menu-text-color: #DBDBDB;
	--menu-highlight-bg-color: #DBDBDB;
	--menu-highlight-text-color: #000000;
	--menu-border-color: rgba(255, 255, 255, .05);
	--menu-shadow-color: rgba(0, 0, 0, .5);
	/* основное пространство */
	--main-bg-color: #424242;
	--main-text-color: #DBDBDB;
	--main-links-color: #DBDBDB;
	--main-highlight-color: #F0F0F0;
	/* подвал */
	--footer-bg-color: #353535;
	--footer-text-color: #CECECE;
	/* элементы управления */
	--input-border-color: #8E8E8E;
	--input-text-color: #000000;
	--input-bg-color: #F0F0F0;
	--button-text-color: #000000;
	--button-bg-color: #CECECE;
	/* границы */
	--border-color: rgba(255, 255, 255, .05);
	--table-border-color: rgba(255, 255, 255, .1);
}

body {
	color: #DBDBDB;              /* для старых браузеров */
	background-color: #424242;   /* для старых браузеров */
	color: var(--main-text-color);
	background-color: var(--main-bg-color);
}

a, a:focus, a:active, strike, .post-meta span a:hover,
ul.meta-post li a:hover, ul.cat li a:hover, ul.recent li h6 a:hover, ul.portfolio-categ li.active a, ul.portfolio-categ li.active a:hover, ul.portfolio-categ li a:hover,ul.related-post li h4 a:hover, span.highlight,article .post-heading h3 a:hover {
	color: #DBDBDB; /* IE */
	color: var(--main-links-color);
}

a:hover {
	color: #F0F0F0; /* IE */
	color: var(--main-highlight-color);
}

h1, h2, h3, h4, h5, h6 {
	color: #DBDBDB;  /* IE */
	color: var(--main-text-color);
}

.logo:first-letter, .logo a:first-letter  {
	color: #DBDBDB; /* IE */
	color: var(--logo-first-letter-color);
}
.logo, .logo a, .logo a:hover {
	color: #B4B4B4; /* IE */
	color: var(--logo-text-color);
	text-decoration: none;
}

div.login > label {
	color: #B4B4B4; /* IE */
	color: var(--logo-text-color);
}
div.login > label:hover {
	color: #F0F0F0; /* IE */
	color: var(--main-highlight-color);
}
div.login #login_form {
	color: #DBDBDB;  /* IE */
	color: var(--main-text-color);
	background-color: #424242;	/* IE */
	background-color: var(--main-bg-color);
  border: 2px solid #424242;	/* IE */
  border: 2px solid var(--menu-border-color);
	box-shadow: 2px 2px 2px #424242;	/* IE */
	box-shadow: 2px 2px 2px var(--menu-shadow-color);
	border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
}
div.login #login_form ul.login_menu a {
  transition: all .125s ease-in-out;
  -webkit-transition: all .125s ease-in-out;
	border-bottom-color: rgba(255, 255, 255, .05); /* IE */
	border-bottom: 1px solid var(--menu-border-color);
}
div.login #login_form ul.login_menu a:hover {
  color: #000000;	/* IE */
  background-color: #DBDBDB; /* IE */
  color: var(--menu-highlight-text-color);
  background-color: var(--menu-highlight-bg-color);
}

/* выделенное */
.pickout {
	color: var(--main-highlight-color);
}
.resp-pickout, .resp-pickout a {
}
@media (max-width:600px){
	.resp-pickout, .resp-pickout a {
		color: var(--main-highlight-color);
		font-weight: bolder;
	}
}

input, select, textarea {
	border: 2px solid var(--input-border-color);
	border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
	color: var(--input-text-color);
	background-color: var(--input-bg-color);
}

textarea, select, select.tbox {
	border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px 0 0 4px;
  -moz-border-radius: 4px 0 0 4px;
	border-right: none;
}

img, input[type="image"] {
	border: none;
}

input[type="button"],
input[type="submit"] {
	border: 2px solid var(--input-border-color);
	color: var(--button-text-color);
	background-color: var(--button-bg-color);
	font-weight: 700;
}

input[type="checkbox"], input[type="radio"] {	/* ??? */
	background-color: var(--button-bg-color);
}

/* fontawesome icons */
.icon-square:hover,
.icon-rounded:hover,
.icon-circled:hover {
    background-color: var(--main-highlight-color);
}
[class^="icon-"].active,
[class*=" icon-"].active {
    background-color: var(--main-highlight-color);
}

/* main menu */
menu,
#toggle-menu {
	border: 0;
}

@media only screen and (min-width: 960px) {/* 1024px default */
	#menu {
		border-bottom: 1px solid rgba(255, 255, 255, .05);
		border-bottom: 1px solid var(--menu-border-color);
	}
}

@media only screen and (max-width: 959px) {
	#menu {
		box-shadow: 1px 2px 2px rgba(0, 0, 0, .5); /* IE */
		box-shadow: 1px 2px 2px var(--menu-shadow-color);
	}
}

#menu ul {
	background-color: #424242;	/* для старых браузеров */
	background-color: var(--menu-bg-color);
}

#menu .sub-menu {
  border-width: 1px 1px 0;
	box-shadow: 1px 2px 2px rgba(0, 0, 0, .5);	/* IE */
	box-shadow: 1px 2px 2px var(--menu-shadow-color);
}

#menu li,
#toggle-menu,
#menu a {
	color: #DBDBDB;	/* IE */
  color: var(--menu-text-color);
	text-decoration: none;
}

#menu a:hover,
#menu .sub-menu a:hover {
  color: #000000;	/* IE */
  background-color: #DBDBDB; /* IE */
  color: var(--menu-highlight-text-color);
  background-color: var(--menu-highlight-bg-color);
}

#menu li,
#menu .sub-menu {
  border-style: solid;
  border-color: rgba(255, 255, 255, .05);	/* для старых браузеров */
  border-color: var(--menu-border-color);
}

/* indikator submenu in phone/tablet mode */
#menu label.drop-icon {
	background-color: rgba(255, 255, 255, .05);	/* IE */
  background-color: var(--menu-border-color);
}
#menu a:hover label.drop-icon {
	color: #000000;	/* IE */
  color: var(--menu-highlight-text-color);
}


#content #sidebar ul {
	border-top: 1px solid rgba(255, 255, 255, .05);	/* IE */
	border-left: 1px solid rgba(255, 255, 255, .05);	/* IE */
	border-top: 1px solid var(--border-color);
	border-left: 1px solid var(--border-color);
}

/* Footer */
footer {
	color: #CECECE;
	background-color: #353535;	/* IE */
	color: var(--footer-text-color);
	background-color: var(--footer-bg-color);
}

footer h1, footer h2, footer h3, footer h4, footer h5, footer h6{
	color: #CECECE; /* IE */
	color: var(--footer-text-color);
}

footer a {
	color: #CECECE; /* IE */
	color: var(--footer-text-color);
}

footer a:hover {
	color: #F0F0F0; /* IE */
	color: var(--main-highlight-color);
}

#sub-footer {
	background-color: #353535; /* IE */
	color: #CECECE; /* IE */
	background-color: var(--footer-bg-color);
	color: var(--footer-text-color);
}

#handmade td > a > div > h6, #handmade td > div > div > h6 {
  mix-blend-mode: difference;
	text-shadow: 1px 1px 1px;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE 10 */
	#handmade td > a > div > h6, #handmade td > div > div > h6 {
	  color: #353535;
		text-shadow: 1px 1px 1px #CECECE;
	}
}

.border:not(table) {
	border: 1px solid rgba(255, 255, 255, .05);
	border: 1px solid var(--border-color);
}

/* Таблицы */
table.border tr {
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  border-bottom: 1px solid var(--table-border-color);
}
table:not(.gps-menu) thead tr {
	background-color: #DBDBDB; /* IE */
	color: #424242; /* IE */
	background-color: var(--main-text-color);
	color: var(--main-bg-color);
}
@media screen and (max-width: 600px) {
	table.border td {
		border-bottom-color: rgba(255, 255, 255, .1); /* IE */
		border-bottom-color: var(--table-border-color);
	}
}
@media only screen and (min-width: 960px) {/* 1024px default */
	table.border td, table.border th {
		border-right: 1px solid rgba(255, 255, 255, .1); /* IE */
		border-right: 1px solid var(--table-border-color);
	}
	table.border thead td, table.border thead th {
		border-right-color: #8E8E8E; /* IE */
		border-right-color: var(--input-border-color);
	}
}
table.border td:last-child, table.border th:last-child {
	border-right: 0;
}

.wmessage {
	border-bottom: 4px solid rgba(255, 255, 255, .05); /* IE */
	border-bottom: 4px solid var(--border-color);
}

/* scroll to top */
.scrollup {
	background: var(--main-text-color);
}
a.scrollup i {
	color: var(--main-bg-color);
}

/* примечание в тексте */
sup.star {
	color: var(--main-text-color);
}

.caption:not(table.gps-menu) {
	background-color: var(--main-text-color);
	color: var(--main-bg-color);
	border-color: var(--table-border-color);
	font-weight: bold;
}

/* печать, черное на белом */
div.print_page {
	background-color: #FFF;
	color: #000;
}
div.print_page a,
div.print_page a:hover,
div.print_page h1,
div.print_page h2,
div.print_page h3,
div.print_page h4,
div.print_page h5,
div.print_page h6
{
	color: #000;
	background-color: transparent;
}
div.print_page .title {
	border-color: lightgray;
}
div.print_page .source {
	border-color: lightgray;
}
div.print_page #footer {
	background-color: transparent;
}

/* light lightbox :)
see /javascript/win.js, function lb
and
Z:\locman.org\themes\modern\style.css (search by .lightbox)
*/
#lightbox_content {
	background-color:#F0F0F0 !important;
}
#lightbox_note {
	color:#000000;
}
