@media print, screen and (min-width: 769px) {
  body > h1 {
    width: 100%;
    overflow: hidden;
    height: 350px;
    position: relative;
    margin-bottom: 50px; }
    body > h1 p {
      z-index: 10;
      position: absolute;
      top: 50%;
      left: 42%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      font-size: 3em;
      color: #ffffff;
      line-height: 1em;
      -webkit-transition: all .5s ease-in-out;
      -moz-transition: all .5s ease-in-out;
      -ms-transition: all .5s ease-in-out;
      -o-transition: all .5s ease-in-out;
      transition: all .5s ease-in-out;
      letter-spacing: 0.5em;
      margin-top: 40px;
      font-family: 'Sanomat Sans Web Bold'; }
    body > h1 p.animate {
      left: 50%;
      letter-spacing: 0.1em; }
    body > h1 p:before {
      content: "";
      width: 100%;
      height: 100%;
      position: absolute;
      z-index: 10;
      right: 0;
      top: 0;
      display: block;
      background: #ffffff;
      -webkit-transition: all .5s ease-in-out;
      -moz-transition: all .5s ease-in-out;
      -ms-transition: all .5s ease-in-out;
      -o-transition: all .5s ease-in-out;
      transition: all .5s ease-in-out; }
    body > h1 p.animate:before {
      content: "";
      width: 0;
      height: 100%;
      position: absolute;
      z-index: 10;
      right: 0;
      top: 0;
      display: block;
      background: #ffffff; }
    body > h1 figure {
      position: absolute;
      left: 50%;
      margin-left: -960px;
      z-index: -1; }

  header {
    opacity: 0; }

  header.slide {
    top: 0 !important;
    left: 0 !important;
    position: fixed !important;
    z-index: 100 !important;
    opacity: 1 !important; } }