html {font-size: medium}
body {
	text-align: left;
	margin: 1em;
}

header {
	display: flex;
	align-items: center;
}
header a {
	display: block;
	max-width: 30%;
}
header img {
	margin: 0 1ex !important;
	border-width: 0;
	max-width: 100%;
}

/*Выравниваем заголовок по центру от оставшегося*/
header:before {
	flex-grow: 1;
	content: "";
	order: 1;
}
header p {
	font-size: xx-large;
	font-weight: bold;
	padding: 1ex;
	text-align: center;
	order: 2;
}
header p span {
	font-size: 60%;
}
header:after {
	flex-grow: 1;
	content: "";
	order: 3;
}
header>img:last-child {
	order: 4;
}
/* Горизонтальное меню */
.menu div,
.menu a, .menu label {
	font-family: arial, verdana, sans-serif;
	font-style: normal;
	font-weight: bold;
	text-align: center;
}
.menu {
	margin: 0;
	border: 0;
	border-bottom-width: 3px;
	border-bottom-style: solid;
}

.menu a, .menu label {
	padding: 1ex;
	text-decoration: none;
	cursor: pointer;
}

.menu a > b {
	padding: 0;
	border-width: 0;
}
.menu > label {
	padding: 0 .5em;
	font-size: 1.5em;
	display: none;
}
/* Кнопку меню равняем справа */
.menu {
	display: flex;
	align-items: center;
}
.menu > hr {
	visibility: hidden;
	/*order: 1;*/
	flex-grow: 1;
	content: "";
}
.menu b {
	font-size: larger;
	padding: 5px;
}
.menu {
	max-width: 100%
}
/*.menu > label {
	order: 2;
}*/
#navbut {display:none}

/* Навигация */
nav {
	padding: .2ex;
	display: inline-block;
	z-index: 999999;
}
nav a {
	display: flex;

	padding: .7ex 1em;
	margin: 1ex;
	text-decoration: none;

	margin: 5px;
	outline: none;
	cursor: pointer;

	border-width: 2px;
	border-style: solid;

	white-space: nowrap;
}
nav a::-moz-focus-inner {border:0;}
nav a:active {
	top: 3px;
	left: 2px;
}

nav {position: relative}

nav a:hover:not(.fold) + ul,
nav li:hover:not(.fold) + ul,
nav a:not(.fold) + ul:hover,
nav li:not(.fold) + ul:hover {
	display: block;
	position: absolute;
	padding: 0;
	margin-top: -2.2em;
	margin-left: -1ex;
	left: 100%;
}
/*nav ul li.sub > a::after,
nav ul a.sub::after {
	margin-top: -1em;
}*/

nav a:hover:not(.fold) + ul a,
nav li:hover:not(.fold) + ul a,
nav ul:hover:not(.fold) a {
	margin-left: 1ex;
}

nav ul {
	display: none;
	list-style: none;
	/*padding: .5ex 0 0 0;*/
	/*margin: -1ex .3ex 0;*/
	margin: 5px;
	margin-left: 1ex;
	/*margin: 5px 0 1ex .5px;*/
	/*padding: .3ex 0 .3ex 1ex;*/
	/*padding: .3ex 0;*/
	padding: .3ex;
	border-radius: 1ex;
}
nav ul a {
	padding: .5ex 1em;
}

nav ul > ul {
	/*margin-right: 0;
	margin-left: 1em;*/
	/*margin: 0;
	padding: 0 0 0 1em;*/
	margin-left: 1em;
	padding: .1ex;
	border-radius: 1ex 0 0 1ex;
}

nav ul > ul a {
	padding: .3ex 1em;
}

nav .fold + ul {
	display: block;
}

nav ul a {
	/*padding:.3ex .75ex;*/
	margin-left:1ex;
	font-weight: normal;
}

nav li.sub > a::after,
nav a.sub::after {
	/*float: right;*/
	margin: auto -1ex auto 1ex;
	/*content: '▸';*/
	content: '▹';
	order: 2;
	/*color: #777;*/
}
nav li.sub > a::before,
nav a.sub::before {
	content: "";
	flex-grow: 1;
	order: 1;
}
nav li.sub.fold > a::after,
nav a.sub.fold::after {
	/*content: '▾';*/
	content: '▿';
}

/* Подвал */
footer {
	text-align: center;
	padding: 1ex 0;
	margin-top: 1em;
}

/* Контент */
main {
	border-left-style: solid;
	border-left-width: 3px;
	padding: 1em 3em;
	text-indent: 3ex;
	text-align: justify; /*background-image:url('img/bg.gif');*/
}

#toTop {
	width: 4em;
	height: 4em;
	position: fixed;
	float: right;
	right: 3em;
	top: 3em;
	cursor: pointer;
	border-radius: 50%;

	border-style: solid;
	border-width: 2px;

	background-repeat: no-repeat;
	background-position: center;
	background-image: url('/img/gui/toTop.svg');
}

.epil {padding: 1em 0 1em 50%}

.mess {
	border-radius: 2ex;

	border-width: 1px;
	border-style: solid;

	margin: 0em 0em 1em 0em;
	padding-bottom: 2em;
}

.messhead {
	width: 100%;
	text-indent: 3ex;
	border-radius: 2ex 2ex 0 0;
}

.post {
	display: table-cell;
	width: 100%;
	padding: 1em 2em 1em 2em;
	text-indent: 3ex;
}

div {text-indent: 0}
div>figure {display:inline-block}
figure {
	max-width: 100%;
	text-align: center;
	padding: 0px;
	text-indent: 0
}
figure img {
	display: inline;
	margin: .5em;
}
figcaption {
	font-weight: bold;
	margin-bottom: 1ex;
	text-indent: 0px;
}

p {margin:0}
h1 {
	text-align: center;
	font-size: 1.4rem;
}
h2 {
	text-align: center;
	font-size: 1.3rem
}
h3 {font-size: 1.2rem}
h4 {font-size: 1.1rem}

img, table {max-width: 100%}
img.left {
	float:left;
	margin:1em 2em 1em 0
}
img.right {
	float:right;
	margin:1em 0 1em 2em
}
td p {text-indent: 3ex}
/*main>.links a {
	text-decoration: none;
	font-weight:bold;
	color:black
}*/

main .post a {
	text-decoration: underline
}
main .post a:hover {
	text-decoration: none;
}

main iframe, main video {max-width: 100%; padding: 1em;}

ol.mult {
	list-style: none; 
	counter-reset: li; 
}
.mult li:before {
	counter-increment: li; 
	content: counters(li,".") ". "; 
}

.col {
	column-count:2;
	margin-bottom:1em
}
ol, ul {text-indent:0}
.nw {white-space: nowrap}
.left {float:left}
.right {float:right}
.center {
	text-align: center;
	text-indent:0;
}

li>h1, li>h2, li>h3,
li>h4, li>h5, li>h6{
	text-align: left;
}

.poem {
	text-indent:0;
	padding: 1em;
	margin-left:2em
}

.strof4 br:nth-child(4n+1) {
	margin-top: 1ex
}

.u {text-decoration: underline}

main td,main th{padding:.5ex}
main td{text-align:left}
main th{text-align:center}
main th i{font-weight:normal}
main caption{font-size:larger;font-weight:bold;margin-bottom:1em}
main th[colspan]{text-align:center}
main td:first-child,main td[rowspan]:first-child+td{text-align:center}

main a{
	text-decoration:none;
	font-weight:bold;
	line-height:1.5em
}
main a:hover{
	text-decoration:underline;
}

main table.tn,
main table.tn tbody,
main table.tn thead,
main table.tn tfoot,
main table.tn td,
main table.tn tr {
	border-width:0;
	border-color:transparent;
	text-align:left;
	background-color:transparent
}
main table.tn thead tr td,
main table.tn tfoot tr td{
	text-align:center
}
main table.tn td:not([colspan]):first-child {text-align:right}
main table.tn tbody:not(:first-of-type), main table.tn thead ~ tbody {border-top-width: 1ex}

main table td[colspan]{text-align:center}

main table.nb, main table.nb tbody, main table.nb thead, main table.nb tfoot,
main table.nb tr, main table.nb td, main table.nb th{
	border-color:transparent;
}
main table.center, main table.center tbody, main table.center thead, main table.center tfoot,
main table.center tr, main table.center td, main table.center th{
	text-align:center!important
} 

main hr {margin: 1.5em 0;}

/*main, .post {overflow-y:auto}*/
/*table {table-layout:fixed}*/
#nextpage a, #prevpage a {
	display: block;
	padding: .5em 3em; 
}
#nextpage, #prevpage {
	margin: 1em 0;
	text-align: center;
}

/* Вспомогательные */


/* Макет */
@supports not (display: grid){
	body {
		display: flex;
		flex-wrap: wrap;
	}
	header, .menu, footer {
		box-sizing: border-box;
		width:100%;
		max-width: 100%;
		flex-grow: 1;
		flex-shrink: 0;
	}
	nav {flex-grow: 0}
	main {flex-grow: 1}
}
@supports (display: grid){
	header {grid-area: header}
	.menu {grid-area: menu}
	main {grid-area: main}
	nav {grid-area: nav}
	footer {grid-area: footer}
	body {
		display: grid;
		grid-template-columns: auto 1fr;
		grid-template-areas:
			"header header"
			"menu menu"
			"nav main"
			"footer footer"
	}
}

@media (max-width: 1290px){
	header p {font-size: x-large}
}
@media (max-width: 1000px){
	header img {
		object-fit: cover;
		width: 149px;
		height: 150px;
		border-radius: 50%;
	}
	header>img:last-child {
		display: none;
	}
}
@media (max-width: 508px){
	.menu {font-size: 3vw}
	#toTop {
		width: 40px;
		height: 40px;
	}
}

@media (max-width: 880px){
	body {margin: 1ex 2ex}
}
@media (max-width: 800px){
	header p {font-size: medium}
	header img {display: none}
	body {margin: .3ex .6ex}
}
/*@media (min-resolution: 100dpi){
	body {font-size: 200%}
}*/
@media (min-resolution: 100dpi) and (max-width: 1280px){
	body {margin: .3ex .6ex}
}

/*@media (max-width: 1100px), (min-resolution: 100dpi) and (max-width: 1280px){*/
@media (max-width: 1279px){
	/* Выпадающее меню, на маленьких экранах */
	main {
		border: none;
		padding: 1ex;
	}
	main table {font-size: 2vw}
	.post {padding: 1ex}
	body {
		display: block;
		position: relative;
	}
	nav {
		border-radius: 0 0 1ex 1ex;
		position: absolute;
		right: 1ex;
		display: none;
		border-style: solid;
		border-width: 3px;
		border-top: none;
		padding: .5ex;
	}
	nav a:hover:not(.fold) + ul,
	nav li:hover:not(.fold) + ul,
	nav a:not(.fold) + ul:hover,
	nav li:not(.fold) + ul:hover {
		margin-right: -1.2ex;
		margin-top: -5ex;
		right: 100%;
		left: auto;
	}
	nav li.sub > a::after,
	nav a.sub::after {
		margin-right: 0;
	}

	.menu, .menu a, .menu b {padding:0 .3ex}
	.menu label {padding:0 1ex}
	.menu > label {display: block;}
	#navbut:checked ~ nav {display: inline-block;}
	.col {column-count:1}
	.epil {padding: 1ex 0 1ex 2em}

	#toTop {
		right: 1ex;
		top: 1ex;
		width: 80px;
		height: 80px;
	}
}
@media (min-resolution: 100dpi) and (max-width: 1280px){
	nav a {
		font-size: larger;
		padding: 1ex .5em;
	}
}


table {
	margin: 2em auto;
}
table {
	text-indent: 0px;
	border-collapse: collapse;
}
th, thead {text-align: center}
td {text-align: left}
td,
th {
	border-width: 1px;
	border-style: solid;
	padding: 1ex;
}
tbody,
thead,
tfoot,
colgroup {
	border-width: 2px;
	border-style: solid;
	padding: 1ex;
}

main table td[colspan]{text-align:center}

summary {
	cursor: pointer;
	font-weight: bold;
}

dt {
	font-weight: bold;
	float: left;
}
dd:before {content: ' – '}

br.both {clear:both}
br.left {clear:left}
br.right {clear:right}

ul.minus li {list-style-type: '-'}

ol.rus, .none {list-style-type: none}
ol.rus li:nth-child(1)::before {content: 'а) '}
ol.rus li:nth-child(2)::before {content: 'б) '}
ol.rus li:nth-child(3)::before {content: 'в) '}
ol.rus li:nth-child(4)::before {content: 'г) '}
ol.rus li:nth-child(5)::before {content: 'д) '}
ol.rus li:nth-child(6)::before {content: 'е) '}
ol.rus li:nth-child(7)::before {content: 'ё) '}
ol.rus li:nth-child(8)::before {content: 'ж) '}
ol.rus li:nth-child(9)::before {content: 'з) '}
ol.rus li:nth-child(10)::before {content: 'и) '}
ol.rus li:nth-child(11)::before {content: 'й) '}
ol.rus li:nth-child(12)::before {content: 'к) '}
ol.rus li:nth-child(13)::before {content: 'л) '}
ol.rus li:nth-child(14)::before {content: 'м) '}
ol.rus li:nth-child(15)::before {content: 'н) '}
ol.rus li:nth-child(16)::before {content: 'о) '}
ol.rus li:nth-child(17)::before {content: 'п) '}
ol.rus li:nth-child(18)::before {content: 'р) '}
ol.rus li:nth-child(19)::before {content: 'с) '}
ol.rus li:nth-child(20)::before {content: 'т) '}
ol.rus li:nth-child(21)::before {content: 'у) '}
ol.rus li:nth-child(22)::before {content: 'ф) '}
ol.rus li:nth-child(23)::before {content: 'х) '}
ol.rus li:nth-child(24)::before {content: 'ц) '}
ol.rus li:nth-child(25)::before {content: 'ч) '}
ol.rus li:nth-child(26)::before {content: 'ш) '}
ol.rus li:nth-child(27)::before {content: 'щ) '}
ol.rus li:nth-child(28)::before {content: 'ь) '}
ol.rus li:nth-child(29)::before {content: 'ы) '}
ol.rus li:nth-child(30)::before {content: 'ъ) '}
ol.rus li:nth-child(31)::before {content: 'э) '}
ol.rus li:nth-child(32)::before {content: 'ю) '}
ol.rus li:nth-child(33)::before {content: 'я) '}
