body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  background-color: #f2f2f4;
  color: #555;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: #0099CC;
}

figure {
  margin: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0
}

.copy {
  font-size: 62.5%;
}

.copy p, .copy pre, .copy ul, .copy dl {
  font-size: 1.6em;
  line-height: 1.5;
}

.copy p.intro {
  font-size: 1.8em;
  line-height: 1.5;
  font-weight: 300;
}

.copy h2 {
  font-size: 2.5em;
  font-weight: 300;
}

.copy pre {
  font-family: monospace;
  background: #fafafa;
  padding: 10px 15px;
  border: 1px solid #e2e2e2;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

.copy dt {
  font-weight: bold;
}

.container {
  width: 700px;
  margin: auto;
}

#header {
  background: #222;
  padding: 30px;
  min-width: 700px;
  position: relative;
}

#content {
  margin: 20px 0 40px;
}

h1 {
  font-size: 52px;
  margin: 0;
  padding: 0;
  font-weight: 100;
  color: #eee;
}

.hero {
  font-size: 22px;
  font-weight: 100;
  color: #ccc;
  margin: 0;
  padding: 0;
}

.figure-wrapper {
  /*text-align: center;*/
}

.image-container {
  display: inline-block;
  max-width: 100%;
  background: white;
  padding: 10px;
  margin: 5px 0;
  border: 1px solid #e2e2e2;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

.image-container.target {
  margin-top: 40px;
}

.image-container img {
  max-width: 100%;
}

.image-container .image-meta {
  margin-top: 10px;
  font-size: 12px;
  text-align: left;
}
.image-container .image-meta a {
  text-decoration: none;
  color: #444;
}
.image-container .image-meta a:hover .image-meta-title {
  text-decoration: underline;
}

.darkroom-button-group {
    width: 100% !important;
    display: inline !important;
}
svg.darkroom-icon {
    /* size: 10px; */
    font-size: 10px !important;
    height: 10px !important;
    width: 10px !important;
}