@keyframes ani_rot {
	0%		{ transform: rotate(0deg);		}
	100%	{ transform: rotate(360deg); }
}
@keyframes ani_op_low {
	0%		{ opacity: 1;	}
	100%	{ opacity: 0.1; }
}
@keyframes ani_op_half {
	0%		{ opacity: 1;	}
	100%	{ opacity: 0.5; }
}
@keyframes ani_op_top {
	0%		{ opacity: 0; }
	100%	{ opacity: 1; }
}
@keyframes ani_off_bar {
	0%		{ opacity: 0; height: 0; }
	30%		{ opacity: 0.01; }
	100%	{ opacity: 1; }
}
@keyframes ani_scale {
	0%		{	transform: scale(0);	}
	90%		{	transform: scale(1.4);	}
	100%	{	transform: scale(1);	}
}
@mobile-width: 860px;

.dokuwiki {
	animation: ani_op_top 0.5s ease-in-out;
	margin: 0;
	width: 100%;
	&.export {
			box-sizing: border-box;
			padding: 3px;
		abbr {
			text-decoration: none;
		}
		a {
			color: inherit !important;
		}
	}
	&.slav {
		#head #logo #inlogo {
			background: url( images/logo/logor.svg ) no-repeat;
			height: 53px;
			transform: translate(1px, 0);
			&:hover::after {
				transform: translate(-1px, 0);
			}
			@media (max-width: @mobile-width) {
				background: url( images/logo/logor_mob.svg ) no-repeat;
			}
		}
	}
	&:not(.slav) {
		#head #logo #inlogo {
			background: url( images/logo/logo.svg ) no-repeat;
			height: 46.5px;
			transform: translate(0, 7px);
			&:hover::after {
				transform: translate(0, -7px);
			}
			@media (max-width: @mobile-width) {
				background: url( images/logo/logo_mob.svg ) no-repeat;
				height: 53px;
			}
		}
	}
	#head {
		* {
			outline: none;
		}
		#logo {
			float: left;
			#inlogo {
				display: inline-block;
				width: 332px;
				&:hover::after {
					animation: ani_op_top 0.4s;
					background-size: contain !important;
					content: '';
					display: inline-block;
					float: left; /* для иврита */
					width: 100px;
					@media (max-width: @mobile-width) {
						background: none !important;
					}
				}
				&[rnd="0"]:hover::after {
					background: url(images/logo/logo-jenny.png) no-repeat;
					height: 39px;
					margin: 6px 0 0 24px;
				}
				&[rnd="1"]:hover::after {
					background: url(images/logo/logo-sam.png) no-repeat;
					height: 59px;
					margin: 0 0 -3px 32px;
				}
				&[rnd="2"]:hover::after {
					background: url(images/logo/logo-kitty.png) no-repeat;
					height: 35px;
					margin: 9px 0 0 29px;
				}
				&[rnd="3"]:hover::after {
					background: url(images/logo/logo-pinkie.png) no-repeat;
					height: 54px;
					margin: 0 0 0 14px;
				}
				&[rnd="4"]:hover::after {
					background: url(images/logo/logo-bob.png) no-repeat;
					height: 35px;
					margin: 11px 0 0 34px;
				}
				&[rnd="5"]:hover::after {
					background: url(images/logo/logo-ninwah.png) no-repeat;
					height: 39px;
					margin: 7px 0 0 23px;
				}
				&[rnd="6"]:hover::after {
					background: url(images/logo/logo-gamercat.png) no-repeat;
					height: 34px;
					margin: 9px 0 0 28px;
				}
				@media (max-width: @mobile-width) {
					width: 40px;
				}
			}
		}
		#menu {
			header {
				letter-spacing: .05em;
				line-height: 1.6em;
				min-height: 30px;
				text-shadow: 1px 1px 2px black;
				&[rnd="0"] {
					background: #22979E;
				}
				&[rnd="1"] {
					background: #829DD3;
				}
				&[rnd="2"] {
					background: #A387C1;
				}
				&[rnd="3"] {
					background: #E183BD;
				}
				&[rnd="4"] {
					background: #E9B630;
					#upmenu a:hover {
						color: #0FF;
					}
				}
				&[rnd="5"] {
					background: #45A2C4;
				}
				&[rnd="6"] {
					background: #AD464A;
				}
				> * {
					position: relative;
					top: 4px;
				}
				#upmenu {
					color: white;
					font: bold 15px DatFestComic,cursive;
					@media (max-width: 456px) {
						width: ~"calc(100% - 120px)";
						display: inline-block;
					}
					a {
						color: white;
					}
					a:hover {
						color: #FF0;
					}
					a + a {
						margin-left: ~"clamp(3px, 100vw - 555px, 8px)";
					}
				}
				#search {
					float: right;
					margin: 0 3px;
					form#dw__search {
						div.no {
							* {
								border-radius: 10px;
								font-size: 120%;
							}
							#qsearch__in {
								margin-right: 1px;
								position: relative;
								top: -3px;
								width: ~"clamp(50px, 100vw - 400px, 150px)";
							}
							button {
								padding: 1px 4px 2px 3px;
								@media (max-width: 456px) {
									display: none;
								}
							}
							div#qsearch__out { /* всплывающие результаты; вырубить нахрен, неуправляемые background и частично position */
								display: none !important;
							}
						}
					}
				}
			}
			nav {
				min-height: 30px;
				@media (max-width: 1040px) {
					overflow-x: scroll;
				}
				scrollbar-width: 6px !important;
				&::-webkit-scrollbar {
					max-width: 6px !important;
				}
			}
		}
	}
	article#dokuwiki__detail {
		padding: 0 1em;
		h1 {
			padding: 1em 0;
		}
		div.img_big {
			[dir=ltr] & { float: left; }
			[dir=rtl] & { float: right; }
			p.img_caption {
				text-align: center;
			}
		}
		div.img_detail {
			[dir=ltr] & { float: left; }
			[dir=rtl] & { float: right; }
			margin: 0 1em;
			#back {
				font-size: 1.3em;
				margin-top: 0;
				bdi {
					padding-left: .5em;
					position: relative;
					top: 2px;
				}
			}
			dl.img_tags {
				dd {
					background-color: __medium__;
					font-style: italic;
				}
				dt {
					background-color: __lightgray__;
					display: inline-block;
					font-weight: bold;
					margin-top: 0.5em;
				}
				dd, dt {
					line-height: 2;
					padding: 0 1em;
				}
			}
		}
	}
	article.page {
		border-bottom: 1px dashed #EEE;
		font-family: "Trebuchet MS", "Bitstream Vera Sans", "Nimbus Sans L", sans-serif;
		line-height: 1.5em;
		margin: 0 37px;
		position: relative;
		text-align: justify;
		&::after {
			content: "";
			height: 100%;
			left: 0;
			opacity: 0.03;
			position: absolute;
			top: 0;
			width: 100%;
			z-index: -1;
		}
		h1 {
			&:nth-child(1) {
				padding: 0;
			}
		}
		h5:nth-child(1) {
			margin: 0;
		}
		.footnotes {
			border-top: 1px solid __dark__;
			clear: both;
			margin: 1.5em 0 .5em 1em;
			.fn {
				border-bottom: 1px solid __medium__;
				font-size: 90%;
			}
			.fn_bot {
				font-weight: bold;
			}
			.content {
				display: inline;
			}
		}
		.editBox {
			.toolbar.group {
				margin: 2px 0;
				#tool__bar {
					button {
						&:nth-of-type(1),&:nth-of-type(2),&:nth-of-type(3),&:nth-of-type(4),&:nth-of-type(5),
						&:nth-of-type(6),&:nth-of-type(7),&:nth-of-type(8),&:nth-of-type(9),&:nth-of-type(10),
						&:nth-of-type(11),&:nth-of-type(12),&:nth-of-type(13),&:nth-of-type(14),&:nth-of-type(15) {
							background: url( https://comicslate.org/lib/images/toolbar/toolbar.png );
							height: 16px;
							margin: -2px 5px 5px 3px;
							vertical-align: middle;
							width: 16px;
							img {
								display: none;
							}
						}
						&:nth-of-type(1) { background-position: 0 0; }
						&:nth-of-type(2) { background-position: 0 -16px; }
						&:nth-of-type(3) { background-position: 0 -32px; }
						&:nth-of-type(4) { background-position: 0 -48px; }
						&:nth-of-type(5) { background-position: 0 -64px; }
						&:nth-of-type(6) { background-position: 0 -80px; }
						&:nth-of-type(7) { background-position: 0 -96px; }
						&:nth-of-type(8) { background-position: 0 -112px; }
						&:nth-of-type(9) { background-position: 0 -128px; }
						&:nth-of-type(10) { background-position: 0 -144px; }
						&:nth-of-type(11) { background-position: 0 -160px; }
						&:nth-of-type(12) { background-position: 0 -176px; }
						&:nth-of-type(13) { background-position: 0 -192px; }
						&:nth-of-type(14) { background-position: 0 -208px; }
						&:nth-of-type(15) { background-position: 0 -224px; }
					}
				}
			}
			#dw__editform {
				#wiki__editbar.editBar {
					margin: 0;
					.editButtons {
						display: inline-block;
						padding: 0 4px 11px 0;
						button, input {
							border-radius: 3px;
							border: 1px solid #888;
							padding: 1px 6px;
						}
						#edbtn__save {
							background-image: linear-gradient(to bottom, #CFB, #AD9);
							&:hover {
								background-image: linear-gradient(to bottom, #CFB, #8B7);
							}
						}
						#edbtn__preview {
							background-image: linear-gradient(to bottom, #7EF, #5CC);
							&:hover {
								background-image: linear-gradient(to bottom, #7EF, #3AB);
							}
						}
						#edbtn__cancel {
							background-image: linear-gradient(to bottom, #FCB, #DA9);
							&:hover {
								background-image: linear-gradient(to bottom, #FCB, #B87);
							}
						}
					}
					.summary {
						.nowrap {
							white-space: nowrap;
							span,
							#edit__summary {
								vertical-align: 2px;
							}
						}
					}
				}
			}
		}
		div.index__tree {
			li {
				&.closed {
					opacity: 0.5;
				}
				.curid a {
					font-weight: bold;
				}
				div.li {
					margin-bottom: 3px;
					a.idx_dir {
						background-color: white;
						border: 2px solid #eee;
						border-radius: 5px;
						box-shadow: 0 0 3px 1px __dark__;
						padding: 0 5px;
					}
				}
			}
		}
	}
	@media (max-width: 750px) {
		article.page {
			margin: 0 7px 0 37px !important;
		}
	}
	&.slav {
		article.page::after {
			background-image: url( images/logo/logor_back.svg );
		}
	}
	&:not(.slav) {
		article.page::after {
			background-image: url( images/logo/logo_back.svg );
		}
	}
/**
 * @author Anika Henke <anika@selfthinker.org>
 * @author Andreas Gohr <andi@splitbrain.org>
 */
	#pagetools {
		@ico-width: 28px;
		@ico-margin: 4px;
		@item-height: (@ico-width + @ico-margin);
		position: fixed;
		right: 0;
		top: 75px;
		z-index: 999999;
		&:hover {
			ul#nomobile {
				background-color: @ini_background;
				border-color: @ini_border;
				border-radius: 2px;
				box-shadow: 2px 2px 2px @ini_text_alt;
				span {
					display: inline-block;
				}
			}
		}
		ul {
			text-align: right;
		}
		ul#nomobile {
			border: 1px solid transparent; // add transparent border to prevent jumping when proper border is added on hover
			margin: 0;
			li {
				list-style: none;
				a {
					display: block;
					line-height: @item-height;
					span {
						display: none; // hide label until hover
						margin: 0 @ico-margin;
					}
					svg {
						fill: @ini_border;
						margin: 0 @ico-margin/2;
						vertical-align: middle;
						@media (max-width: 375px) {
							opacity: 0.5;
						}
						&:hover {
							opacity: 1;
						}
					}
				}
				a:active,
				a:focus,
				a:hover { // on interaction show the full item
					background-color: @ini_background_alt;
					svg {
						fill: @ini_link;
					}
				}
			}
			li.admin,
			li.logout,
			li.login,
			li.media {
				border-bottom: skyblue 1px solid;
				margin-bottom: 2.5px;
				padding-bottom: 2.5px;
			}
			li.edit svg {
				animation: ani_op_low 1s linear 3s infinite alternate running;
			}
		}
		@media (max-width: 750px) {
			ul#nomobile {
				display: none;
			}
		}
		ul#mobile {
			select {
					-moz-appearance: none;
				-webkit-appearance: none;
							   appearance: none;
				background: url(images/burger.svg) no-repeat center center;
				height: 33px;
				width: 33px;
				option:first-child {
					display: none;
				}
			}
		}
		@media (min-width: 750px) {
			ul#mobile {
				display: none;
			}
		}
	}
	&.slav {
		#yandex_rtb {
			border: 1px solid #ddd;
			border-radius: 5px;
			clear: both;
			margin: 5px auto;
			max-height: 310px;
			max-width: ~"calc(100% - 72px)";
			overflow: hidden;
			padding: 5px;
			yatag {
				align-content: center;
			}
		}
	}
	footer {
		clear: both;
		div.breadcrumbs {
			clear: both;
			font-size: 8pt;
			padding: 4px 10px;
		}
		.social {
			padding-top: .3em;
			text-align: center;
			a {
				display: inline-block;
				&.rss {
					background: url( images/rss.png );
					border-radius: 5px;
					bottom: 1px;
					height: 29px;
					margin: 0 4px;
					position: relative;
					transform: scale(1.15);
					width: 29px;
					@media (max-width: 500px) {
						margin: 0 2px;
					}
				}
				&:not(.rss) {
					background: url( images/social.png );
					height: 32px;
					margin: 0 2px;
					width: 32px;
					@media (max-width: 500px) {
						margin: 0;
					}
				}
				&:nth-of-type(1),
				&.patreon {
					background-position: 0 0;
				}
				&:nth-of-type(2) {
					background-position: 0 -29px;
				}
				&:nth-last-of-type(2) {
					background-position: 0 -58px;
				}
				&:nth-last-of-type(1) {
					background-position: 0 -87px;
				}
				&.patreon {
					display: none;
				}
				&.discord {
					background-position: 0 -32px;
				}
				&.telegram {
					background-position: 0 -64px;
				}
				&.reddit {
					background-position: 0 -96px;
				}
				&.tumblr {
					background-position: 0 -128px;
				}
				&.facebook {
					background-position: 0 -160px;
				}
				&.twitter {
					background-position: 0 -192px;
					border: 1px solid #ddd;
					position: relative;
					top: 1px;
				}
				&.vkontakte {
					background-position: 0 -224px;
				}
				&.telegram,
				&.facebook,
				&.twitter,
				&.vkontakte {
					border-radius: 5px;
				}
			}
		}
		.count {
			bottom: 4px;
			float: right;
			position: relative;
			right: 30px;
			text-align: right;
			a {
				display: block;
				width: 105px; /* центрование социал-кнопок */
				img {
					border: 0;
					height: 31px;
					margin-top: 4px;
					width: 88px;
				}
			}
			noscript {
				img {
					left: -9999px;
					position: absolute;
				}
			}
		}
		.pageinfo,
		.user {
			clear: both;
			font-size: .8em;
			text-align: center;
		}
	}
	.middle {
		vertical-align: middle;
	}
	#acl__manager {
		table {
			margin-left: 0%;
			width: 100%;
		}
	}
	.april {
		transform: rotate(180deg);
	}
	.pad { // белый фон в просмотре
		background-color: white;
	}
	.m { // скруглятор
		border-radius: 5px;
		padding: 3px 5px;
	}
	.hyph { // переносы
		display: inline;
		hyphens: auto;
		-webkit-hyphens: auto;
		overflow-wrap: break-word;
		word-wrap: break-word;
		* {
			display: inline !important;
		}
	}
	.ratestar {
		vertical-align: sub;
		width: 20px;
		&.anim {
			animation: ani_rot 1.6s linear 0s infinite running;
		}
	}
	.li {
		font-weight: normal;
	}
	.cl_hr {
		background-color: #D5D1CB;
		border-width: 0;
		color: #D5D1CB;
		height: 1px;
		margin: 10px;
	}
}

nav div:hover::after {
	animation: ani_op_top 1.4s;
	color: #bbb;
	font: bold 15px DatFestComic,cursive;
	.lang-be & { content: "🡐 Мовы"; }
	.lang-bg & { content: "🡐 Езици"; }
	.lang-br & { content: "🡐 Línguas"; }
	.lang-da & { content: "🡐 Sprog"; }
	.lang-de & { content: "🡐 Sprachen"; }
	.lang-el & { content: "🡐 Γλώσσες"; }
	.lang-en & { content: "🡐 Languages"; }
	.lang-eo & { content: "🡐 Lingvoj"; }
	.lang-es & { content: "🡐 Idiomas"; }
	.lang-fi & { content: "🡐 Kielet"; }
	.lang-fr & { content: "🡐 Langues"; }
	.lang-he & { content: "🡐 שפות"; }
	.lang-hi & { content: "🡐 बोली"; }
	.lang-hu & { content: "🡐 Nyelvek"; }
	.lang-id & { content: "🡐 Bahasa"; }
	.lang-it & { content: "🡐 Lingue"; }
	.lang-ja & { content: "🡐 言語"; }
	.lang-ko & { content: "🡐 언어"; }
	.lang-pl & { content: "🡐 Języki"; }
	.lang-pt & { content: "🡐 Línguas"; }
	.lang-ru & { content: "🡐 Языки"; }
	.lang-tr & { content: "🡐 Diller"; }
	.lang-uk & { content: "🡐 Мови"; }
	.lang-zh & { content: "🡐 语言"; }
}

#ym-informer { // счётчик
	border-radius: 15px !important;
}

#send-msg-btn {
	z-index: 999;
}

.e_nav img { /* энтити back и up */
	margin: 0 auto 3px auto;
	width: 48px;
	background-color: #969696;
}