html, body{
	width: 100%;
	height:100%;
	margin:0;
	padding:0;
}
html{
	font-size: 14px;
	font-family: Tahoma, Arial;
	/*--menu-item-size: 10.1;/* для вмещения девяти элементов верхнего меню */
	/*--menu-item-size: 13; /* для вмещения семи элементов верхнего меню */
	--menu-item-size: 15.5; /* для вмещения шести элементов верхнего меню */
	/*--menu-item-size:19;*/
	--checkbox-size: calc(1 * var(--rel-units));
}
body{
	font-size: 1rem;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.btn {
    font-size: 1rem;
    display: flex;
    padding: 0 5px;
    border-radius: 3px;
    border: solid 1px #999;
    background: #eee;
    color: #000;
    height: 30px;
    margin-right: 5px;
    align-items: center;
    line-height: 1rem;
}
.btn:hover{
	cursor: pointer;
}
.btn[disabled="disabled"] {
    background: #aaa;
    color: #ccc;
}
.btn[disabled="disabled"]:hover{
	cursor: default;
}

#row30:before{
	content: "Содержимое файла:";
	padding-right: 10px;
}

#row10{
	line-height: 3rem;
}
#version:before{
	content: "от";
	padding: 0 1.5vw;
}
#title{
	font-weight: bold;
	
}
#source-file-name:before{
	content: "Файл:";
	padding-right: 10px;
}
#source-file-name{
	padding-right:10px;
}
#source-file,
#menu-item-model-open-file{
	display:none;
}
#btn-source-file:before{
	content: "Открыть";
}
#function-selector{
	width:300px;
}
#graph-type{
	width:300px;
}
select{
	height: 40px;
	/*padding-top:10px;*/
	display: flex;
	align-items: center;
}
#mobile-menu-btn{
	display:none;
}


#row45{
	flex-direction: column;
}

#row45:before{
	content: "Калькулятор функции:";
    padding-top: 20px;
    padding-bottom: 5px;
}

#text-is-copied-container{
	position: fixed;
    top: 115px;
    left: 320px;
    margin: 0 auto;
    z-index: 100;
    /* width: 100%; */
    text-align: center;
    display: flex;
    align-items: center;
    align-content: center;
    background-color: #fff;
    border: solid 1px #000;
    padding: 10px;
}

#row45 .var-cont{
	display: flex;
    flex-direction: row;
}

#row45 span.default{
	width: 145px;
	padding-left: 15px
}

#row45 #calc-opts-cont .var-cont:first-child span.default{
	padding-left: 0px
}

#row45 #calc-opts-cont .var-cont:last-child span.default{
	width: 70px;
}

#row45 input{
	width: 45px;
}

#calc-opts-cont{
	display: flex;
	flex-direction: row;
}


g.c3-legend-item.c3-legend-item-data0 > line.c3-legend-item-tile{
	/*display:none;*/
}

.calc-var-btn-cont button{
	height: 10px;
    display: flex;
    align-items: center;
    font-size: 0.5rem;
}

.calc-var-btn-cont button:before{
	content: "\25b2";
	display: inline-block;
}

.calc-var-btn-cont .down:before{
	transform: rotate(180deg);
}

.hidden{
	display:none;
}

#svg3d{
	border: solid 1px #ddd;
	width: 800px;
	height: 600px;
}

#btn-remote-test-source-file:before{
	content: "Загрузить тестовые данные";
}







#popup-modal-wnd-voile{
	position:fixed;
	width:100%;
	height:100%;
	max-height:100%;
	background: hsla(0, 0%, 0%, 0.5);
	display:flex;
	z-index:10000;
	top:0;
	left:0;
	align-items: center;
	justify-content:center;
}

#popup-modal-wnd{
	width:400px;
	height:auto;
    max-height: 100%;
	position:relative;
	background: #fff;
	font-size:100%;
}

#popup-modal-wnd input{
	font-size: 100%;
}

#popup-modal-wnd-title-cont > div{
	padding:5px 30px 5px 10px;
	background:transparent;
	width: auto;
}

#popup-modal-wnd-title-cont{
	/*position: absolute;
	top:0;
	left:0;*/
	width:100%;
	padding: 5px 0 3px 0px;
	background: hsl(0, 0%, 30%);
	color:#FFF;
	font-weight:bold;
}


#popup-modal-wnd-html-cont{
	/*padding:40px 5px 5px;*/
	padding:5px 5px 5px;
	width:100%;
	/*overflow: hidden;*/
	max-height: 100%;
	overflow-y: auto;
}
#popup-modal-wnd-html-cont-inner{
	overflow:auto;
	display: flex;
    /*flex-direction: column-reverse;*/
    flex-direction: column;
}
#popup-modal-wnd-close-btn:before{
    content: "X";
    background-color: #a00;
    color: #FFF;
    text-align: center;
    font-weight: bold;
    justify-content: center;
    display: flex;
    align-items: center;
    width: 7.5vh;
    height: 7.5vh;
    font-size: 5vh;
}


#popup-modal-wnd-close-btn{
	position:absolute;
	top:5px;
	right:5px;
	padding:0;
	margin:0;
	height: 20px;
}

.menu{
	display: flex;
	flex-direction: column;
}
.menu-list{
	display: flex;
	flex-wrap: wrap;
}
.menu-row{
	flex-direction: row;
}
ul.menu-list.menu-row{
	padding:0;
	background: #eee;
	width: 100%;
}
ul.menu-list.menu-col{
	flex-direction: column;
	padding:0;
}

li.disabled,
li[diasbled],
.menu-list > .menu-list-item.disabled{
	color: hsla(0, 0%, 50%, 0.9);
}
.menu-list > .menu-list-item.disabled:hover,
.menu-list > .menu-list-item.disabled > .menu-list-item-icon:hover{
	cursor: not-allowed;
}
.menu-list > .menu-list-item > label > .menu-list-item-icon > svg,
.menu-list > .menu-list-item > .menu-list-item-icon > svg{
	fill: currentColor;
}

ul.menu-list{
	margin: 0;
    padding: 5px;
    overflow: auto;
}

ul.menu-list > li{
	list-style: none;
}

ul.menu-col .menu-list-item{
	padding:0 0 1vh 0;
}

ul.menu-col .menu-list-item:last-child{
	padding:0;
}

ul.menu-col.menu-list > li.menu-list-item{
	/*padding:0 0 1vh 0;*/
	padding:0;
}

ul.menu-col.menu-list > li.menu-list-item:first-child{
	padding:0;
}

ul.menu-row .menu-list-item{
	/*width:12vw;*/
	/*height:12vw;*/
	padding:0 1vw 0 0;
	background: #fff;
	position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}


ul.menu-row .menu-list-item:last-child{
	padding:0;
	margin-right:0;
}

.menu-list-item{
	position: relative;
}

#menu-cont-top,
#info-cont-bottom{
	/* position: fixed;
	bottom:0;
	left:0;
	right:0; */
	z-index: 200;
}
#menu-cont-top{
	bottom:auto;
	top:0;
}
.menu-list-item-icon{
	width:12vw;
	height:12vw;
	width:48px;
	height:48px;
	display: flex;
    align-items: center;
    cursor: pointer;
    background: #fff;
    flex-direction: column;
	justify-content: center;
	position: absolute;
    /**border: dashed 3px #888;/**/
    z-index: 10;
}
.menu-list-item > .title{
	z-index: 20;
	padding: 10px 10px 10px 20px;
}

#popup-modal-wnd-voile,
#popup-modal-wnd-voile *,
#cursor-info-wnd,
#cursor-info-wnd *,
#debug-step,
#debug-step > *,
.menu-list-item,
.menu-list-item-icon,
.menu-list-item > .title{
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	
}

.test .menu-list-item-icon{
	border: solid 1px green;
}
.test ul.menu-list{
    border: solid 1px red;
}

.menu-list-item-icon > .title{
	text-align: center;
}

html{
	--rel-units: 4px;
}


/* относительные единицы измерения */

	#model-filename{
/*		padding-top: calc(4 * var(--rel-units));*/
	    font-size: calc(3 * var(--rel-units));
	    overflow: hidden;
	    display: flex;
    	align-items: center;
    	width:100%;
    	position: relative;
    	height: calc(3.5*var(--rel-units));
	}
	
	#marker-display .marker.row{
		font-size:calc(3 * var(--rel-units));
		padding-top:calc(3 * var(--rel-units));
	}
	
	#model-marker-selector > .marker.row > input[type="radio"]{
		width: calc(10 * var(--rel-units));
		height: calc(10 * var(--rel-units));
	}
	
	.btn-cont{
		padding-top: calc(5 * var(--rel-units));
	}
	
	.btn-cont .btn {
	    font-size: calc(3 * var(--rel-units));
	    padding: calc(3 * var(--rel-units));
	}
	
	#scene-cont-1{
	    top: calc(12 * var(--rel-units));
	    bottom: calc(5 * var(--rel-units));
	    height: calc(100% - calc(12 * var(--rel-units)) - calc(5 * var(--rel-units)));
	}
	
	
	#cursor-info-wnd{
		font-size: calc(2 * var(--rel-units));
	}
	
	#scene-cont-1{
	    padding-top: calc(12 * var(--rel-units));
	    padding-bottom: calc(12 * var(--rel-units));
	}
	
	#popup-modal-wnd-close-btn:before{
	    width: calc(7.5 * var(--rel-units));
	    height: calc(7.5 * var(--rel-units));
	    font-size: calc(5 * var(--rel-units));
	}
	
	#popup-modal-wnd-close-btn{
	    height:calc(7.5 * var(--rel-units));
	}

	#popup-modal-wnd-title-cont{
		height: calc(8.2 * var(--rel-units));
	    font-size: 120%;
	}
		
	
	#bottom-menu-item-view-cursor > li,
	#bottom-menu-item-view-scale > li,
	#bottom-menu-item-view-move > li,
	#bottom-menu-item-view-rotate > li,
	#bottom-menu-item-view-view > li,
	#bottom-menu-item-view-params > li {
		font-size:calc(3.8 * var(--rel-units));
	}
	
	li#menu-list-item-view-cursor-Fn,
	li#menu-list-item-view-scale-Fn,
	li#menu-list-item-view-move-Fn,
	li#menu-list-item-view-rotate-Fn{
		font-size: calc(8 * var(--rel-units));
    	font-weight: bold;
	}
	
	.submenu > li > .submenu {
		padding-top: calc(3 * var(--rel-units));
	}
	
	.menu-list-item-icon > .title{
		font-size:calc(2.7 * var(--rel-units));
	    padding-top: calc(0.8 * var(--rel-units));
	}
	
	ul.menu-row .menu-list-item{
		/*width:calc(var(--menu-item-size) * var(--rel-units));*/
		/*height:calc(var(--menu-item-size) * var(--rel-units));*/
		padding:0 0 0 0;
		margin-right: calc(1 * var(--rel-units));
		font-size: calc(2.7 * var(--rel-units));
		font-size: calc(calc(var(--menu-item-size) * 0.245) * var(--rel-units));
	}
	.menu-list-item-icon{
		font-size: calc(2.7 * var(--rel-units));
		font-size: calc(calc(var(--menu-item-size) * 0.245) * var(--rel-units));
		background-color: transparent;
	}
	#menu-cont-top > .menu-list > .menu-list-item > .submenu{
		top: 40px;
		left:calc(0.5 * var(--rel-units));
	}
	.submenu > li{
		font-size: calc(3 * var(--rel-units));
		padding: calc(3 * var(--rel-units)) 0 calc(3 * var(--rel-units)) 0;
	}
	
	#menu-list-item-view-rotate-x-matrix .title,
	#menu-list-item-view-move-x-matrix .title,
	#menu-list-item-view-rotate-x .title,
	#menu-list-item-view-move-x .title,
	#menu-list-item-view-rotate-y-matrix .title,
	#menu-list-item-view-move-y-matrix .title,
	#menu-list-item-view-rotate-y .title,
	#menu-list-item-view-move-y .title,
	#menu-list-item-view-rotate-z-matrix .title,
	#menu-list-item-view-move-z-matrix .title,
	#menu-list-item-view-rotate-z .title,
	#menu-list-item-view-move-z .title{
		font-size: calc(9 * var(--rel-units));
	}



#menu-item-file > .menu-list-item-icon:before{
	background: none;
}

.menu-list-item-icon:before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	width:100%;
	height:100%;
	background-image: url("/img/icon.png");
    background-repeat: no-repeat;
    background-position-x: 50%;
    background-position-y: 50%;
    opacity:.2;
}

.menu-list-item-icon .title{
	opacity:1;
	z-index: 100;
}



.menu-list-item-icon > svg{
	text-align: center;
	margin: 0 auto;
}

#scene-cont-1{
	width: 100%;
    /* height: 100%; */
    position: fixed;
    /*top: 0;*/
    margin: 0;
    padding: 0;
    z-index: 110;
   /* bottom: 0;*/
    left: 0;
    right: 0;
    background-color: transparent;
}



.menu-list-item.hidden.active{
	display:flex;
	/*position:fixed;*/
	z-index:1000;
}

#menu-cont-top > .menu-list > .menu-list-item > .submenu{
	position: fixed;
	padding:0 10px 0;
	background-color: hsla(0, 0%, 100%, 0.9);
	display: none;
	flex-direction: column;
	border-radius: 2px;
}
/*#menu-cont-top > */
.menu-list > .menu-list-item.active /* > .menu-list-item-icon */{
	background-color: #bbb;
}

#menu-item-file > .title{
	position:absolute;
	bottom:0;
}


#menu-cont-top > .menu-list > .menu-list-item.active > .submenu{
	display: flex;
	z-index: 120;
}
.submenu > li > .submenu {
    padding-left: 0;
    display: none;
}

.submenu > li.active > .submenu {
    display: flex;
    flex-direction: column;
}

.submenu .submenu > li{
	padding-left:5vh;
}
.submenu .submenu > li:first-child{
	border-top: solid 1px #000;
}
.submenu > li{
	display: flex;
    border-bottom: solid 1px #000;
	flex-direction: column;
	position: relative;
}

.submenu > li:last-child{
	border:none;
}

.submenu .submenu > li:last-child{
	padding-bottom: 0;
}

.submenu > li:hover{
	cursor: pointer;
}


.debug{
	display:none;
}
body[debug] .debug{
	display: block;
}

#debug-step{
	position: absolute;
    top: 0;
    right: 0;
    display: flex;
    flex-direction: column;
}
#debug-step-rotation:before{
	content:"Вращ. шаг: ";
}
#debug-step-move:before{
	content:"Смещ. шаг: ";
}
#debug-step-zoom:before{
	content:"Масш. шаг: ";
}

#debug-step-cursor:before{
	content:"Шаг курсора: ";
}

#menu-list-item-view-rotate-x-matrix,
#menu-list-item-view-move-x-matrix,
#menu-list-item-view-rotate-x,
#menu-list-item-view-move-x{
	color: red;
}

#menu-list-item-view-rotate-y-matrix,
#menu-list-item-view-move-y-matrix,
#menu-list-item-view-rotate-y,
#menu-list-item-view-move-y{
	color: green;
}

#menu-list-item-view-rotate-z-matrix,
#menu-list-item-view-move-z-matrix,
#menu-list-item-view-rotate-z,
#menu-list-item-view-move-z{
	color: blue;
}

*[disabled],
*[disabled] *{
	color: #999;
}

body[debug] *[realization]:before{
	content:"";
	display: block;
	width: calc(4 * var(--rel-units));
	height: calc(4 * var(--rel-units));
	position: absolute;
	top:0;
	left:0;
}

*[realization="partial"]:before{
	background-color:blue;
}

*[realization="not-realized"]:before{
	background-color:red;
}

*[realization="full"]:before{
	background-color:green;
}

#menu-list-item-view-cursor-x[state='up'] .title:before,
#menu-list-item-view-move-x[state='up'] .title:before,
#menu-list-item-view-rotate-x-matrix[state='cw'] .title:before{
	content: 'x+';
}

#menu-list-item-view-cursor-x[state='down'] .title:before,
#menu-list-item-view-move-x[state='down'] .title:before,
#menu-list-item-view-rotate-x-matrix[state='ccw'] .title:before{
	content: 'x-';
}

#menu-list-item-view-cursor-y[state='up'] .title:before,
#menu-list-item-view-move-y[state='up'] .title:before,
#menu-list-item-view-rotate-y-matrix[state='cw'] .title:before{
	content: 'y+';
}

#menu-list-item-view-cursor-y[state='down'] .title:before,
#menu-list-item-view-move-y[state='down'] .title:before,
#menu-list-item-view-rotate-y-matrix[state='ccw'] .title:before{
	content: 'y-';
}

#menu-list-item-view-move-z[state='up'] .title:before,
#menu-list-item-view-rotate-z-matrix[state='cw'] .title:before{
	content: 'z+';
}

#menu-list-item-view-move-z[state='down'] .title:before,
#menu-list-item-view-rotate-z-matrix[state='ccw'] .title:before{
	content: 'z-';
}

#menu-list-item-view-cursor-step[state='up'] .title:before,
#menu-list-item-view-scale-step[state='up'] .title:before,
#menu-list-item-view-move-step[state='up'] .title:before,
#menu-list-item-view-rotate-step[state='up'] .title:before{
	content: 'Шаг+';
}

#menu-list-item-view-cursor-step[state='down'] .title:before,
#menu-list-item-view-scale-step[state='down'] .title:before,
#menu-list-item-view-move-step[state='down'] .title:before,
#menu-list-item-view-rotate-step[state='down'] .title:before{
	content: 'Шаг-';
}

#menu-list-item-view-rotate-axes[state='global'] .title{
	text-transform: uppercase;
}

#menu-list-item-view-rotate-axes[state='local'] .title{
	text-transform: lowercase;
}

.param.row > .name:after{
	content: ":";
	padding-right:1vw;
}

.param.row.rot-x-deg > .value:after,
.param.row.rot-y-deg > .value:after,
.param.row.rot-z-deg > .value:after,
.param.row.rot-step > .value:after{
	content: "°";
}

li.menu-list-item[state-available='0,xyz,A'][state='0'] .title:before{
	content: '(0)';
}
li.menu-list-item[state-available='0,xyz,A'][state='xyz'] .title:before{
	content: '(xyz)';
}
li.menu-list-item[state-available='0,xyz,A'][state='A'] .title:before{
	content: '(A)';
}


#menu-list-item-view-cursor-display[state='on'] .title:before{
	content: "On";
}
#menu-list-item-view-cursor-display[state='off'] .title:before{
	content: "Off";
}
#menu-list-item-param-axes[state='local'] .title,
#menu-list-item-param-axes[state='local'] .title .default{
	text-transform: lowercase;
}
#menu-list-item-param-axes[state='global'] .title,
#menu-list-item-param-axes[state='global'] .title .default{
	text-transform: uppercase;
}

#cursor-x,
#cursor-y{
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:0;
	height:0;
	border:none;
	padding:0;
	margin:0;	
}
#cursor-x{
	border-right: solid 3px #eee;
	bottom: 0;
    z-index: 150;
    height: 100%;
}

#cursor-y{
	border-bottom: solid 3px #eee;
	right: 0;
    z-index: 150;
    width: 100%;
}

#cursor-info-wnd{
    position: fixed;
    z-index: 190;
    max-width: calc(50% - 10px);
    max-height: calc(50% - 10px - 19vh);
    background: hsla(0, 0%, 100%, 0.9);
    border: dotted 2px #00a;
    margin: 10px;
    min-width: 25%;
    min-height: 25px;
}

.cursor-info-row{
	padding:2px;
}
.cursor-info-row .title{
	padding-right: 10px;
	font-weight: bold;
}
.cursor-info-row .title:after{
	content: ":";
}
.cursor-info-row .title .default{
	
}
.cursor-info-row .value{
	
}





.arjs-loader {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
  }
 
  .arjs-loader div {
    text-align: center;
    font-size: 1.25em;
    color: white;
  }
  #error-popup{
    z-index: 99999;
    color: #fff;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    justify-content: center;
    height: 100%;
    background-color: hsla(0, 0%, 0%, 0.5);
   }

#arjs-video,
#gscam-video{
	z-index: 100!important;
	/*width: 1252px;*/ 
	/*height: 939px; */
	position: absolute; 
	/*top: calc(calc(var(--top-menu-rows-count) * var(--menu-item-size)) + calc(19 * var(--rel-units)));*/ 
	left: 0px; 
	/*z-index: -2;*/ 
	/*margin-left: -192px;*/ 
	margin-top: 0px;
	/*width: 100%;
	height: 100%;
	/*bottom:0;*/
	right:0;
}
.btn-cont{
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.btn-cont .btn{
	
}

#model-marker-selector > .marker.row  {
    display: flex;
    align-items: center;
}

#marker-display {
    display: flex;
    flex-direction: column;
    flex-basis: fit-content;
    align-items: center;
}

#marker-display > img{
	width: fit-content;
}

#marker-display > .btn-cont:first-child{
	padding-top:0;
}

body.popup-on > #scene-cont-1,
body.popup-on > video#arjs-video{
	display: none;
}

input.position-offset-value{
	width:75vw;
}
#info-cont .row .title{
	font-weight: bold;
	padding-right: calc(1 * var(--rel-units));
}
#info-cont .row .title:after{
	content: ":";
}

#marker-display .marker.row .text{
	cursor: pointer;
}

#setup-cont .row{
	display: flex;
}

#popup-modal-wnd  #setup-cont  .row  .title {
	font-size: calc(2 * var(--rel-units));
	width: 70%;
}

#popup-modal-wnd  #setup-cont > .row > .title{
	font-size: calc(2 * var(--rel-units));
}

#setup-cont .row .value{
	width: 25%;
}

#setup-cont .row .value input,
#setup-cont .row .value select{
	width: 100%;
}

#popup-modal-wnd .scan2{
	display: flex;
    vertical-align: middle;
    align-items: center;
    flex-direction: column;
}

#scan2-snapshot,
#scan2-snapshot-bg{
	position: fixed/*absolute*/;
    top: 0/*calc(2 * var(--relative-inuts))*/;
    /*left: 0;*/
    /*width: 100%;*/
    height: 100%;
    display: block;
    z-index: 200;
}

#scan2-snapshot-bg{
	z-index: 100;
}

#scan2-snapshot.scene1,
#scan2-snapshot.scene2{
	height: auto;
	top: calc(12 * var(--rel-units));
}

#scan2-snapshot.scene1{
	background: #fff;
}

#scan2-snapshot.scene2{
	background: #ddd;
}


#info-cont-bottom{
	height: calc(5 * var(--rel-units));
	background-color: #eee;
	flex-direction: row;
	font-size: calc(2.3 * var(--rel-units));
}

#info-cont-bottom .param{
	display: inline-flex;
	padding-right: 15px;
}
#info-cont-bottom .param:last-child{
	padding-right: 0px;
}

#info-cont-bottom .param .name{
	font-weight: bold;
}

#info-cont-bottom .param .name:after{
	content: ":";
	padding-right: 5px;
	
}

#menu-cont-bottom{
	position: fixed;
	bottom:0;
	left:0;
	right:0;
	z-index: 200;
}
#menu-cont-bottom > ul > li > ul > li > ul{
	bottom: calc(13 * var(--rel-units));
}
#menu-cont-bottom > .menu-list.menu-col{
	flex-flow: column-reverse;
}
#menu-cont-bottom > ul > li > ul > li > ul{
	display:none;
	list-style: none;
    position: fixed;
    left: 0;
    right: 0;
    padding: 0;
    flex-direction: row;
    background: #ddd;
    align-items: center;
    text-align: center;
}

#menu-cont-bottom > ul > li > ul > li.active > ul{
	display:flex;
}

#snap-cont{
	position: fixed;
    z-index: 150;
    width: 100%;
    height: 100%;
    display: block;
    top: calc(12 * var(--rel-units));
    bottom: 0;
    left: 0;
}
#snap-scn{
	z-index: 160;
}

#snap-scn,
#snap-cam{
	position: fixed;
    top: 0; /*calc(12*var(--rel-units));*/
    left: 0;
}

#snap-cam{
	z-index: 155;
	top:0;
	left:0;
	width:100%;
}

#debug-snapshot-number{
	display: flex;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    color: #fff;
    z-index: 170;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    font-size: calc(50*var(--rel-units));
    opacity: 0.3;
    text-shadow: calc(2 * var(--rel-units)) calc(2 * var(--rel-units)) black;
}

#debug-snapshot-number:before{
	content: "S";
}


#gps-params{
	padding-top: calc(1.5 * var(--rel-units));
	font-size:   calc(2.9   * var(--rel-units));
	display: flex;
    flex-wrap: wrap;
    height: calc(14 * var(--rel-units));
}
#gps-params > span{
	padding-right: 10px;
	font-size:   calc(2.9   * var(--rel-units));
	display: flex;
}
#gps-params > span:last-child{
	padding-right: 0px;
}
#gps-params > span:before{
	padding-right:5px;
	font-weight: bold;
	font-size:   calc(2.9   * var(--rel-units));
}
#gps-params > span#abs-latitude:before{
	/* широта, измеренное значение */
	content: "ШИ:";
}
#gps-params > span#abs-longitude:before{
	/* долгота, измеренное значение */
	content: "ДИ:";
}
#gps-params > span#avg-latitude:before{
	/* широта, среднее значение */
	content: "ШС:";
}
#gps-params > span#avg-longitude:before{
	/* долгота, среднее значение */
	content: "ДС:";
}
#gps-params > span#abs-accuracy:before{
	/* точность */
	content: "Т:";
}
#gps-params > span#abs-accuracy:not(.empty):after{
	content: " м";
}
#gps-params > span#abs-altitude:before{
	/* высота, измеренное значение */
	content: "ВИ:";
}
#gps-params > span#abs-altitude-accuracy:before{
	/* точность высоты */
	content: "ТВ:";
}
#gps-params > span#abs-altitude-accuracy:not(.empty):after{
	content: " м";
}
#gps-params > span#naklon:before{
	/* Наклон */
	content: "Нкл:";
}
#gps-params > span#cam-naklon:before{
	/* Наклон */
	content: "НклКам:";
}
#gps-params > span#naklon-average:before{
	/* Наклон, усреднённое значение */
	content: "НклСр:";
}
#gps-params > span#naklon:not(.empty):after,
#gps-params > span#kren:not(.empty):after,
#gps-params > span#povorot:not(.empty):after,
#gps-params > span#cam-naklon:not(.empty):after,
#gps-params > span#cam-kren:not(.empty):after,
#gps-params > span#cam-povorot:not(.empty):after,
#gps-params > span#naklon-average:not(.empty):after,
#gps-params > span#kren-average:not(.empty):after,
#gps-params > span#povorot-average:not(.empty):after{
	/* Поворот */
	content: "\00b0";
}
#gps-params > span#kren:before{
	/* Крен */
	content: "Кр:";
}
#gps-params > span#cam-kren:before{
	/* Крен */
	content: "КрКам:";
}
#gps-params > span#kren-average:before{
	/* Крен, усреднённое значение*/
	content: "КрСр:";
}
#gps-params > span#povorot:before{
	/* Поворот */
	content: "Пв:";
}
#gps-params > span#cam-povorot:before{
	/* Поворот */
	content: "ПвКам:";
}
#gps-params > span#povorot-average:before{
	/* Поворот, усреднённое значение */
	content: "ПвСр:";
}
#gps-params > span#gps-data-count:before{
	/* Время усреднения показаний */
	content: "Кол:";
}
#gps-params > span#avg-time:before{
	/* Время усреднения показаний */
	content: "Вр:";
}
#gps-params > span#avg-time:not(.empty):after{
	/* Время усреднения показаний */
	content: " с";
}

@counter-style examples {
  system: numeric;
  symbols: "0" "1" "2" "3" "4" "5" "6" "7" "8" "9";
  prefix: "Пример ";
}

#main-menu-example > .submenu > li{
	list-style: examples;
	display: list-item;
    list-style-position: inside;
}

#main-menu-example > .submenu > li:marker:before{
	content: "Пример ";
	display: contents;
}

#model-filename > span#flag{
	display: block;
	position: absolute;
	top:0;
	right:0;
	height: 100%;
	width: auto;
	aspect-ratio: 1/1;	
}
#model-filename > span#flag.step-1{
	background-color: #F00;
}
#model-filename > span#flag.step-2{
	background-color: #FF0;
}
#model-filename > span#flag.step-3{
	background-color: #0F0;
}

.parameter-cont{
	display: flex;
}
.parameter-cont .value input{
	height:calc(3 * var(--rel-units));
}
.parameter-cont .value select{
	height:calc(4.6 * var(--rel-units));
}
#readonly-params-cont,
#editable-params-cont{
	width: 100%;
    flex-wrap: wrap;
}

#project-name{
	width: calc(80 * var(--rel-units));
}
#latitude,
#longitude{
	width: calc(20 * var(--rel-units));
}
#vert-correction{
	width: calc(12 * var(--rel-units));
}

#rotation,
#naklon,
#fovh,
#fovv,
#h1,
#h2,
#h3{
    width: calc(10 * var(--rel-units));
}

#pix{
	width: calc(18 * var(--rel-units));
}

#filename2,
#filename{
	width: calc(160 * var(--rel-units));
}

html{
	--checkbox-size: calc(4 * var(--rel-units));
	--target-border-width: 3px;
	--top-menu-rows-count: 2;
	--target-padding-top: calc(calc(var(--top-menu-rows-count) * calc(var(--menu-item-size)) + 19) * var(--rel-units));
	--target-height: calc(100% - var(--target-padding-top) - (calc(calc(3.6 + var(--menu-item-size)))) * var(--rel-units)); 
}
@media(orientation: portrait){
	html{
		--top-menu-rows-count: 2;
	}
}
@media(orientation: landscape){
	html{
		--top-menu-rows-count: 1;
	}
}
/*
@media(max-aspect-ratio: 1/1){
	video#gscam-video{
		height: 100%;
		width: auto;
	}
}
@media(min-aspect-ratio: 1/1){
	video#gscam-video{
		height: auto;
		width: 100%;
	}
}
*/
#model-filename:before{
	content: "Проект: ";
	padding-right: calc(2 * var(--rel-units));
}

.row{
	display: flex;
	flex-direction: row;
}
#popup-modal-wnd  #gscam-project-name-cont > .row{
	font-size: calc(3 * var(--rel-units));
}
#popup-modal-wnd  #gscam-project-name-cont > .row > .title{
	/*font-size: calc(2 * var(--rel-units));*/
	width: 35%;
}

#gscam-project-name-cont .row .value{
	width: 60%;
}

#gscam-project-name-cont .row .value input,
#gscam-project-name-cont .row .value select{
	width: 100%;
}


#snap-cont-cf,
#snap-cont-img,
#snap-cont-cs{
	position: absolute;
	top:0;
	width: 100%;
    height: 100%;
    z-index: 105;
    left: 0;
    right: 0;
    bottom: 0;
}



#gscam-settings-snapshots-save-on-device{
	width: var(--checkbox-size);
	height: var(--checkbox-size);
}


#menu-cont-bottom ul.menu-list.menu-col {
	align-items: center;
} 

#menu-item-cf-submenu,
#menu-item-cf-submenu > ul,
/*#menu-item-cf-submenu > ul > li,*/
#menu-item-cs-submenu,
#menu-item-cs-submenu > ul
/*#menu-item-cs-submenu > ul > li*/,
#menu-item-giro-submenu,
#menu-item-giro-submenu > ul,
#menu-item-vertical-submenu,
#menu-item-vertical-submenu > ul,
#menu-item-cv1-vertical-submenu,
#menu-item-cv1-vertical-submenu > ul,
#menu-item-nrd-submenu,
#menu-item-nrd-submenu > ul,
#menu-item-img-submenu2-send
{
	/*border-radius: 50%;*/
	width: 100%;
}

#menu-item-cf-submenu-shot,
#menu-item-cs-submenu-shot,
#menu-item-giro-submenu-shot,
#menu-item-cv1-vertical-submenu-shot,
#menu-item-vertical-submenu-shot{
	background: red;
	margin: 0 auto;
	border-radius: 50%;
	/*width: calc(var(--menu-item-size) * var(--rel-units));*/
}
#menu-item-cs-submenu-shot,
#menu-item-giro-submenu-shot,
#menu-item-cv1-vertical-submenu-shot,
#menu-item-vertical-submenu-shot{
	--border-size: calc(1.8 * var(--rel-units));
	width: calc((var(--menu-item-size) * var(--rel-units)) - var(--border-size) * 2);
	height: calc((var(--menu-item-size) * var(--rel-units)) - var(--border-size) * 2);
}
#menu-item-cf-submenu-shot > div,
#menu-item-cs-submenu-shot > div,
#menu-item-giro-submenu-shot > div,
#menu-item-cv1-vertical-submenu-shot > div,
#menu-item-vertical-submenu-shot > div{
	background: transparent;
}

#menu-item-cs-submenu-shot,
#menu-item-giro-submenu-shot,
#menu-item-cv1-vertical-submenu-shot,
#menu-item-vertical-submenu-shot{
	border: solid calc(2 * var(--rel-units)) yellow;
	color: yellow;
    /*font-size: 500%;*/
    font-weight: bold;
}
#menu-item-giro-submenu-shot{
	border-color: aqua;
}
#menu-item-vertical-submenu-shot{
	border-color:blue/* lime*/;
}
#menu-item-cv1-vertical-submenu-shot{
	border-color:#00e107;
}

#menu-item-cs-submenu-shot > .title{
	font-size: 390%;
}

#menu-item-img-submenu,
#menu-item-img-submenu2-send,
#default-bottom-menu,
#menu-item-camx-submenu{
	width: 100%;
	background-color: #eee;
	/*display: flex;
    align-items: center;*/
}
#menu-item-img-submenu > ul,
#menu-item-img-submenu2-send > ul,
#menu-item-camx-submenu > ul{
	/*padding-left:10%;*/
	/*padding-right:10%;*/
	width: fit-content;
	margin: 0 auto;
}
#menu-item-img-submenu > ul,
#menu-item-cf-submenu > ul,
#menu-item-cs-submenu > ul,
#menu-item-giro-submenu > ul,
#menu-item-vertical-submenu > ul,
#menu-item-cv1-vertical-submenu > ul,
#menu-item-nrd-submenu > ul,
#menu-item-camx-submenu > ul,
#default-bottom-menu{
	padding-top: calc(1.8 * var(--rel-units));
	padding-bottom: calc(1.8 * var(--rel-units));
}
#default-bottom-menu{
	/*display: none;*/
	display: block;
    position: fixed;
    bottom: 0;
    width: 100%;
}
#main-menu-docs a{
	text-decoration: none;
	color:#000;
	display: flex;
}

body:not([debug]) [realization="not-realized"]{
	display: none;
}
#menu-item-file > ul > li:before{
	display: none;
}
#scene-cont-1{
	display: flex !important;
	align-items: center;
	color: #666;
	font-size:200%;
	z-index: 100;
}
#gscam-settings-cont .row .title{
    width: calc(47 * var(--rel-units));
    /*border-bottom: solid 1px #777;*/
}
#gscam-settings-cont .row .value{
    width: calc(40 * var(--rel-units));
    align-items: center;
    display: flex;
}
#gscam-settings-cont .row .value input{
	width: 100%;
}
#gscam-settings-cont .row:last-child .title{
	border-bottom: none;
}
#menu-item-img-submenu.hidden{
	display: none;
}
#menu-item-img-submenu.hidden.active{
	display: flex;	
}
#orientation-type:before{
	content: "K: ";
}
#alpha0:before{
	content: "Пв0: ";
}
#refresh-number:before{
	content: "Н: "
}
#alphaCorrection:before{
	content: "Ппр: "
}
#menu-item-nrd-submenu > ul,
#menu-item-camx-submenu > ul{
	margin: 0 auto;
    width: fit-content;
}
#menu-item-nrd-submenu,
#menu-item-camx-submenu{
	background-color: #eee;
}
div#target
/*, div#target-cross*/{
	width: 100%;
	height: 100%;
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	display: flex;
	/*align-items: center;*/
	flex-direction: row;
	/*padding-top: var(--target-padding-top);*/
	z-index: 110;
}
div#target-cross,
div#target-grid{
	width:100%;
	/*height: var(--target-height);*/
	position: relative;
}

div#target-cross > div{
	border:  solid var(--target-border-width) #ddd;
	width: calc(50% - calc(0.5 * var(--target-border-width)));
	height: calc(50% - calc(0.5 * var(--target-border-width)));
	position: absolute;
}
div#target-cross > div:nth-child(1){
	top:0;
	left:0;
	border-left: none;
	border-top: none;
}
div#target-cross > div:nth-child(2){
	top:0;
	right:0;
	border-right: none;
	border-top: none;
}
div#target-cross > div:nth-child(3){
	bottom:0;
	left:0;
	border-left: none;
	border-bottom: none;
}
div#target-cross > div:nth-child(4){
	bottom:0;
	right:0;
	border-bottom: none;
	border-right: none;
}

div#target > div.hidden{
	display: none;
}
#target-grid ,
#target-grid table{
	width: 100%;
	height: 100%;
	border-collapse: collapse;
}
#target-grid table tr {
	height: calc(25% - calc(0.5 * var(--target-border-width)));
}
#target-grid table tr td{
	width: calc(25% - calc(0.5 * var(--target-border-width)));
	height: calc(25% - calc(0.5 * var(--target-border-width)));
	border: solid var(--target-border-width) #ddd;
}
#target-grid table tr:first-child td{
	border-top: none;
	height: 25%;
}
#target-grid table tr:last-child td{
	border-bottom: none;
	height: 25%;
}

#target-grid table tr td:last-child{
	border-right: none;
	width: 25%;
}

#target-grid table tr td:first-child{
	border-left: none;
	width: 25%;
}
#gscam-video{
	/*--video-top: calc(calc(var(--top-menu-rows-count) * var(--menu-item-size)) + calc(19 * var(--rel-units)));*/ 
	z-index: 100;
	object-fit: cover;
	/*width: auto;*/
    margin: 0 auto;
	/*top: var(--video-top); 
	height: calc(calc(calc(100% - var(--video-top)) - calc(3.6 * var(--rel-units))) - var(--menu-item-size));*/
	position: initial;
	background-color: #0f0;
}
#snap-img{
	/*width:100%;
	height: 100%;*/
	/*z-index: 100;*/
    object-fit: cover;
    /* width: auto; */
    margin: 0 auto;
    position: initial;
}
#camIndex:before{
	content: "Cam:";
	font-weight: bold;
}

#camFOVh:before{
	content: "FOV:";
	font-weight: bold;
}
#camFOVh{
	padding-right: 5px;
}
#osv:before{
	content: "Осв:";
	font-weight: bold;
}
#osv{
	padding-right: 5px;
}
.cam-number:before{
	content: "№";
	font-weight: bold;
	padding-right: calc(0.5 * var(--rel-units));
}
.cam-number,
.cam-type,
.cam-id,
.cam-label{
	padding-right:calc(3 * var(--rel-units));
}
.cam-type:before{
	content: "Тип:";
	font-weight: bold;
	padding-right: calc(0.5 * var(--rel-units));
}
.cam-id:before{
	content: "Идентификатор:";
	font-weight: bold;
	padding-right: calc(0.5 * var(--rel-units));
}
.cam-label{
	display: block;
}
.cam-label:before{
	content: "Описание:";
	font-weight: bold;
	padding-right: calc(0.5 * var(--rel-units));
}
.row-camera-info {
    padding-bottom: calc(3 * var(--rel-units));
    font-size: calc(3 * var(--rel-units));
}
#video-image-resolution:before{
	content: "Разрешение текущее: ";
}
#video-resolution:before{
	content: "Разр: ";
	font-weight: bold;
}
#video-resolution{
	padding-right: 5px;
}
#video-cont{
	position:absolute;
	left:0;
	right:0;
	width:100%;
	display: flex;
	align-items: center;
	background-color: #000;
}

#cameras-info .resolutions{
	display: flex;
	flex-direction: column;
}

/*
#cameras-info .resolutions:before{
	content: "Доступные разрешения: ";
	font-weight: bold;
}
*/
#cameras-info .resolutions .resolution:before{
	font-style: italic;
}
#cameras-info .resolutions .resolution.min:before{
	content: "Минимальное разрешение: ";
}
#cameras-info .resolutions .resolution.middle:before{
	content: "Среднее разрешение: ";
}
#cameras-info .resolutions .resolution.max:before{
	content: "Максимальное разрешение: ";
}
#snap-cont-img{
	position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    display: flex;
    align-items: center;
    background-color: #000;
}

#menu-item-cs-submenu-shot.small{
	font-size:calc(2 * var(--rel-units));
}

#menu-item-vertical-submenu-shot.mode1:after,
#menu-item-cv1-vertical-submenu-shot.mode1:after{
	content: "1";
    position: absolute;
    left: 120%;
    color: #000;
}

#menu-item-vertical-submenu-shot.mode2:after,
#menu-item-cv1-vertical-submenu-shot.mode2:after{
	content: "2";
    position: absolute;
    left: 120%;
    color: #000;
}

ul#main-menu-docs-submenu > li > a{
	font-size: 80%;
}

#alphaCorrection.alert{
	background-color:#f00;
	color:#fff;
	font-weight: bold;
}

#pano-and-map-cont{
	display: flex;
	height: -webkit-fill-available;
    position: absolute;
    left: 0;
    width: 100%;
    bottom:0;
    right:0;
}

#pano-and-map-cont[layout='horizontal'] #map,
#pano-and-map-cont[layout='horizontal'] #panorama,
#panorama,
#map{
	width: 50%;
	height: 100%;
}

#pano-and-map-cont[layout='vertical']{
	flex-direction: column;
}

#pano-and-map-cont[layout='horizontal']{
	flex-direction: row;
}

#pano-and-map-cont[layout='vertical'] #map,
#pano-and-map-cont[layout='vertical'] #panorama{
	width: 100%;
	height: 50%;
}

#pano-and-map-cont.vertical {
    padding-left: 40px;
}


#pano-to-map-relation {
    z-index: 100;
    position: absolute;
    height: 2px;
    width: 100%;
}

#pano-and-map-cont[layout="vertical"] #pano-to-map-relation-cont {
    position: absolute;
    top: 0;
    left: 10px;
    width: 40px;
    height: 100%;
    z-index: 10;
    overflow: hidden;
}

#pano-and-map-cont[layout="vertical"] #pano-to-map-relation {
    position: absolute;
    top: 0;
    left: 0;
    width: 100px;
    height: 100%;
    transform: rotate(90deg);
    margin: 0px 0px 0 20px;
}

#menu-item-file{
	width: 70px;
    height: 60px;
    padding-top: 10px 
}

#apikey-value{
	width: 350px;
}

#menu-icon {
    width: 100%;
    height: 100%;
    background-color: transparent;
}

#menu-icon > .menu-icon-line {
    --height-value: calc(100% / 6.0);
    width: 100%;
    height: var(--height-value);
    border-bottom-color: #000;
    border-bottom-style: solid;
    background-color: transparent;
}

#menu-item-name2,
#filename2-cont
{
	display: none;
}

* {
	/*outline: solid 1px red !important;*/
	/*background-color: hsla(240, 50%, 50%, 0.2);*/
}