/* ----------------------------------------------------------------
	Growing SVG Arrows | M-A Lavigne
  https://codepen.io/malavigne/pen/vodKrP
-----------------------------------------------------------------*/

.arrow__animate {
  display: inline-block;
}

.arrow__animate.left {
  transform: rotate(180deg);
}

.arrow__animate svg {
  width: 100px;
  transform: translateX(-85%) scale(2.7, 2.7);
  transition: 0.5s;
}

.arrow__animate svg rect {
  transform: scale(0.35, 1);
  transition: 0.5s;
  transform-origin: right;
}

.arrow__animate svg:hover {
  transform: translateX(-85%) scale(2.7, 2.7);
}

.arrow__animate svg:hover rect {
  transform: scale(0.55, 1);
}

.arrow__animate path,
.arrow__animate rect {
  transition: 0.5s;
}