@import url(http://fonts.googleapis.com/css?family=Inconsolata);

html, body{
  height: 100%;
  width: 100%;
  background: #111;
  font-family: 'Inconsolata', monospace;
  font-weight: normal;
  overflow: hidden;
}

li:nth-child(2n) small:nth-child(2n),
li:nth-child(2n+1) small:nth-child(2n+1){
  /*color: black;*/
  font-family: Courier, monospace;
  font-weight: bold;
}

header{
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -200px 0 0 -383px;
  width: 766px;
  height: 400px;
  /*background: slateblue;*/
  overflow: hidden;
  color: slateblue;
}

.first{
  position: relative;
  top: -50px;
  color: mediumseagreen;
}

ul{  
  white-space: nowrap;
  letter-spacing: 8px;
  line-height: 50px;
}

li{
  display: inline-block;
}


small{
  display: block;
  font-size: 20px;
}

span{
  display: block;
  position: absolute;
  -webkit-animation: scrolldown 200s infinite linear;
  -moz-animation:    scrolldown 200s infinite linear;
  -o-animation:      scrolldown 200s infinite linear;
  animation:         scrolldown 200s infinite linear;
}

li:nth-child(2n) span{
  -webkit-animation: scrollup 200s infinite linear;
  -moz-animation:    scrollup 200s infinite linear;
  -o-animation:      scrollup 200s infinite linear;
  animation:         scrollup 200s infinite linear;
}

span:first-child,
li:nth-child(2n) span:first-child{
  -webkit-animation-delay: -100s; 
  -moz-animation-delay:    -100s; 
  -o-animation-delay:      -100s; 
  animation-delay:         -100s;
}

@-webkit-keyframes scrolldown {
  0%   { -webkit-transform: translateY(-100%); }
  100% { -webkit-transform: translateY(100%);  }
}
@-moz-keyframes scrolldown {
  0%   { -moz-transform: translateY(-100%); }
  100% { -moz-transform: translateY(100%);  }
}
@-o-keyframes scrolldown {
  0%   { -o-transform: translateY(-100%); }
  100% { -o-transform: translateY(100%);  }
}
@keyframes scrolldown {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100%);  }
}

@-webkit-keyframes scrollup {
  0%   { -webkit-transform: translateY(100%); }
  100% { -webkit-transform: translateY(-100%);  }
}
@-moz-keyframes scrollup {
  0%   { -moz-transform: translateY(100%); }
  100% { -moz-transform: translateY(-100%);  }
}
@-o-keyframes scrollup {
  0%   { -o-transform: translateY(100%); }
  100% { -o-transform: translateY(-100%);  }
}
@keyframes scrollup {
  0%   { transform: translateY(100%); }
  100% { transform: translateY(-100%);  }
}


/*@media all and (max-width: 699px) and (min-width: 520px) {
  #sidebar ul li a {
    padding-left: 21px;
    background: url(../images/email.png) left center no-repeat;
  }
}*/