/*
 * The rules that put an asset on a screen.
 *
 * The asset is given the whole viewport and object-fit does the rest: it scales
 * the content up as well as down, so a 1080p file on a 4K screen fills it
 * rather than sitting quarter-size in the middle, and it letterboxes on black
 * wherever the aspect ratio does not match. That covers a portrait-mounted
 * screen with no configuration.
 */

html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	background: #000;
	overflow: hidden;
}

body {
	cursor: none;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.pbg-monitors-stage {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	overflow: hidden;
}

.pbg-monitors-asset {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: center;
	object-position: center;
	pointer-events: none;
}