* {
  box-sizing: border-box;
}

body {
  font-family: "Raleway", sans-serif;
  background: #f9f8f8;
}

header.header {
  position: absolute;
  top: 52px;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
header.header h1 {
  font-size: 36px;
  /*color: #222222;*/
  text-align: center;
  margin-top: 0;
  text-transform: uppercase;
  font-weight: 900;
}

.glitch-window {
  position: absolute;
  top:0;
  left: 0px;
  width: 100%;
  color: #D45500;
  text-shadow: 2px 0 #f9f8f8, -1px 0 rgb(255, 255, 255), -2px 0 rgb(0, 0, 0);
  overflow: hidden;
  animation: crt-me 2500ms infinite linear alternate-reverse;
}

@-webkit-keyframes crt-me {
  0% {
    clip: rect(0px, 9999px, 94px, 0);
  }
  10% {
    clip: rect(112px, 9999px, 76px, 0);
  }
  20% {
    clip: rect(85px, 9999px, 77px, 0);
  }
  30% {
    clip: rect(27px, 9999px, 97px, 0);
  }
  40% {
    clip: rect(64px, 9999px, 98px, 0);
  }
  50% {
    clip: rect(61px, 9999px, 85px, 0);
  }
  60% {
    clip: rect(99px, 9999px, 114px, 0);
  }
  70% {
    clip: rect(0px, 9999px, 115px, 0);
  }
  80% {
    clip: rect(98px, 9999px, 129px, 0);
  }
  90% {
    clip: rect(43px, 9999px, 96px, 0);
  }
  100% {
    clip: rect(82px, 9999px, 64px, 0);
  }
}

@keyframes crt-me {
  0% {
    clip: rect(0px, 9999px, 94px, 0);
  }
  10% {
    clip: rect(112px, 9999px, 76px, 0);
  }
  20% {
    clip: rect(85px, 9999px, 77px, 0);
  }
  30% {
    clip: rect(27px, 9999px, 97px, 0);
  }
  40% {
    clip: rect(64px, 9999px, 98px, 0);
  }
  50% {
    clip: rect(61px, 9999px, 85px, 0);
  }
  60% {
    clip: rect(99px, 9999px, 114px, 0);
  }
  70% {
    clip: rect(0px, 9999px, 115px, 0);
  }
  80% {
    clip: rect(98px, 9999px, 129px, 0);
  }
  90% {
    clip: rect(43px, 9999px, 96px, 0);
  }
  100% {
    clip: rect(82px, 9999px, 64px, 0);
  }
}

@media only screen and (max-width: 1200px) {


  * {
      box-sizing: border-box;
    }
    
    body {
      font-family: "Raleway", sans-serif;
      background: #f9f8f8;
    }
    
    header.header {
      position: absolute;
      top: 52px;
      left: 0;
      width: 100%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
    }
    header.header h1 {
      font-size: 36px;
      /*color: #222222;*/
      text-align: center;
      margin-top: 0;
      text-transform: uppercase;
      font-weight: 900;
    }
    
    .glitch-window {
      position: absolute;
      top:0;
      left: 0px;
      width: 100%;
      color: #D45500;
      text-shadow: 2px 0 #f9f8f8, -1px 0 rgb(255, 255, 255), -2px 0 rgb(0, 0, 0);
      overflow: hidden;
      animation: crt-me 2500ms infinite linear alternate-reverse;
    }
    
    @-webkit-keyframes crt-me {
      0% {
        clip: rect(0px, 9999px, 94px, 0);
      }
      10% {
        clip: rect(112px, 9999px, 76px, 0);
      }
      20% {
        clip: rect(85px, 9999px, 77px, 0);
      }
      30% {
        clip: rect(27px, 9999px, 97px, 0);
      }
      40% {
        clip: rect(64px, 9999px, 98px, 0);
      }
      50% {
        clip: rect(61px, 9999px, 85px, 0);
      }
      60% {
        clip: rect(99px, 9999px, 114px, 0);
      }
      70% {
        clip: rect(0px, 9999px, 115px, 0);
      }
      80% {
        clip: rect(98px, 9999px, 129px, 0);
      }
      90% {
        clip: rect(43px, 9999px, 96px, 0);
      }
      100% {
        clip: rect(82px, 9999px, 64px, 0);
      }
    }
    
    @keyframes crt-me {
      0% {
        clip: rect(0px, 9999px, 94px, 0);
      }
      10% {
        clip: rect(112px, 9999px, 76px, 0);
      }
      20% {
        clip: rect(85px, 9999px, 77px, 0);
      }
      30% {
        clip: rect(27px, 9999px, 97px, 0);
      }
      40% {
        clip: rect(64px, 9999px, 98px, 0);
      }
      50% {
        clip: rect(61px, 9999px, 85px, 0);
      }
      60% {
        clip: rect(99px, 9999px, 114px, 0);
      }
      70% {
        clip: rect(0px, 9999px, 115px, 0);
      }
      80% {
        clip: rect(98px, 9999px, 129px, 0);
      }
      90% {
        clip: rect(43px, 9999px, 96px, 0);
      }
      100% {
        clip: rect(82px, 9999px, 64px, 0);
      }
    }
  
  }


@media only screen and (min-width: 600px) and (max-width: 1200px) {


* {
    box-sizing: border-box;
  }
  
  body {
    font-family: "Raleway", sans-serif;
    background: #f9f8f8;
  }
  
  header.header {
    position: absolute;
    top: 450px;
    left: 0;
    width: 100%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  header.header h1 {
    font-size: 50px;
    /*color: #222222;*/
    text-align: center;
    margin-top: 0;
    text-transform: uppercase;
    font-weight: 900;
  }
  
  .glitch-window {
    position: absolute;
    top:0;
    left: 0px;
    width: 100%;
    color: #D45500;
    text-shadow: 2px 0 #f9f8f8, -1px 0 rgb(255, 255, 255), -2px 0 rgb(0, 0, 0);
    overflow: hidden;
    animation: crt-me 2500ms infinite linear alternate-reverse;
  }
  
  @-webkit-keyframes crt-me {
    0% {
      clip: rect(0px, 9999px, 94px, 0);
    }
    10% {
      clip: rect(112px, 9999px, 76px, 0);
    }
    20% {
      clip: rect(85px, 9999px, 77px, 0);
    }
    30% {
      clip: rect(27px, 9999px, 97px, 0);
    }
    40% {
      clip: rect(64px, 9999px, 98px, 0);
    }
    50% {
      clip: rect(61px, 9999px, 85px, 0);
    }
    60% {
      clip: rect(99px, 9999px, 114px, 0);
    }
    70% {
      clip: rect(0px, 9999px, 115px, 0);
    }
    80% {
      clip: rect(98px, 9999px, 129px, 0);
    }
    90% {
      clip: rect(43px, 9999px, 96px, 0);
    }
    100% {
      clip: rect(82px, 9999px, 64px, 0);
    }
  }
  
  @keyframes crt-me {
    0% {
      clip: rect(0px, 9999px, 94px, 0);
    }
    10% {
      clip: rect(112px, 9999px, 76px, 0);
    }
    20% {
      clip: rect(85px, 9999px, 77px, 0);
    }
    30% {
      clip: rect(27px, 9999px, 97px, 0);
    }
    40% {
      clip: rect(64px, 9999px, 98px, 0);
    }
    50% {
      clip: rect(61px, 9999px, 85px, 0);
    }
    60% {
      clip: rect(99px, 9999px, 114px, 0);
    }
    70% {
      clip: rect(0px, 9999px, 115px, 0);
    }
    80% {
      clip: rect(98px, 9999px, 129px, 0);
    }
    90% {
      clip: rect(43px, 9999px, 96px, 0);
    }
    100% {
      clip: rect(82px, 9999px, 64px, 0);
    }
  }

}