
/*___ ___ ____ ___  _____   ___ 
\__  |   |    |   \/  _  \ |   |
 /   |   |    |   /  /_\  \|   |
 \____   |    |  /    |    \   |
 /_______|______/\____|____/__*/
/* =DESIGN SYSTEM STYLESHEET= */

/* style-root */
*{	outline: none; box-sizing:border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none;scroll-behavior: smooth; -webkit-tap-highlight-color: transparent;    -webkit-touch-callout: none;}

/*Morphing point*/	:root { --1s: 16px; }
@media screen and (max-width:320px) and (orientation:portrait){ :root{--1s: 4vw;}}

@media screen and (orientation: landscape) and (max-height: 450px) and (max-width: 950px) {:root{--1s: 1.7vw;}}
@media screen and (min-width:1280px) {	:root {--1s:17px;}}
@media screen and (min-width:1500px) {	:root {--1s:18px;}}
@media screen and (min-width:1800px) {	:root {--1s:19px;}}
@media screen and (min-width:1900px) {	:root {--1s:1.1vw;}}


:root {
	--01s: calc(var(--1s) * 0.125);
	--025s: calc(var(--1s) * 0.25);
	--05s: calc(var(--1s) * 0.5);
	--075s: calc(var(--1s) * 0.75); 
	--1_25s: calc(var(--1s) * 1.25); 
	--1_5s: calc(var(--1s) * 1.5); 
	--2s: calc(var(--1s) * 2);	
	--2_5s: calc(var(--1s) * 2.5); 
	--3s: calc(var(--1s) * 3); 
	--4s: calc(var(--1s) * 4); 
	--5s: calc(var(--1s) * 5);
	--6s: calc(var(--1s) * 6); 
	--7s: calc(var(--1s) * 7); 
	--8s: calc(var(--1s) * 8); 
	--9s: calc(var(--1s) * 9); 
	--10s: calc(var(--1s) * 10);
	--15s: calc(var(--1s) * 15);
	--17s: calc(var(--1s) * 17);
	--20s: calc(var(--1s) * 20); 		
	
	--c0: #001e00;
	--c1: #0a3200;
	--c2: #374f15;
	--c3: #916c2a;
	--c4: #ff893f;
	--c5: #ffa654;
	--c6: #ffc369;
	--c7: #ffe07e;
	--c8: #fffd93;
	--c9: #ffffbf;
	--c10: #ffffd9;
	
	
}

@media (prefers-color-scheme: dark){
	:root {	
		--c10: #001e00;
		--c9: #0a3200;
		--c8: #374f15;
		--c7: #916c2a;
		--c6: #ff893f;
		--c5: #ffa654;
		--c4: #ffc369;
		--c3: #ffe07e;
		--c2: #fffd93;
		--c1: #ffffbf;
		--c0: #ffffd9;

	}
}


html, body { margin:0; padding:0; max-width:100%; min-height:100%;}
body {overflow:hidden; /*word-wrap: break-word;*/overflow-wrap: anywhere; }
body, button, input, select, textarea{font-family: system-ui, sans-serif; font-size:var(--1s); -webkit-text-size-adjust: none;}


	
	




summary {cursor:pointer;}
pre {
  white-space: pre-wrap; /* переносить строки по ширине */
  word-wrap: break-word; /* переносить слова, если нужно */
}


/*style-shortener*/
	.biggest {font-size:25vmin!important;line-height:25vmin!important;max-width:100%;}
	.subbiggest {font-size:7vh!important;line-height:5vh!important;}
	.small {font-size:0.9em;}
	.bold {font-weight:bold;}
	.thin {font-weight:100;}
	.center {text-align:center; margin-left:auto; margin-right:auto;}
	.left {text-align:left; justify-content: flex-start;}
	.right {text-align:right; justify-content: flex-end;}
	.floatright {float:right;}
	.floatleft {float:left;}
	.notextline {text-decoration:none!important;}
	.textline {text-decoration:underline;}
	.nowrap {white-space:nowrap;}
	.word-break {word-break:break-all;}
	.word-break-normal {word-break:normal;}
	.overflow-hidden {overflow:hidden;}
	.overflow-x {overflow-x:auto; -webkit-overflow-scrolling:touch;  scrollbar-width: 0px; scrollbar-height: 0px;} .overflow-x::-webkit-scrollbar {display: none;}
	.overflow-x-hidden {overflow-x:hidden;}
	.overflow-x-clip {overflow-x:clip;overflow-y:visible;}
	.overflow-y {overflow-y:auto; -webkit-overflow-scrolling:touch;  scrollbar-width: 0px; scrollbar-height: 0px;} .overflow-y::-webkit-scrollbar {display: none;}
	.scroll {overflow:scroll;}
	.relative {position:relative;}
	.absolute {position:absolute;}
	.fixed {position:fixed;}
	.flex {display:flex;}
	.flex-grow-1 {flex-grow:1;}
	.flex-shrink-0 {flex-shrink:0;}
	.flex-wrap {flex-wrap: wrap;}
	.flex-column {flex-direction:column;}
	.flex-row-reverse {flex-direction:row-reverse;}
	.flex-start {align-items: flex-start;}
	.flex-center {align-items: center;}
	.block {display:block;}
	.inline {display:inline;width:auto;}
	.inline div {display:inline;}
	.inline-block {display:inline-block;}
	.table {display:table;width:100%;}
	.table-cell {display:table-cell;}
	.hidden {visibility: hidden;}
	.none, .loggedin .loggedin-none {display:none;}
	.vtop{ vertical-align: top;}
	.vmid{ vertical-align: middle;}
	.vbot{ vertical-align: bottom;}
	.right0 {right:0;}
	.left0 {left:0;}
	.top0 {top:0;}
	.bottom0 {bottom:0;}
	.z-index1 {z-index:1;} .z-index2 {z-index:2;} .z-index3 {z-index:3;} .z-index4 {z-index:4;} .z-index5 {z-index:5;}	
	.z-index-1 {z-index:-1;}
	.nomargin {margin:0;}
	.blog {margin-bottom:var(--2s);}
	.justifycenter {justify-content:center;}
	.justifybottom {justify-content:end;}
	.justifyspace {justify-content:space-evenly;}
	.justifyspacebetween {justify-content:space-between;}
	.objectfitcover {object-fit: cover;width:100%;height:100%;}
	.responsivetable {overflow-x:auto;} .responsivetable table {width:100%;}
	.editicons {position:relative;bottom:0;}
	.pointer {cursor:pointer;}
	.pointer-none {pointer-events: none;}
	.pointer-all {pointer-events: all;}
	.move {cursor:move;}

/*style-layout*/
	.noborder {border:none;}
	.nogap {gap:0;}
	.row-nogap {row-gap:0;}
	.margin {margin:var(--1s);}
	.marginright {margin-right:var(--1s);}
	.marginleft {margin-left:var(--1s);}
	.marginbottom {margin-bottom:var(--1s);}
	.marginbottom--05s {margin-bottom:var(--05s);}
	.margintop {margin-top:var(--1s);}
	.margin--05s {margin:var(--05s);}
	.margintop--05s {margin-top:var(--05s);}
	.margin--025s {margin:var(--025s);}
	.nopadding {padding:0;}
	.pad {padding:var(--1s);} .content.pad {padding:0;}
	.pad--05s {padding:var(--05s);}
	.pad2 {padding:var(--2s);} .pad3 {padding:var(--3s);} .pad4 {padding:var(--4s);} .pad5 {padding:var(--5s);}
	.paddingleft {padding-left:var(--1s);}
	.paddingright {padding-right:var(--1s);}
	.paddingtop {padding-top:var(--1s);}
	.paddingbottom {padding-bottom:var(--1s);}
	.topoffset {padding-top:var(--5s);}
	.topoffset10 {padding-top:calc(var(--5s) * 2);}
	.bottomoffset {padding-bottom:var(--5s);}
	.bottomoffset10 {padding-bottom:calc(var(--5s) * 2);}
	.leftoffset {margin-left:var(--5s);} .rightoffset {margin-right:var(--5s);}
	.rounded {border-radius: var(--1_5s); transition:0.5s ease;}
	.rounded:hover {border-radius: var(--2s);}
	.opacity05 {opacity:0.5;}	
	.br {border-style: solid;}
	.circle {border-radius: 50%;}

/* style-sizes */
	.fullheight {min-height:100vh;}
	.halfheight {max-height:50vh;}
	.height100 {height:100%;}
	.fullwidth {width:100%; max-width:100%;}
	.width--05s {width:var(--05s);} .width--1s {width:var(--1s);} .width--2s {width:var(--2s);} .width--3s {width:var(--3s);} .width--4s {width:var(--4s);} .width--5s {width:var(--5s);} .width--7s {width:var(--7s);}   .width--10s {width:calc(var(--5s) * 2);} .width--15s {width:calc(var(--5s) * 3);}  .width--17s {width:var(--17s);} .width--20s {width:calc(var(--5s) * 4);}
	.height--025s {height:var(--025s);} .height--05s {height:var(--05s);} .height--1s {height:var(--1s);} .height--2s {height:var(--2s);} .height--3s {height:var(--3s);} .height--4s {height:var(--4s);} .height--5s {height:var(--5s);} .height--7s {height:var(--7s);}
	.size--05s {font-size:var(--05s);} .size--1s {font-size:var(--1s);} .size--1\.25s {font-size:calc(var(--1s) * 1.25);} .size--1\.5s {font-size:calc(var(--1s) * 1.5);}  .size--2s {font-size:var(--2s);} .size--3s {font-size:var(--3s); line-height:var(--3s);} .size--4s {font-size:var(--4s);} .size--5s {font-size:var(--5s);}
	.weight100 {font-weight: 100;}  .weight900 {font-weight: 900;}
	.line-height--1em {line-height:1em;}


button, .button, input[type="button"], input[type="submit"], input::file-selector-button {
	text-align: center;
	padding: var(--05s) var(--05s);
	min-width: var(--2_5s);
	min-height: var(--2_5s);
	transition: all 0.2s ease-in-out;
	cursor: pointer;
	border: var(--01s) solid transparent;
	border-radius: var(--1_5s);
	text-decoration: none!important;
	vertical-align: middle;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color:var(--c4);
	color:var(--c10);
	filter: contrast(1.12);
}

button:hover, .button:hover, input[type="button"]:hover, input[type="submit"]:hover, input::file-selector-button:hover {
	filter:contrast(1.2);
}

.midbutton {font-size:var(--1_25s); padding: var(--05s) var(--1s); min-width: var(--3s);  min-height: var(--3s);}
.bigbutton {font-size: var(--1_5s);    padding: var(--1s) var(--2s);}	


select option {padding:var(--05s) var(--1s);}

textarea {font-size:var(--1s); padding: var(--1s); min-height:var(--5s); min-width: 100%; width:100%;  max-width: 100%; border: var(--01s) solid #656565; opacity: 1; background: transparent;}
input:not(input[type=text]), select, option { border-radius: var(--1_5s);}
input[type="datetime-local"], input[type="date"], input[type="text"], input[type="url"], input[type="color"], input[type="password"], input[type="email"], input[type="number"],input[type="tel"], select { outline: none; max-width: 100%; width: 100%; min-height: var(--2_5s); padding: var(--025s) var(--1s);   border:none; border: var(--01s) solid; opacity: 1;  }
input[type="text"] {border-width: 0 0 var(--01s) 0; border-radius:0;}
input[type="checkbox"] { margin:0; }
input[type="color"] {border-bottom:0;}
input[type="radio"]+label, nav input[type="radio"]:checked+label { border:var(--01s) solid transparent;}
input[type="radio"]:checked+label { background:var(--c3); border:var(--01s) solid var(--c5);}
input[type="file"] {width:100%; }
input::file-selector-button {   padding: var(--025s) var(--1s);   min-width: var(--3s); transition: all 0.2s ease-in-out; cursor: pointer;}


















/* style-colors */


	body {background-color:var(--c10); color:var(--c1);}
	a {color:var(--c1);}
	::placeholder {color: var(--c5);}
	input[type], textarea {color: var(--c4); background-color:transparent;}
	input[type=checkbox] + span, input[type=radio] + span {border-color:var(--c7); background-color:var(--c11);}
	input[type=checkbox] + span:after, input[type=radio] + span:after  { background-color: var(--c7);}
	input:checked + span {border-color:var(--c5); background: var(--c6); }
	input:checked + span:after {border-color: var(--c5); background-color: var(--c2);}
	.borderbottom:after { background:var(--c5);}
	.systemfill {fill:var(--c0);} .systemstroke {stroke:var(--c0);}
	.transparent {background-color:transparent;}
	@supports not (-webkit-touch-callout: none) { .background-fixed {background-attachment:fixed;}}
	.background {background-repeat: no-repeat;  background-size: cover; background-position: center center;}
	.background-opacity:before {content:'';position:absolute;left:0;right:0;top:0;bottom:0;background:rgba(255,255,255,0.5);}

	.ui_fil0 {fill:var(--c0);}
	.ui_fil1 {fill:var(--c1);}
	.ui_fil2 {fill:var(--c2);}
	.ui_fil3 {fill:var(--c3);}
	.ui_fil4 {fill:var(--c4);}
	.ui_fil5 {fill:var(--c5);}
	.ui_fil6 {fill:var(--c6);}
	.ui_fil7 {fill:var(--c7);}
	.ui_fil8 {fill:var(--c8);}
	.ui_fil9 {fill:var(--c9);}
	.ui_fil10 {fill:var(--c10);}
	.ui_fil11 {fill:var(--c11);}

	.bg0, body .bg0 {background-color:var(--c10); fill:var(--c10);}
	.bg1, body .bg1 {background-color:var(--c9); fill:var(--c9);}
	.bg2, body .bg2 {background-color:var(--c8); fill:var(--c8);}
	.bg3, body .bg3 {background-color:var(--c7); fill:var(--c7);}
	.bg4, body .bg4 {background-color:var(--c6); fill:var(--c6);}
	.bg5, body .bg5 {background-color:var(--c5); fill:var(--c5);}
	.bg6, body .bg6 {background-color:var(--c4); fill:var(--c4);}
	.bg7, body .bg7 {background-color:var(--c3); fill:var(--c3);}
	.bg8, body .bg8 {background-color:var(--c2); fill:var(--c2);}
	.bg9, body .bg9 {background-color:var(--c1); fill:var(--c1);}
	.bg10, body .bg10 {background-color:var(--c0); fill:var(--c0);}
	.bg11, body .bg11 {background-color:transparent; fill:none;}

	.c0, body .c0  {color:var(--c0);}
	.c1, body .c1 {color:var(--c1);}
	.c2, body .c2 {color:var(--c2);}
	.c3, body .c3 {color:var(--c3);}
	.c4, body .c4 {color:var(--c4);}
	.c5, body .c5 {color:var(--c5);}
	.c6, body .c6 {color:var(--c6);}
	.c7, body .c7 {color:var(--c6);}
	.c8, body .c8 {color:var(--c8);}
	.c9, body .c9 {color:var(--c9);}
	.c10, body .c10 {color:var(--c10);}
	
	svg.c0 {stroke: var(--c0);}	
	svg.c1 {stroke: var(--c1);}	
	svg.c2 {stroke: var(--c2);}	
	svg.c3 {stroke: var(--c3);}	
	svg.c4 {stroke: var(--c4);}	
	svg.c5 {stroke: var(--c5);}	
	svg.c6 {stroke: var(--c6);}	
	svg.c7 {stroke: var(--c7);}	
	svg.c8 {stroke: var(--c8);}	
	svg.c9 {stroke: var(--c9);}	
	svg.c10 {stroke: var(--c10);}	
	svg.c11 {stroke: none;}
	
	.br0 {border-color:var(--c0)!important;}
	.br1 {border-color:var(--c1)!important;}
	.br2 {border-color:var(--c2)!important;}
	.br3 {border-color:var(--c3)!important;}
	.br4 {border-color:var(--c4)!important;}
	.br5 {border-color:var(--c5)!important;}
	.br6 {border-color:var(--c6)!important;}
	.br7 {border-color:var(--c7)!important;}
	.br8 {border-color:var(--c8)!important;}
	.br9 {border-color:var(--c9)!important;}
	.br10 {border-color:var(--c10)!important;} 


	
	
/* style-print */
/* PRINT */
@media print {
/*	@page { size:796px 1126px; margin:10mm;} */
	:root { --1s: 11px; }

	body {  max-width:100%; background-color:#fff!important;color:#000!important;}

	* {background-attachment:initial!important; }
	.morf-landing .morf_wrap {height:auto;}
	.boxshadow {box-shadow:none;}
	#content {grid-column: span 12;}
	#sidebar, .create, .search, .mainmenu, .booking, .question, .adminmenu, .user-settings,  .usermenu, .userpro   {display:none!important;}
	#logo {position:absolute;}
	.mobilefixedbottom{position:relative!important;}
	section, #objects article, #objects .list, .stick, #map, footer, p, tr {page-break-inside: avoid;}
	.noprint {display:none;}
}





html, body {
  -webkit-overflow-scrolling: touch; /* инерция, как на iOS */
  scrollbar-width: thin; /* Firefox */
  scrollbar-color: rgba(255,255,255,0.3) transparent; /* Firefox */
}

/* WebKit браузеры (Chrome, Safari, Edge) */
::-webkit-scrollbar {
  width: 6px; /* ширина полосы */
  background: transparent; /* прозрачный фон */
}

::-webkit-scrollbar-track {
  background: transparent; /* фон трека */
}

::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.4); /* сам ползунок */
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,0.6);
}





@media screen and (max-width:767px) and (orientation: portrait){
	.nomobile {display:none;}
	.mobile-center {text-align:center;margin-left:auto; margin-right:auto;}
	.mobile-doublewidth { overflow:hidden;}
	.mobile-doublewidth div:first-child { width: 200vw; max-width:200vw; transform: translate(-50vw, 0%);}
	.mobile-fullheight {min-height:100vh;}
	.mobile-flex {display:flex;}
	.mobile-flex-wrap {flex-wrap:wrap;}
	.mobile-flex-column {flex-direction:column;}
	.mobile-block {display:block;}
	.mobile-topoffset {padding-top:var(--5s);}
	.mobile-bottomoffset {padding-bottom:var(--5s);}
	.mobilefixedbottom {position:fixed; bottom:0;left:0;right:0;top:auto; z-index:1;width:100%;}
	.mobile-marginleft {margin-left:var(--1s);}
	.mobile-marginright {margin-right:var(--1s);}
	.mobile-size--1\.25s {font-size:calc(var(--1s) * 1.25);}
	
}




.playpause {width:var(--4s); height:var(--4s); border-radius:50%;}

.playpause svg {width:var(--2s); height:var(--2s);}




#yuaidjs-app {
  transition: opacity 0.3s ease;
  overflow-y:auto;
  max-height:calc(100vh - var(--6s));
}

.transition-fade-in {
  opacity: 1;
  transition: opacity 0.3s ease;
}

.transition-fade-out {
  opacity: 0;
  transition: opacity 0.3s ease;
}


audio { opacity: 0; animation: visualizerFade 1.5s ease forwards; }
canvas { opacity: 0;  animation: visualizerFade 1.5s ease forwards; }

@keyframes visualizerFade {
    0% {
        opacity: 0;
    }
    33.33% { /* 0.5 сек из 1.5 */
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.playpause .spin {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}