/* Archive additions to the sken.be theme: the banner on every archived page
   and the landing page. Colours and type come from the original theme. */

/* --- Banner -------------------------------------------------------------- */

#archive-banner {
  background: #0282BA;
  color: #fff;
  font: 12px/1.5 "Helvetica Neue", Helvetica, "Lucida Grande", Arial, sans-serif;
  text-transform: uppercase;
  padding: 8px 30px;
}

#archive-banner a:link,
#archive-banner a:visited {
  color: #fff;
  font-weight: bold;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

#archive-banner a:hover,
#archive-banner a:active {
  color: #fff;
  border-bottom-color: #fff;
}

/* --- Landing page -------------------------------------------------------- */

.landing,
.landing * {
  box-sizing: border-box;
}

.landing {
  margin: 0;
  min-height: 100vh;
  background: #3D3A35;
  color: #3D3A35;
  font-family: "Helvetica Neue", Helvetica, "Lucida Grande", Arial, sans-serif;
  font-size: 200%;
  line-height: 1.3;
}

.landing-wrapper {
  background: #fff;
  min-height: 100vh;
  max-width: 970px;
  padding: 20px 1em 1em 30px;
  border-bottom-right-radius: 5px;
}

.landing-logo {
  margin: 0 0 0.4em -0.05em;
  color: #F5F5F1;
  font-size: 400%;
  line-height: 1;
}

.landing p {
  margin: 0 0 0.6em 0;
  max-width: 22em;
}

.landing strong {
  color: #D10000;
}

.landing a {
  text-decoration: none;
}

.landing a:link,
.landing a:visited {
  color: #D10000;
  border-bottom: 1px solid #DDD;
}

.landing a:hover,
.landing a:active {
  color: #F00;
  border-bottom-color: #F00;
}

@media (max-width: 600px) {
  .landing {
    font-size: 130%;
  }

  .landing-wrapper {
    padding: 16px;
  }

  .landing-logo {
    font-size: 300%;
  }
}