style.css

@tailwind base;
@tailwind components;
@tailwind utilities;

html {
  @apply h-full;
}

body {
  @apply bg-gray-900 text-white h-full;
}

table {
  @apply bg-gray-800 mx-auto my-6 rounded mb-28;
}

thead {
  @apply rounded;
}

tbody {
  @apply rounded;
}

th {
  @apply text-left last:text-right p-4 bg-gray-600 first:rounded md:first:rounded-none md:first:rounded-l last:rounded-r first:table-cell hidden md:table-cell;
}

tbody tr {
  @apply hover:bg-gray-700;
}

td {
  @apply text-base p-4 first:p-0 last:text-right first:table-cell hidden md:table-cell;
}

td a {
  @apply block p-4 text-left;
}

h1 {
  @apply text-xl align-middle;
}

/* Font Awesome icons (but very manually) */

@font-face {
  font-family: 'font-awesome';
  src: url('fa-brands-400.ttf');
}

.fa-lg {
	font-size: 1.33333em;
}

.fab {
	font-family: 'font-awesome';font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
  display: inline-block;
}

.fa-facebook-f::before {
	content: "\f39e";
}

.fa-linkedin-in::before {
	content: "\f0e1";
}

.fa-github::before {
	content: "\f09b";
}