body {
  margin: 0;
  color: #373534;
  background-color: #ecf0f1;
  font-family: Lato, sans-serif;
  font-size: 16px;
}

a {
  color: #27ae60;
}

header {
  margin: 0 auto;
  padding: 0 1em;
  text-align: center;
}

header h1 {
  margin: 1em 0 0;
  font-size: 400%;
  font-weight: 100;
}

@media (min-width: 104em) {
  header h1 {
    margin-top: 0.667em;
    font-size: 600%;
  }
}

@media (min-width: 200em) {
  header h1 {
    margin-top: 0.5em;
    font-size: 800%;
  }
}

header h1 em {
  color: #27ae60;
  font-style: normal;
}

header p {
  line-height: 1.5;
}

header br {
  display: none;
}

@media (min-width: 50em) {
  header br {
    display: inline;
  }
}

main {
  margin: 2em auto;
  max-width: 16em;
  zoom: 1;
}

@media (min-width: 40em) {
  main {
    max-width: 32em;
  }
}

@media (min-width: 56em) {
  main {
    max-width: 48em;
  }
}

@media (min-width: 72em) {
  main {
    max-width: 64em;
  }
}

@media (min-width: 88em) {
  main {
    max-width: 80em;
  }
}

@media (min-width: 104em) {
  main {
    max-width: 96em;
  }
}

@media (min-width: 120em) {
  main {
    max-width: 112em;
  }
}

@media (min-width: 136em) {
  main {
    max-width: 128em;
  }
}

@media (min-width: 152em) {
  main {
    max-width: 144em;
  }
}

@media (min-width: 168em) {
  main {
    max-width: 160em;
  }
}

@media (min-width: 184em) {
  main {
    max-width: 176em;
  }
}

@media (min-width: 200em) {
  main {
    max-width: 192em;
  }
}

@media (min-width: 216em) {
  main {
    max-width: 208em;
  }
}

@media (min-width: 232em) {
  main {
    max-width: 224em;
  }
}

@media (min-width: 248em) {
  main {
    max-width: 240em;
  }
}

main:before,
main:after {
  display: table;
  content: "";
}

main:after {
  clear: both;
}

.message {
  text-align: center;
}

.grid {
  padding: 1em;
  box-sizing: border-box;
  float: left;
  width: 16em;
}

.vimmer {
  padding: 1.618em 0;
  border-radius: 0.5em;
  line-height: 1;
  overflow: hidden;
  color: #fff;
  text-align: center;
}

.grid:nth-child(4n+1) .vimmer {
  background-color: #e74c3c;
}

.grid:nth-child(4n+2) .vimmer {
  background-color: #2ecc71;
}

.grid:nth-child(4n+3) .vimmer {
  background-color: #e67e22;
}

.grid:nth-child(4n+4) .vimmer {
  background-color: #3498db;
}

.vimmer h1 {
  margin: 0 auto;
  overflow: hidden;
  font-size: 100%;
  font-weight: normal;
  white-space: nowrap;
}

.avatar {
  margin: 1em auto;
  width: 6.854em;
  height: 6.854em;
}

.avatar img {
  border-radius: 51%;
  width: 100%;
  height: 100%;
}

.elsewhere {
  margin: 0 auto;
  padding-left: 0;
}

.elsewhere li {
  display: inline-block;
}

.elsewhere li a {
  border-radius: 51%;
  display: block;
  width: 1.618em;
  height: 1.618em;
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 80%;
}

.elsewhere li a:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
}

.twitter {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M492.255%20109.456c-17.384%207.711-36.069%2012.921-55.676%2015.264%2020.011-11.997%2035.384-30.994%2042.623-53.632-18.733%2011.111-39.478%2019.177-61.561%2023.524-17.681-18.841-42.876-30.612-70.759-30.612-53.535%200-96.942%2043.402-96.942%2096.938%200%207.598.857%2014.997%202.51%2022.092-80.567-4.042-151.999-42.637-199.81-101.287-8.345%2014.317-13.126%2030.971-13.126%2048.737%200%2033.633%2017.114%2063.305%2043.127%2080.688-15.891-.503-30.84-4.864-43.908-12.125-.009.404-.009.808-.009%201.219%200%2046.968%2033.416%2086.147%2077.762%2095.055-8.133%202.215-16.698%203.401-25.539%203.401-6.247%200-12.32-.609-18.24-1.74%2012.336%2038.511%2048.137%2066.541%2090.558%2067.32-33.177%2026.003-74.976%2041.501-120.395%2041.501-7.825%200-15.542-.46-23.125-1.356%2042.901%2027.504%2093.857%2043.556%20148.602%2043.556%20178.309%200%20275.819-147.716%20275.819-275.821%200-4.203-.097-8.382-.283-12.54%2018.943-13.67%2035.377-30.742%2048.373-50.183%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}

.github {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M512%20250v-2c-42.158-8.427-85.827-9.087-112-8%204.299-15.487%206-32.128%206-52%200-28.5-10.611-52.651-28-70%203.038-9.805%207.15-30.123-4-58%200%200-19.504-7.772-64%2022-17.43-4.355-35.422-6-54-6-20.441%200-42.736%202.717-62%208-45.917-31.315-66-24-66-24-13.231%2033.077-4.485%2055.918-2%2062-15.551%2016.779-26%2039.741-26%2066%200%2019.824%202.486%2036.543%208%2052-26.396-.96-67.346-.127-108%208v2c40.899-8.177%2083.765-8.993%20110-8%201.215%203.2%202.482%207%204%2010-25.944.836-71.545%204.027-114%2016l2%202c42.79-12.061%2086.308-15.214%20112-16%2015.501%2028.886%2045.631%2046.141%20100%2052-7.717%205.184-14.81%2015.089-18%2030-10.516%205.028-44.028%2016.342-64-18%200%200-10.6-20.4-32-22%200%200-21.326.75-2%2014%200%200%2014.416%205.411%2024%2030%20.298%200%2011.67%2043.456%2072%2030v42c-.298%200%20.052%2014.894-14%2020%200%200-8.945%206.812%200%2010%20.032%200%2038%203.917%2038-28v-48c.339%200-1.206-17.488%208-24v76c-.37%200-.42%2018.977-10%2026%200%200-6.051%2011.188%208%208%200%200%2026.722-4.719%2028-36v-78h8v78c1.276%2031.281%2028%2036%2028%2036%2014.047%203.188%208-8%208-8-9.961-7.023-10-26-10-26v-76c9.54%207.163%208%2024%208%2024v48c.044%2031.918%2038%2028%2038%2028%208.937-3.188%200-10%200-10-14.361-5.106-14-20-14-20v-62c.31-24.147-10.054-37.25-20-44%2057.983-5.748%2085.179-22.919%2098-52%2025.398.698%2070.281%203.671%20114%2016l2-2c-43.469-12.257-90.345-15.253-116-16%201.215-2.938%203.058-6.857%204-10%2041.325.509%2078.074%201.154%20112%208z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}

.facebook {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M350.912%2071.615c-10.38-2.221-20.216-4.034-29.507-5.439-9.292-1.405-19.4-2.13-30.323-2.176-31.819.136-54.799%207.479-68.941%2022.028-14.142%2014.55-21.077%2035.49-20.804%2062.822v39.705h-40.249v64.181h40.249v195.263h78.323v-195.263h57.11l5.439-64.181h-62.55v-31.003c-.453-8.793.861-15.682%203.943-20.669%203.082-4.986%2010.651-7.524%2022.708-7.615%204.816.023%2010.413.386%2016.793%201.088%206.379.703%2012.385%201.609%2018.017%202.72z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}

.googleplus {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M208%2064v144h-144v96h144v144h96v-144h144v-96h-144v-144z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}

.vimorg {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M70.813%2081.156l-6.813%207.375v26.688l6.25%206.25h17.063v303.5l10.188%205.875h35.188l127.594-130.844-1.219%203.375a1.386%201.386%200%200%200%20.313%201.438l4.594%204.563a1.386%201.386%200%200%200%20.969.375h18.438a1.386%201.386%200%200%200%201-.375l4.813-4.844a1.386%201.386%200%200%200%20.344-.594l5.125-17.625a1.386%201.386%200%200%200-.344-1.344l-3.969-3.969a1.386%201.386%200%200%200-1-.406h-10.156l162.906-167.094v-24.969l-6.813-6.813h-136.813l-6.813%206.25v26.688l7.375%207.938h21l-127.156%20125.469v-125.469h14.75l6.531-7.938v-25.281l-8.25-8.219h-135.094zm167.563%20246.563a1.386%201.386%200%200%200-.125.031%201.386%201.386%200%200%200-1.063%201l-2.281%209.063a1.386%201.386%200%200%200%201.344%201.719h10.844l-26.906%2076.813a1.386%201.386%200%200%200%201.313%201.844h39.156a1.386%201.386%200%200%200%201.344-.969l2.563-8.25a1.386%201.386%200%200%200-1.344-1.781h-8.844l26.625-77.625a1.386%201.386%200%200%200-1.313-1.813h-41.156a1.386%201.386%200%200%200-.156-.031zm124.625.281a1.386%201.386%200%200%200-.125.031%201.386%201.386%200%200%200-.781.438l-8.156%209.219h-12.969l-8.625-8.969a1.386%201.386%200%200%200-1-.406h-30.938a1.386%201.386%200%200%200-1.281.906l-2.844%208.5a1.386%201.386%200%200%200%201.281%201.813h8.281l-25.781%2075.969a1.386%201.386%200%200%200%201.313%201.844h32.938a1.386%201.386%200%200%200%201.313-.906l2.531-7.438a1.386%201.386%200%200%200-1.313-1.813h-5.75l16.438-51.75h29.75l-18.75%2060.094a1.386%201.386%200%200%200%201.313%201.813h31.813a1.386%201.386%200%200%200%201.25-.844l2.844-6.813a1.386%201.386%200%200%200-1.25-1.906h-5.781l16.719-52.625h28.313l-19.031%2060.375a1.386%201.386%200%200%200%201.344%201.813h34.906a1.386%201.386%200%200%200%201.313-.875l2.844-7.406a1.386%201.386%200%200%200-1.313-1.875h-6.906l21.031-68.313a1.386%201.386%200%200%200-.219-1.281l-6.531-8.781a1.386%201.386%200%200%200-1.125-.5h-24.969a1.386%201.386%200%200%200-1.031.406l-7.844%208.656h-13.781l-8.156-8.938a1.386%201.386%200%200%200-1-.406h-20.125a1.386%201.386%200%200%200-.156-.031z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}

.website {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M256%2064l-192%20192h48v192h96v-168h96v168h96v-192h48z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}

footer {
  margin: 0 auto 4em;
  padding: 0 1em;
  text-align: center;
}