html {
  height: 100%;
}

body.LOL {
  margin: 0;
  height: 100%;
}

div.UNPLUGGED {
  height: 100%;
}

div.UNPLUGGED > section:first-child {
  margin-top: 0;
}
div.UNPLUGGED > section {
  margin-top: 4rem;
}

.t.center {
  text-align: center;
}

/* ============================================================ */
/* TEODOR GJØR TING 1 */

.LOL ul#jen1 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 1rem;
}

/* ============================================================ */
/* TEODOR GJØR TING 2 */

.LOL ul#jen2 {
  display: grid;

  /* SAY WHAT? */
  /* Columns never smaller than 200px, but never larger than the whole row. */
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-gap: 1rem;
}

/* ============================================================ */
/* TEODOR GJØR TING 3 */

.LOL ul#jen3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 1rem
}

/* Kewl, works. */

.LOL ul#jen3
li:nth-child(2),
.LOL ul#jen3
li:nth-child(6)
{
  grid-row: 1;
}

.LOL ul#jen3
li:nth-child(8),
.LOL ul#jen3
li:nth-child(10)
{
  grid-row: 2;
}

/* COPY-PASTA FOR HELP */

.LOL ul#jen3 li:nth-child(2),
.LOL ul#jen3 li:nth-child(6){
  background: #444;
}
.LOL ul#jen3 li:nth-child(8),
.LOL ul#jen3 li:nth-child(10){
  background: #4794B8;
}

/* ============================================================ */
/* TEODOR GJØR TING 3 MOD */

.LOL ul#jen3MOD
li:nth-child(2)
{
  grid-column: 1;
  grid-row: 1/3;
}

.LOL ul#jen3MOD
li:nth-child(6)
{
  grid-column: 1;
  grid-row: 3/5
}

.LOL ul#jen3MOD
li:nth-child(8)
{
  grid-column: 2;
  grid-row: 1/3

}

.LOL ul#jen3MOD
li:nth-child(10)
{
  grid-column: 2;
  grid-row: 3/5
}

.LOL ul#jen3MOD
li:nth-child(13)
{
  grid-row: 1/5;
  grid-column: 3/4;
}

.LOL ul#jen3MOD {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 1rem
}

/* COPY-PASTA FOR HELP */

.LOL ul#jen3MOD li:nth-child(2),
.LOL ul#jen3MOD li:nth-child(6){
  background: #444;
}
.LOL ul#jen3MOD li:nth-child(8),
.LOL ul#jen3MOD li:nth-child(10){
  background: #4794B8;
}

/* ============================================================ */
/* JEN SIMMONS BOILERPLATE */

.LOL ul.jen {
  margin: 0;
  padding: 0;
  list-style: none;
  color: #F6F3EA;
  font-family: Avenir, Heveltica, Arial, san-serif;
  font-weight: bold;
  font-size: 1.5rem;
}

.LOL ul.jen li {
  padding: 1em;
  background: #F9423A;
}