@keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  @keyframes fadeUp {
    0% {
      opacity: 0;
      transform: translateY(100px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes fadeDown {
    0% {
      opacity: 0;
      transform: translateY(-100px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  @keyframes fadeRight {
    0% {
      opacity: 0;
      transform: translateX(100px);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  @keyframes fadeLeft {
    0% {
      opacity: 0;
      transform: translateX(-100px);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  @keyframes fadeZoomIn {
    0% {
      opacity: 0;
      transform: scale(0, 0);
    }
    100% {
      opacity: 1;
      transform: scale(1, 1);
    }
  }
  @keyframes fadeZoomOut {
    0% {
      opacity: 0;
      transform: scale(2, 2);
    }
    100% {
      opacity: 1;
      transform: scale(1, 1);
    }
  }
  @keyframes slideMaskBefore {
    0% {
      width: 100%;
    }
    50% {
      width: 100%;
    }
    100% {
      width: 0%;
    }
  }
  @keyframes slideMaskAfter {
    0% {
      width: 0%;
    }
    50% {
      width: 100%;
    }
    100% {
      width: 0%;
    }
  }
  @keyframes slideMaskBeforeH {
    0% {
      height: 100%;
    }
    50% {
      height: 100%;
    }
    100% {
      height: 0%;
    }
  }
  @keyframes slideMaskAfterH {
    0% {
      height: 0%;
    }
    50% {
      height: 100%;
    }
    100% {
      height: 0%;
    }
  }
@media screen {
  .effect.fadeIn {
    opacity: 0;
  }
  .effect.fadeIn.insert {
    animation-name: fadeIn;
    animation-duration: 3s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
  }
  .effect.fadeUp, .effect.fadeDown, .effect.fadeRight, .effect.fadeLeft {
    opacity: 0;
  }
  .effect.fadeUp.insert, .effect.fadeDown.insert, .effect.fadeRight.insert, .effect.fadeLeft.insert {
    position: relative;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
  }
  .effect.fadeUp.insert, .effect.fadeDown.insert {
    animation-duration: 0.75s;
  }
  .effect.fadeLeft.insert, .effect.fadeRight.insert {
    animation-duration: 1s;
  }
  .effect.fadeUp.insert {
    animation-name: fadeUp;
  }
  .effect.fadeDown.insert {
    animation-name: fadeDown;
  }
  .effect.fadeLeft.insert {
    animation-name: fadeLeft;
  }
  .effect.fadeRight.insert {
    animation-name: fadeRight;
  }
  .effect.fadeZoomIn, .effect.fadeZoomOut {
    opacity: 0;
  }
  .effect.fadeZoomIn.insert, .effect.fadeZoomOut.insert {
    animation-duration: 0.75s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
  }
  .effect.fadeZoomIn.insert {
    animation-name: fadeZoomIn;
  }
  .effect.fadeZoomOut.insert {
    animation-name: fadeZoomOut;
  }
  .effect.slideMask {
    position: relative;
  }
  .effect.slideMask:before, .effect.slideMask:after {
    content: "";
    display: block;
    position: absolute;
    animation-duration: 1.25s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
  }
  .effect.slideMask:before {
    background: #ffffff;
  }
  .effect.slideMask:after {
    background: #f0f0f0;
  }
  .effect.slideMask.left:before, .effect.slideMask.left:after, .effect.slideMask.right:before, .effect.slideMask.right:after {
    top: 0;
    height: 100%;
  }
  .effect.slideMask.top:before, .effect.slideMask.top:after, .effect.slideMask.bottom:before, .effect.slideMask.bottom:after {
    left: 0;
    width: 100%;
  }
  .effect.slideMask.left:before, .effect.slideMask.right:before {
    width: 100%;
  }
  .effect.slideMask.left:after, .effect.slideMask.right:after {
    width: 0%;
  }
  .effect.slideMask.top:before, .effect.slideMask.bottom:before {
    height: 100%;
  }
  .effect.slideMask.top:after, .effect.slideMask.bottom:after {
    height: 0%;
  }
  .effect.slideMask.top:before, .effect.slideMask.top:after {
    top: 0;
  }
  .effect.slideMask.right:before, .effect.slideMask.right:after {
    right: 0;
  }
  .effect.slideMask.bottom:before, .effect.slideMask.bottom:after {
    bottom: 0;
  }
  .effect.slideMask.left:before, .effect.slideMask.left:after {
    left: 0;
  }
  .effect.slideMask.insert.top:before, .effect.slideMask.insert.bottom:before {
    animation-name: slideMaskBeforeH;
  }
  .effect.slideMask.insert.top:after, .effect.slideMask.insert.bottom:after {
    animation-name: slideMaskAfterH;
  }
  .effect.slideMask.insert.left:before, .effect.slideMask.insert.right:before {
    animation-name: slideMaskBefore;
  }
  .effect.slideMask.insert.left:after, .effect.slideMask.insert.right:after {
    animation-name: slideMaskAfter;
  }
   .effect.insert[class*="col-"][class*="-2"]:nth-of-type(6n+1)  {
    animation-delay: 0.0s;
  }
   .effect.insert[class*="col-"][class*="-2"]:nth-of-type(6n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="col-"][class*="-2"]:nth-of-type(6n+3) {
    animation-delay: 0.2s;
  }
   .effect.insert[class*="col-"][class*="-2"]:nth-of-type(6n+4) {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="col-"][class*="-2"]:nth-of-type(6n+5) {
    animation-delay: 0.4s;
  }
   .effect.insert*[class*[class*="col-"][class*="-2"]:nth-of-type(6n+6) {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="col-"][class*="-3"]:nth-of-type(4n+1) {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="col-"][class*="-3"]:nth-of-type(4n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="col-"][class*="-3"]:nth-of-type(4n+3) {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="col-"][class*="-3"]:nth-of-type(4n+4) {
    animation-delay: 0.3s;
  }
/*  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(3n+1) {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(3n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(3n+3) {
    animation-delay: 0.2s;
  }*/
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+1) {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+3) {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+4) {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+5) {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+6) {
    animation-delay: 0.5s;
  }
/*  .effect.insert[class*="col-"][class*="-4"]:nth-of-type(7n+7) {
    animation-delay: 0.6s;
  }	*/
  .effect.insert[class*="col-"][class*="-6"]:nth-of-type(2n+1) {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="col-"][class*="-6"]:nth-of-type(2n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-5"]:nth-of-type(5n+1) {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-5"]:nth-of-type(5n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-5"]:nth-of-type(5n+3) {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-5"]:nth-of-type(5n+4) {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-5"]:nth-of-type(5n+5) {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+1) {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+2) {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+3) {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+4) {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+5) {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+6) {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-7"]:nth-of-type(7n+7) {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+1):before {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+2):before {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+3):before {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+4):before {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+5):before {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+6):before {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+7):before {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+8):before {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+1):after {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+2):after {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+3):after {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+4):after {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+5):after {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+6):after {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+7):after {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-8"]:nth-of-type(8n+8):after {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+1):before {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+2):before {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+3):before {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+4):before {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+5):before {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+6):before {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+7):before {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+8):before {
    animation-delay: 0.7s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+9):before {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+1):after {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+2):after {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+3):after {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+4):after {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+5):after {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+6):after {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+7):after {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+8):after {
    animation-delay: 0.7s;
  }
  .effect.insert[class*="mono-"][class*="-9"]:nth-of-type(9n+9):after {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+1):before {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+2):before {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+3):before {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+4):before {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+5):before {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+6):before {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+7):before {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+8):before {
    animation-delay: 0.7s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+9):before {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+10):before {
    animation-delay: 0.9s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+1):after {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+2):after {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+3):after {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+4):after {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+5):after {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+6):after {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+7):after {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+8):after {
    animation-delay: 0.7s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+9):after {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="mono-"][class*="-10"]:nth-of-type(10n+10):after {
    animation-delay: 0.9s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+1):before {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+2):before {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+3):before {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+4):before {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+5):before {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+6):before {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+7):before {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+8):before {
    animation-delay: 0.7s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+9):before {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+10):before {
    animation-delay: 0.9s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+11):before {
    animation-delay: 1.0s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+12):before {
    animation-delay: 1.1s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+1):after {
    animation-delay: 0.0s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+2):after {
    animation-delay: 0.1s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+3):after {
    animation-delay: 0.2s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+4):after {
    animation-delay: 0.3s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+5):after {
    animation-delay: 0.4s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+6):after {
    animation-delay: 0.5s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+7):after {
    animation-delay: 0.6s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+8):after {
    animation-delay: 0.7s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+9):after {
    animation-delay: 0.8s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+10):after {
    animation-delay: 0.9s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+11):after {
    animation-delay: 1.0s;
  }
  .effect.insert[class*="col-"][class*="-1"]:nth-of-type(12n+12):after {
    animation-delay: 1.1s;
  }
}