#timeline{
  margin-left: 95px;
  height: 100%;
  overflow: hidden;
}

#timeline-container{
  height: 85px;
  width: 1235px;
  position: absolute;
  top: 930px;
  left: 150px;
}

#timeline-logo-container{
  float: left;
  width: 85px;
  height: 85px;
  overflow: hidden;
}

#logo-stack{
  white-space: nowrap;
  position: relative;
  height: 100%;
  transition: left 1s .2s, top 1s;
  top: 100%;
  font-size: 0px;
}

#logo-stack.shown{
  top: 0px;
}

#timeline-event-container{
  height: 85%;
  position: relative;
  left: 0px;
  overflow: hidden;
  transition: left 1s .2s;
}

.timeline-bar{
  margin-right: 5px;
  background-color: rgba(255, 255, 255, 0.25);
  width: 275px;
  height: 100%;
  float: left;
}

.timeline-item{
  position: relative;
  font-size: 43px;
  line-height: 70px;
  width: 280px;
  float: left;
  top: 100%;
  transition: top 1s;
}

#progressbar{
  background-color: white;
  width: 0%;
  height: 100%;
  transition-property: width;
  transition-timing-function: linear;
}

#progressbar.progress{
  width: 100%;
}

#progress-stack{
  width: 100%;
  height: 100%;
  position: relative;
  left: -100%;
  transition: left 1s .2s;
}

#progressbar-container{
  width: 0px;
  transition: width 1s;
}

#progressbar-container.shown{
  width: 275px;
}

.progress-container{
  height: 100%;
  overflow: hidden;
  float: left;
}