/*------------------------------------*\
	$ELEMENTS
\*------------------------------------*/
/*------------------------------------*\
	$LOADER
\*------------------------------------*/
.loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  background-color: #f97fe4; }

.top .loader {
  background-color: #fee400; }

/*
	svg wrapper
*/
.baloon,
.crack_01,
.crack_02,
.crack_03 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

/*
	svg

*/
.baloon__svg,
.crack_01__svg,
.crack_02__svg,
.crack_03__svg {
  transform: scale(0);
  width: 150vw;
  max-width: none; }
  @media screen and (orientation: portrait) {
    .baloon__svg,
    .crack_01__svg,
    .crack_02__svg,
    .crack_03__svg {
      width: auto;
      height: 150vh;
      max-width: none; } }

.js-crack_01__svg_show {
  animation: crack_01__svg_animation 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s 1 alternate none running; }

@keyframes crack_01__svg_animation {
  0% {
    opacity: 1;
    transform: scale(0.2); }
  80% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: scale(1); } }

.js-crack_02__svg_show {
  animation: crack_02__svg_animation 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0.1s 1 alternate none running; }

@keyframes crack_02__svg_animation {
  0% {
    opacity: 1;
    transform: scale(0.2); }
  50% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: scale(1); } }

.js-crack_03__svg_show {
  animation: crack_03__svg_animation 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0.2s 1 alternate none running; }

@keyframes crack_03__svg_animation {
  0% {
    opacity: 1;
    transform: scale(0); }
  50% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: scale(0.5); } }