body {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
}
.containerAim {
	position: relative;
}

.central {
	width: 64px;
	height: 64px;
	background-color: transparent;
	position: absolute;
	left: calc(50% - 70px); /* Центрируем с учетом ширины элемента и полосы - 75px */
	top: calc(50% - 32px); /* Центрируем по вертикали */
	z-index: 10;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	font-weight: bold;
	user-select: none;
	opacity: 0.65;
	transition: opacity 0.2s ease, transform 0.2s ease;
	transform: scale(1); /* Начальный масштаб для анимации */
}

/*.central {
		width: 64px;
		height: 64px;
		background-color: transparent; 
		position: absolute; 
		left: calc(50% - 70px);
		top: calc(50% - 32px);
		z-index: 10;
		cursor: pointer; 
		display: flex;
		justify-content: center;
		align-items: center;
		color: white;
		font-weight: bold;
		user-select: none; 
		opacity: 0.65;
		transition: opacity 0.2s ease, transform 0.2s ease; 
		transform: scale(1); 
}*/

.item {
	width: 64px;
	height: 64px;
	/*background-color: rgba(128, 128, 128, 0.25);*/ /* Прозрачный серый фон */
	background-color: rgba(7, 7, 7, 0.45);
	/*backdrop-filter: blur(2px);*/ /* Размытие фона */
	/*border: 2pt solid rgba(255, 255, 255, 0.2);*/ /* Полупрозрачная граница */
	position: absolute;
	opacity: 0;
	transition: opacity 0.3s ease, transform 0.3s ease; /* Плавный переход для opacity и transform */
	transform: scale(0); /* Начальный масштаб для анимации */
	border-radius: 10px; /* Скругление углов на 10px */
	user-select: none; /* Отключение выделения текста */
	display: flex;
	justify-content: center; /* Центрирование по горизонтали */
	align-items: center; /* Центрирование по вертикали */
	cursor: pointer; /* Указатель при наведении */
}

.item.show {
	opacity: 1; /* Полная видимость */
	transform: scale(1); /* Восстанавливаем масштаб */
}

.item:hover {
	transform: scale(1.2); /* Увеличение элемента при наведении */
	transition: transform 0.15s ease; /* Плавный переход */
}

.itemImg {
	width: 40px;
	height: 40px;
	margin: 0 auto;
	padding: 13px;
	display: block;
}

.enableMarkClass{
	margin:0;
	padding:0;
	width:15px; 
	height:15px; 
	position:absolute; 
	right: 2px; /*3px; */
	top: 2px; /*-5px;*/
	z-index:10;
	background-size: cover; 
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0.5;
}

.enableType{
	background-image: url(/mil_icons/enableMark-03@x2.png);
}

.disableType{
	background-image: url(/mil_icons/enableMark-05@x2.png);
}

.enableLblClass{
	margin:0;
	padding:0;
	width:15px; 
	height:15px; 
	position:absolute; 
	right:20px; 
	top:3px; /* 18px; */
	z-index:10;
}
/* Compact marker-type menu on phones */
@media screen and (max-width: 900px) {
  .item {
    width: 68px;
    height: 68px;
  }
  .itemImg {
    width: 42px;
    height: 42px;
    padding: 13px;
  }
  .enableMarkClass {
    width: 16px;
    height: 16px;
    right: 1px;
    top: 1px;
  }
}

/* Full-viewport marker menu on phones */
@media screen and (max-width: 900px) {
  #aimContainer.containerAim {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 5000;
    pointer-events: none;
  }
  #aimContainer .central,
  #aimContainer .item {
    pointer-events: auto;
  }
  #aimContainer .central {
    left: calc(50% - 32px);
  }
}

/* Do not show the map aim over the mobile back-side card. */
#card.flipped #aimContainer.containerAim {
	visibility: hidden !important;
	pointer-events: none !important;
}
