body {
	max-width: 900px;
	margin: auto;
	font-family: sans-serif;
    background-color: #d9d8d8;
}

table {
	border-collapse:collapse;
	width:100%;
	max-width:900px;
	min-width:400px;
	text-align:center;
}

table, th, td {
	border: 1px solid gray;
}

th, td {
	height: 24px;
	padding:4px;
	vertical-align:middle;
}

.ok {
	background-color: #64bc64;
}

.maybe {
	background-color: #f4c570;
}

.fail {
	background-color: #ff7b7b;
}

.unavailable {
    background-color: #d8d8d8;
}
.mime{
    width: 120px;
}
.check-hdr {
	content: "MediaQueries is not supported";
}

@media (dynamic-range: standard) {
	.check-hdr {
		color: red;

	}

	.check-hdr::before {
		content: "This browser only supports SDR on this display";
	}
}

@media (dynamic-range: high) {
	.check-hdr {
		color: green;
	}

	.check-hdr::before {
		content: "This browser supports HDR on this display";
	}
}