@import url('../../../interfaces/assets/css/simulator-modules.css');
@import url('../../../interfaces/assets/css/simulator-robot.css');

#board-viewer {
	height: 250px;
	background-size: contain;
}

#modal-imagePiCamera-body{
	display: flex;
	justify-content: center;
	align-items: center;
	object-fit: contain;
}

#modal-imagePiCamera-body img{
	max-width: 100%;
	max-height: 100%;
}




#raspberrypi-compassDir_anim {
	z-index: 1;
	width: 7%;
	height: auto;
	left: 27px;
	top: -8px;
	transform-origin: bottom center;
}



#raspberrypi_gesture_list {
	border-style: solid;
	border-width: 1px;
	border-color: var(--text-0);
	min-height: 1em;
}
.raspberrypi_current_gesture {
	border-color: var(--vitta-red);
	margin: 1em;
}

@keyframes shake {
	0% {
		transform: scale(1, 1);
	}
	50% {
		transform: scale(0.8, 0.8);
	}
	100% {
		transform: scale(1, 1);
	}
}

.raspberrypi_active_gesture_down {
	transform: rotate(180deg);
}
.raspberrypi-gesture-left_active,
.raspberrypi-gesture-right_active {
	-webkit-transform: rotateY(80deg);
	transform: rotateY(80deg);
}
.raspberrypi-gesture-facedown_active {
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.raspberrypi-gesture-freefall_active {
	transform: scale(0.2, 0.2);
}
.raspberrypi-gesture-shake_active {
	animation-name: shake;
	animation-duration: 0.3s;
	animation-iteration-count: infinite;
}
.raspberrypi-gesture-3g_active {
	animation-name: shake;
	animation-duration: 0.5s;
}
.raspberrypi-gesture-6g_active {
	animation-name: shake;
	animation-duration: 0.3s;
}
.raspberrypi-gesture-8g_active {
	animation-name: shake;
	animation-duration: 0.1s;
}

#raspberrypi-gesture-shake_anim,
#raspberrypi-gesture-up_anim,
#raspberrypi-gesture-down_anim,
#raspberrypi-gesture-left_anim,
#raspberrypi-gesture-right_anim,
#raspberrypi-gesture-faceup_anim,
#raspberrypi-gesture-facedown_anim,
#raspberrypi-gesture-freefall_anim,
#raspberrypi-gesture-3g_anim,
#raspberrypi-gesture-6g_anim,
#raspberrypi-gesture-8g_anim {
 	bottom: 6px;
}

#raspberrypi-accelerometer-pitch_anim,
#raspberrypi-accelerometer-roll_anim {
	bottom: -5px;
}

#raspberrypi-compassDir_anim {
	z-index: 1;
	width: 7%;
	height: auto;
	left: 27px;
	top: -8px;
	transform-origin: bottom center;
}