@font-face {
    font-family: "Inconsolata";
    font-style: normal;
    font-weight: normal;
    src: local("Inconsolata"), url("http://themes.googleusercontent.com/static/fonts/inconsolata/v3/BjAYBlHtW3CJxDcjzrnZCIbN6UDyHWBl620a-IRfuBk.woff") format("woff");
}

.reveal code {
    font-family: Inconsolata;
}

.reveal a {
    text-transform: initial;
}
.reveal pre {
    font-family: Inconsolata;
    font-size: 30px;
}

#fiveup code {
    font-family: Inconsolata;
    font-size: 20px;
}

#columns ul {
  width:1300px;
  overflow:hidden;
}
#columns li {
  float:left;
  display:inline;
}

#double li  { width:50%; }
#triple li  { width:33.333%; }
#fourup li  { width:25%; }
#fiveup li  { width:20%; }
#sixup li   { width:16.666%; }

#achv * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#achv .achievement-banner {
  opacity: 0;
  margin: 0 auto;
  font-size: 350%;
  width: 10em;
  color: #efefef;
  background: #3d4142;
  border-radius: 10em;
  position: relative;
  padding: .125em;
  min-height: 1.5em;
  overflow: hidden;
}
.achievement-banner .achievement-icon {
  border-radius: 10em;
  position: relative;
  background: #000;
  border: .125em solid #656766;
  border-top-color: #45ca3d;
  height: 1.25em;
  width: 1.25em;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
  z-index: 100;
}
.achievement-banner .achievement-icon .icon {
  display: block;
  border-radius: 10em;
  border: 4px solid #000;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  line-height: 1;
  z-index: 1000;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}
.achievement-banner .achievement-icon .icon .icon-trophy {
  font-size: 75%;
  line-height: 1;
  position: relative;
  top: -.08em;
}
.achievement-banner .achievement-text {
  font-family: "Trebuchet MS";
  text-shadow: 0 2px 0 #000;
  position: absolute;
  top: .1em;
  left: 4em;
  font-size: 50%;
  line-height: 1;
  width: 70%;
}
.achievement-banner .achievement-notification {
  margin: 0;
}
.achievement-banner .achievement-name {
  margin: 0;
}

/* Generated content */
.achievement-banner .achievement-icon:before,
.achievement-banner .achievement-icon:after,
.achievement-banner .achievement-icon .icon:before,
.achievement-banner .achievement-icon .icon:after {
        content: "";
        display: block;
        position: absolute;
}

.achievement-banner .achievement-icon:before{
  border-radius: 12em;
  z-index: -100;
  background: transparent;
  border: 4px solid #000;
  top: -.175em;
  left: -.175em;
  right: -.175em;
  bottom: -.175em;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* Bars */
.achievement-banner .achievement-icon .icon:before,
.achievement-banner .achievement-icon .icon:after {
  width: 150%;
  height: .125em;
  background: #000;
  border-radius: .05em;
  z-index: -10;
  top: 42.5%;
  left: -25%;
}

.achievement-banner .achievement-icon .icon:before {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* Animations */

/* open-close-banner */
@-webkit-keyframes open-close-banner {
  0% {width: 1.5em; opacity: 0;}
  2% {width: 1.5em; opacity: 1;}
  8% {width: 9em;}
  80% {width: 9em;}
  90% {width: 1.5em; opacity: 1;
    -webkit-transform: rotate(0deg);
  }
  98% {
    width: 1.5em;
    -webkit-transform: rotate(720deg);
  }
  100% {width: 1.5em; opacity: 0;}
}
@-moz-keyframes open-close-banner {
  0% {width: 1.5em; opacity: 0;}
  2% {width: 1.5em; opacity: 1;}
  8% {width: 9em;}
  80% {width: 9em;}
  90% {
    width: 1.5em;
    opacity: 1;
    -moz-transform: rotate(0deg);
  }
  98% {
    width: 1.5em;
    -moz-transform: rotate(720deg);
  }
  100% {width: 1.5em; opacity: 0;}
}
@keyframes open-close-banner {
  0% {width: 1.5em; opacity: 0;}
  2% {width: 1.5em; opacity: 1;}
  8% {width: 9em;}
  80% {width: 9em;}
  90% {
    width: 1.5em;
    opacity: 1;
    transform: rotate(0deg);
  }
  98% {
    width: 1.5em;
    transform: rotate(720deg);
  }
  100% {width: 1.5em; opacity: 0;}
}

/* border-top-pulse */
@-webkit-keyframes border-top-pulse {
  0% {border-top-color: #656766;}
  40% {border-top-color: #ffffff;}
  80% {border-top-color: #00ff00;}
  100% {border-top-color: #45ca3d;}
}
@-moz-keyframes border-top-pulse {
  0% {border-top-color: #656766;}
  40% {border-top-color: #ffffff;}
  80% {border-top-color: #00ff00;}
  100% {border-top-color: #45ca3d;}
}
@keyframes border-top-pulse {
  0% {border-top-color: #656766;}
  40% {border-top-color: #ffffff;}
  80% {border-top-color: #00ff00;}
  100% {border-top-color: #45ca3d;}
}
@-webkit-keyframes fade-in-text {
  0% {opacity: 0;}
  80% {opacity: 0;}
  100% {opacity: 1;}
}
@-moz-keyframes fade-in-text {
  0% {opacity: 0;}
  80% {opacity: 0;}
  100% {opacity: 1;}
}
@keyframes fade-in-text {
  0% {opacity: 0;}
  80% {opacity: 0;}
  100% {opacity: 1;}
}
@-webkit-keyframes fade-out-text {
  0% {opacity: 1;}
  65% {opacity: 1;}
  100% {opacity: 0;}
}
@-moz-keyframes fade-out-text {
  0% {opacity: 1;}
  65% {opacity: 1;}
  100% {opacity: 0;}
}
@keyframes fade-out-text {
  0% {opacity: 1;}
  65% {opacity: 1;}
  100% {opacity: 0;}
}

.achievement-banner {
  -webkit-animation: open-close-banner 5s 1;
  -moz-animation: open-close-banner 5s 1;
  animation: open-close-banner 5s 1;
}

.achievement-banner .achievement-icon {
  /* Make border-top pulse. */
  -webkit-animation: border-top-pulse 1.25s 2;
  -moz-animation: border-top-pulse 1.25s 2;
  animation: border-top-pulse 1.25s 2;
}
/* fade-in-text */
.achievement-banner .achievement-text {
  -webkit-animation: fade-in-text .5s 1;
  -moz-animation: fade-in-text .5s 1;
  animation: fade-in-text .5s 1;
}

.achievement-banner .icon-trophy {
  -webkit-animation: fade-out-text 5s 1;
  -moz-animation: fade-out-text 5s 1;
  animation: fade-out-text 5s 1;
}