#configure { background-color: #333; color: #ccc; border-top: 1px solid #eee; border-bottom: 1px solid #eee; padding: 1em 0; margin: 2em 0; }
.configured #configure { display: none; }
#configure ul { overflow: hidden; margin-top: 0; }
@media only screen and (min-width: 670px) { #configure ul li { float: left; width: 48%; }
  #configure ul li:first-child { margin-right: 4%; }
  #configure ul li input { width: 100%; max-width: none; } }
#configure ol { counter-reset: configure-counter; overflow: hidden; margin: 0; padding: 0; }
#configure ol > li { position: relative; list-style: none; padding-left: 48px; margin: 2em 0; }
#configure ol > li h2 { line-height: 36px; margin-bottom: 0; color: #fff; }
#configure ol > li:before { display: inline-block; float: left; position: absolute; left: 0; width: 36px; line-height: 36px; font-size: 24px; font-weight: bold; border-radius: 36px; text-align: center; color: rgba(0, 0, 0, 0.25); color: #fff; background: #A1D33C; content: counter(configure-counter); counter-increment: configure-counter; }

#apply { opacity: 0.5; transition: opacity 0.3s; }
.configuring #apply { opacity: 1; }

#snippet { width: 100%; max-width: none; font-size: 0.8em; height: 8em; }

article.page- h1 { font-size: 4em; }
article.page- h1 a { color: inherit; text-decoration: none; }
article.page- h1 .version { color: #333; font-size: 18px; font-weight: normal; }