/* CSS animations library */
/* created by ARTIUM  artium.com.ua */



@keyframes left-to-right-clip {
  0% {
    -webkit-clip-path: inset(0% 100% 0% 0%);
    clip-path: inset(0% 100% 0% 0%);
  }
  100% {
    -webkit-clip-path: inset(0% 0% 0% 0%);
    clip-path: inset(0% 0% 0% 0%);
  }
}
.left-to-right-clip {
    animation-name: left-to-right-clip;
    animation-duration: 1.0s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.645,.045,.355,1);
}

@keyframes right-to-left-clip {
  0% {
    -webkit-clip-path: inset(0% 0% 0% 100%);
    clip-path: inset(0% 0% 0% 100%);
  }
  100% {
    -webkit-clip-path: inset(0% 0% 0% 0%);
    clip-path: inset(0% 0% 0% 0%);
  }
}
.right-to-left-clip {
    animation-name: right-to-left-clip;
    animation-duration: 1.0s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.645,.045,.355,1);
}

@keyframes top-to-bottom-clip {
  0% {
    -webkit-clip-path: inset(0% 0% 100% 0%);
    clip-path: inset(0% 0% 100% 0%);
  }
  100% {
    -webkit-clip-path: inset(0% 0% 0% 0%);
    clip-path: inset(0% 0% 0% 0%);
  }
}
.top-to-bottom-clip {
    animation-name: top-to-bottom-clip;
    animation-duration: 1.0s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.645,.045,.355,1);
}

@keyframes bottom-to-top-clip {
  0% {
    -webkit-clip-path: inset(100% 0% 0% 0%);
    clip-path: inset(100% 0% 0% 0%);
  }
  100% {
    -webkit-clip-path: inset(0% 0% 0% 0%);
    clip-path: inset(0% 0% 0% 0%);
  }
}
.bottom-to-top-clip {
    animation-name: bottom-to-top-clip;
    animation-duration: 1.0s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.645,.045,.355,1);
/*    animation-timing-function: linear;*/
}

@keyframes bottom-to-top-clip-out {
  0% {
    -webkit-clip-path: inset(0% 0% 0% 0%);
    clip-path: inset(0% 0% 0% 0%);
  }
  100% {
    -webkit-clip-path: inset(0% 0% 100% 0%);
    clip-path: inset(0% 0% 100% 0%);
  }
}
.bottom-to-top-clip-out {
    animation-name: bottom-to-top-clip-out;
    animation-duration: 1.0s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.645,.045,.355,1);
/*    animation-timing-function: linear;*/
}