header {
  padding: 5px 5px 5px 15px;
  background-color: #252627; }

header .inner {
  margin: 0 auto;
  max-width: 1200px; }

header h1 {
  color: white;
  font-size: 28px;
  font-weight: 500; }

body {
  height: 100vh;
  margin: auto;
  background-color: #292a2d;
  font-family: 'Roboto', sans-serif;
  color: #a9a9b3; }

body a {
  color: #d1f7ff;
  text-decoration: none; }

body a:visited {
  color: #d1f7ff; }

.wrapper {
  display: grid;
  min-height: 100%;
  grid-template-rows: auto 1fr auto;
  margin: 0 auto; }

.content .main {
  margin: 0 auto;
  max-width: 1150px; }

footer {
  padding: 25px;
  background-color: #252627; }

footer .inner {
  margin: 0 auto;
  max-width: 1200px; }

.text-highlight {
  color: #05d9e8; }

.text-highlight-light {
  color: #d1f7ff; }

.main table {
  border-collapse: collapse;
  margin: 0 auto 15px auto; }

.main table, th, td {
  border: 1px #a9a9b3 solid; }

.main table th, td {
  padding: 10px; }

.badge-compat-status {
  border: 2px solid;
  padding: 2px 10px;
  border-radius: 5px; }

.badge-compat-full {
  color: rgba(30, 188, 97, 0.8);
  border-color: rgba(30, 188, 97, 0.8); }

.badge-compat-no-mp {
  color: rgba(249, 179, 47, 0.8);
  border-color: rgba(249, 179, 47, 0.8); }

.badge-compat-basic {
  color: rgba(231, 76, 60, 0.8);
  border-color: rgba(231, 76, 60, 0.8); }

.badge-compat-unsupported {
  color: rgba(169, 169, 179, 0.8);
  border-color: rgba(169, 169, 179, 0.8); }