/* *,*:before,*:after { transition: .25s ease-in-out; } */

:root{
	--windows-zValue: 100;
	--z-index-header: 999;
	--z-index-footer: 999;

	--master-color-selected:red;
	--master-color:gray;
	--second-color: rgb(103, 151, 255);
	--second-color-hover: rgb(37 99 235);
	--master-color-transparent:rgba(128, 128, 128, 0.73);

	--border-color: rgb(209 213 219);
}

table{ border-spacing: 0px; }
.opacity-25{ opacity: 0.25; }
.opacity-75{ opacity: 0.75; }

code{
	font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
}

body{
	/* background: rgb(9,9,121); */
	/* background: linear-gradient(0deg,rgba(9,9,121,1) 0%,rgba(255,255,255,1) 100%); */
	background-color: #edfbf8;
	background-attachment: fixed;
	font-family: 'Arial','Sans';
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	font-size: .875rem;
}

code,.code{
	font-family:'JetBrains Mono';
	-webkit-touch-callout: default;
	-webkit-user-select: text;
	-khtml-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
}

.green{ color: green; }
.status.green{ color: rgba( 22 163 74 ); }
.status.green .stroke{ stroke: rgba( 22 163 74 ); }
.orange{ color: orange; }
.status.orange{ color: rgba( 234 88 12 ); }
.status.orange .stroke{ stroke: rgba( 234 88 12 ); }
.status.indigo{ color: rgba( 147 51 234 ); }
.status.indigo .stroke{ stroke: rgba( 147 51 234 ); }
.status.purple{ color: rgba( 79 70 229 ); }
.status.purple .stroke{ stroke: rgba( 79 70 229 ); }
.red{ color: red; }
.status.red{ color: rgba( 220 38 38 ); }
.status.red .stroke{ stroke: rgba( 220 38 38 ); }


.ico{ margin: 2px; }
.loader svg .stroke{ stroke: var( --second-color-hover ); }
.loader{ color: var( --second-color-hover ); }

hr{
	height: 1px;
	width: 100%;
	background-color: var( --master-color );
	background-image: none;
	margin: 0px;
}

footer{
	color: black;
}
footer .button{
	display: flex;
	opacity: 0.6;
	flex-direction: column;
	font-size: 9pt;
	align-items: center;
	background: none;
}

header .button{ padding: 0px; }
#contentBox{ display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; justify-content: center; }



.block{
	margin: 4px;
}

.block .content{
	margin: 12px;
}
.block .value b{ font-size: 24pt; }
.block .additionalValue, .info{ font-size: 9pt; color: var( --master-color ); }
.block .content canvas{
	width: 100%;
	height: 320px;
}



.button{
	border: none;
	padding: 4px 24px;
	font-size: 14px;
	font-weight: 500;
	border-radius: 4px;
	cursor: pointer;
}
.button.clear{
	background: none;
	color: var( --main-color );
}
.button.clear:hover{ background: var( --master-color-transparent ); }
.button.submit{
	background-color: var( --master-color );
	color: white;
}
.button.submit:hover{ background-color: #5e35b1; }


.logString{
	margin: 2px 4px;
}
.logString:nth-child( odd ){
	background-color: #f0f0f0f0;
}
.logString > :first-child {
	color: gray;
	font-size: 10pt;
	font-style: italic;
}
.logString:hover{
	background-color: #dadadaf0;
}

.sr-only{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border-width: 0;
}


#mapBox{
	width: 100vw;
	height: 95vh;
}


#dChart{ height: 256px; }
#dChart.hide{ height: 6px; }



#windows_container{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba( 0, 0, 0, .5 );
	z-index: var( --windows-zValue );
}
.window{
	background-color: white;
	border-radius: 8px;
	width: 90%;
	height: 85%;
	max-height: 85%;
	min-width: 24em;
	position: static;
	margin: 8px;
	font-size: 12pt;
}
/* .window.device{ max-width: 21em; z-index: auto; } */
.window .header{
	margin: 4px 8px;
}
.borderBottom, .window .header{
	border: 0px solid var(--border-color);
	border-bottom-width: 1px;
}
.window .header text{ font-size: unset; }
.window .header .name{ text-align: left; }
/* .window .title, .window .content{ margin: 8px; }
.window .title{ font-size: 22px; }
.window .string .ico{ margin-right: 4px; } */


.string{
	display: flex;
	justify-content: space-between;
	margin-top: 4px;
	margin-bottom: 4px;
}


table tr:nth-child(odd){
/* table tr:nth-child(even):not(:last-child){ */
    background: #eee;
}

table thead tr{ background: none !important; }
table td, #contentBox th{ padding-top: 8px; padding-bottom: 8px; }

#usernameBox{ font-weight: bold; }

/* .leftMenu{
	border: 0px solid var(--border-color);
	border-top-width: 1px;
	border-bottom-width: 1px;
} */

.sidebar{
	background-color: rgb(249 250 251);
	width: 320px;
	border: 1px solid var(--border-color);
}
/* .sidebar > div:nth-child(even):not(:last-child){
	border: 0px solid var(--border-color);
	border-top-width: 1px;
	border-bottom-width: 1px;
} */
.sidebar .button.selected{
	box-sizing: border-box;
	border: 0px solid #e5e7eb;
	color: var( --second-color );
	background-color: white;
	border-radius: .25rem;
	line-height: 1.25rem;
	box-shadow: 0 1px 3px 0 rgb(0 0 0/0.1),0 1px 2px -1px rgb(0 0 0/0.1);
}
.sidebar .button .ico{ margin-right: 12px; width: 18px; height: 18px; }

.versionBox, .userBox, .leftMenu{
	margin: 2px 12px;
	border: 0px solid var(--border-color);
	border-top-width: 1px;
	margin-bottom: 0px;
}

input, button, .block, select{
	border-radius: 5px;
	border: 1px solid var(--border-color);
	background-color: white;
}

input, button, select{
	padding-top: .5rem;
	padding-bottom: .5rem;
	padding-left: .625rem;
	padding-right: .625rem;
	position: relative;
	margin: 4px;
}

input[type="text"]:focus, input[type="password"]:focus{
	border-color: rgb(59 130 246/var(--tw-border-opacity,1));
	box-shadow: rgb(191 219 254/var(--tw-ring-opacity,1) ),0 0 #0000;
}

input[type="submit"], button.submit{
	outline-color: #3b82f6;
	outline-width: 0;
	color: white;
	text-align: center;
	background-color: rgb(59 130 246);
	border-color: transparent;
}
.button:not([disabled]):hover, button:not([disabled]):hover{
	background-color: rgb(229 231 235/.5);
}
.button:disabled, button:disabled{
	color: rgb(156 163 175/var(--tw-text-opacity,1));
	cursor: default;
}
input[type="submit"]:hover, button.submit:hover{
	background-color: var( --second-color-hover );
}
input[type="submit"]:disabled, button.submit:disabled{
	background-color: rgb(147 197 253/var(--tw-bg-opacity,1));
	color: white;
}
input[type="submit"]:disabled > svg .stroke, button.submit:disabled > svg .stroke{
	stroke: white;
}


#main_window .header{
	border: 0px solid var( --border-color );
	border-bottom-width: 1px;
	background-color: white;
}



.loginForm{
	width: 465px;
}

.loginForm .content{
	background-color: white;
	border-radius: .5rem;
	border: 1px solid #e5e7eb;
	padding: 1.5rem;
}

.loginForm .content text{ margin-top: 8px; margin-bottom: 8px; }


/* .ymaps-2-1-79-balloon{ min-width: 256px; } */
.ymaps-2-1-79-map-copyrights-promo{ display: none; }




/* ANIMATIONS */

@keyframes spin {
  to {
    transform:rotate(1turn)
  }
}
.animate-spin {
  animation:spin 1s linear infinite
}