@keyframes filler {
  0% {
    fill: url(#SVGID_1_); }
  100% {
    fill: url(#SVGID_2_); } }
body {
  height: 99%;
  width: 100%;
  margin: 0;
  padding: 0; }
body * {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

.introwrapper svg {
  max-height: 100%;
  max-width: 100%;
  min-width: 800px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%); }
.introwrapper svg .poly {
  transition: all .4s ease;
  fill: white;
  stroke: url(#SVGID_1_);
  stroke-width: 3px;
  margin: 0 auto;
  cursor: pointer;
  display: none; }
.introwrapper svg .letter {
  fill: url(#SVGID_1_);
  cursor: pointer; }

.main-content-overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 125%;
  background: #eee;
  transform: skewY(-10deg);
  -webkit-transform: skewY(-10deg);
  -moz-transform: skewY(-10deg);
  -ms-transform: skewY(-10deg);
  -o-transform: skewY(-10deg);
  transition: all 1s cubic-bezier(1, 0.3, 0.3, 1);
  -webkit-transition: all 1s cubic-bezier(1, 0.3, 0.3, 1);
  -moz-transition: all 1s cubic-bezier(1, 0.3, 0.3, 1);
  -ms-transition: all 1s cubic-bezier(1, 0.3, 0.3, 1);
  -o-transition: all 1s cubic-bezier(1, 0.3, 0.3, 1); }

.main-content {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 125%;
  background: #fff;
  transform: skewY(10deg);
  -webkit-transform: skewY(10deg);
  -moz-transform: skewY(10deg);
  -ms-transform: skewY(10deg);
  -o-transform: skewY(10deg);
  transition: all 2s cubic-bezier(1, 0.3, 0.3, 1);
  -webkit-transition: all 2s cubic-bezier(1, 0.3, 0.3, 1);
  -moz-transition: all 2s cubic-bezier(1, 0.3, 0.3, 1);
  -ms-transition: all 2s cubic-bezier(1, 0.3, 0.3, 1);
  -o-transition: all 2s cubic-bezier(1, 0.3, 0.3, 1); }

/*# sourceMappingURL=style.css.map */
