@-webkit-keyframes float {
  0% {
    -webkit-transform: translatey(0px) scale(1);
            transform: translatey(0px) scale(1);
  }
  50% {
    -webkit-transform: translatey(-20px) scale(1.05);
            transform: translatey(-20px) scale(1.05);
  }
  100% {
    -webkit-transform: translatey(0px) scale(1);
            transform: translatey(0px) scale(1);
  }
}

@keyframes float {
  0% {
    -webkit-transform: translatey(0px) scale(1);
            transform: translatey(0px) scale(1);
  }
  50% {
    -webkit-transform: translatey(-20px) scale(1.05);
            transform: translatey(-20px) scale(1.05);
  }
  100% {
    -webkit-transform: translatey(0px) scale(1);
            transform: translatey(0px) scale(1);
  }
}

.floating {
  -webkit-transform: translatey(0px) scale(1);
          transform: translatey(0px) scale(1);
  -webkit-animation: float 6s ease-in-out infinite;
          animation: float 6s ease-in-out infinite;
}



.story-header {
  margin-bottom: 2.5rem;
}
.story-header > .columns {
  margin-top: 0;
  margin-bottom: 0;
}
.story-header .h-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2rem;
}
.story-header .h-logos a {

}
.story-header .h-logos a:not(:last-child) {
  margin-right: 1.5rem;
}
.story-header .h-logos a img {
  width: 145px;
}
.story-header .home-link {
  font-family: 'Caveat';
  font-size: 14px;
  line-height: 1em;
  color: #000000;
  text-align: center;
}

.for-title {
  position: absolute;
}
.story-title {
  font-family: 'Caveat';
  font-weight: 700;
  font-size: 134px;
  line-height: 0.7em;
  color: #000000;
}
.story-title span:first-child {
  box-shadow: 4rem 0px 0px -0.231em #FFF, 0 0 0 0 #FFF;
  color: transparent;
  background-position: left -100% center;
  padding-bottom: 0.2em;
  background-size: 200% 1em;
  background-repeat: repeat-x;
  background-image: linear-gradient(to right, #FFF 50%, #FFF 50%);
}
.story-title span:last-child {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
}


.case-data {
  font-family: 'Inconsolata', monospace;
  font-size: 17px;
  line-height: 1.2em;
  color: #C92B2B;
  display: flex;
  flex-flow: column;
  height: 100%;
  justify-content: center;
}
.case-data strong {
  color: #000;
}

.for-full-image {
  position: relative;
}
.for-full-image .ol-black {
  position: absolute;
  width: 100%;
  height: 30%;
  bottom: 0;
  left: 0;
  pointer-events: none;
  background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
  background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
}
.for-full-image .ol-white {
  position: absolute;
  width: 100%;
  height: 40%;
  bottom: 0;
  left: 0;
  pointer-events: none;
  background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFFFF', endColorstr='#FFFFFFFF',GradientType=0 );
}
.for-full-image .ol-white-top {
  position: absolute;
  width: 100%;
  height: 40%;
  top: 0;
  left: 0;
  pointer-events: none;
  background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
  background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}
.c-black p {
  color: #FFF;
}







/* Tablet */
@media screen and (min-width: 768px) and (max-width: 1007px) {
  .story-title {
    font-size: 100px;
  }
}


/* Mobile */
@media screen and (max-width: 767px) {
  .story-header .h-logos {
    margin-bottom: 1rem;
  }
  .for-title {
    position: unset;
  }
  .story-header .h-logos a img {
    width: 100px;
  }
  .story-header .home-link {
    font-size: 15px;
    line-height: 1.2em;
  }
  .story-title {
    font-size: 48px;
    line-height: 0.8em;
  }
  .story-title span:first-child {
    display: none;
  }
  .story-title span:last-child {
    position: unset;
  }
  .m-reverse {
    flex-direction: column-reverse;
  }
}
