html {
  height: 100%; }

body {
  min-height: 100%;
  padding: 0;
  margin: 0;
  font: 100%;
  color: #fff;
  background-color: #000;
  position: relative; }

a {
  color: #fff; }

ul {
  margin: 0; }

header {
  padding: 8px; }

main {
  display: inline flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 10px;
  padding-bottom: 50px; }

h1 {
  font-size: 2em;
  margin: 0.67em 0;
  text-align: center;
}

mark {
  background-color: #FFD500;
  color: black;
}

.tiles {
    display: flex;
    flex-wrap: wrap;
     justify-content: center;
}

.tiles > div {
  background-color: #f9f9f9;
  margin: 10px;
  padding: 2px 20px 2px 20px;
}

.tiles > div > p {
    margin: 3px;
}

.sky {
    padding: 5px;
  background-image: -webkit-gradient(
  linear,
  left top,
  left bottom,
  color-stop(1, #010133),
  color-stop(0.80, #010133),
  color-stop(0.75, #5c3566),
  color-stop(0.70, #FF0000),
  color-stop(0.50, #FFA600),
  color-stop(0.20, #FFD500),
  color-stop(0, #36ABD9)
);
}

section {
  border-radius: 10px;
  background-color: #010133;
  margin: 10px;
  padding: 20px 20px 40px 20px; }
  section p {
    margin: 3px; }

footer {
  background: #000;
  bottom: 0;
  width: 100%;
  clear: both;
  position: absolute; }
  footer ul {
    padding: 0;
    list-style-type: none;
    display: inline flex;
    flex-wrap: wrap;
    justify-content: center; }
    footer ul li {
      margin-left: 15px;
      margin-right: 15px; }

a.external {
  /* @embed */
  background: url(../images/site/external-link.png) center left no-repeat;
  padding-left: 15px;
  margin-left: 5px; }

a.feed {
  /* @embed */
  background: url(../images/site/feed-icon-14x14.png) center left no-repeat;
  padding-left: 15px;
  margin-left: 2px; }

a.wikipedia {
  /* @embed */
  background: url(../images/site/wikipedia-icon.png) center left no-repeat;
  padding-left: 23px;
  margin-left: 2px; }

a.f-droid {
  /* @embed */
  background: url(../images/site/f-droid-icon.png) center left no-repeat;
  padding-left: 23px;
  margin-left: 2px; }
