/*--------------------------------------------------
  Pulse
--------------------------------------------------*/

.ipd-section {
  .ipd-layer-1 {
    .ipd-btn_l1.pulse:not(.inactive) {
      -webkit-animation: pulse_l1 2s infinite;
      animation: pulse_l1 2s infinite;
    }
  }

  .ipd-layer-2 {
    .ipd-btn_l2.pulse:not(.inactive) {
      border-radius: 100%;
      -webkit-animation: pulse_l2 2s infinite;
      animation: pulse_l2 2s infinite;
    }
  }
}

/*--------------------------------------------------
  Pulse Layer 1
--------------------------------------------------*/

@-webkit-keyframes pulse_l1 {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(29, 74, 135, 0.8);
    box-shadow: 0 0 0 0 rgba(29, 74, 135, 0.8);
  }
  70% {
    -webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

@keyframes pulse_l1 {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(29, 74, 135, 0.8);
    box-shadow: 0 0 0 0 rgba(29, 74, 135, 0.8);
  }
  70% {
    -webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

/*--------------------------------------------------
  Pulse Layer 2
--------------------------------------------------*/

@-webkit-keyframes pulse_l2 {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
  }
  70% {
    -webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

@keyframes pulse_l2 {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8);
  }
  70% {
    -webkit-box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

/*--------------------------------------------------
  1. Bakery - Zoom In
--------------------------------------------------*/

@-webkit-keyframes bakery {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-50%, 8%) scale(200%);
    transform: translate(-50%, 8%) scale(200%);
  }
}

@keyframes bakery {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-50%, 8%) scale(200%);
    transform: translate(-50%, 8%) scale(200%);
  }
}

/*--------------------------------------------------
  2. Beverage - Zoom In
--------------------------------------------------*/

@-webkit-keyframes beverage {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(57%, -35%) scale(200%);
    transform: translate(57%, -35%) scale(200%);
  }
}

@keyframes beverage {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(57%, -35%) scale(200%);
    transform: translate(57%, -35%) scale(200%);
  }
}

/*--------------------------------------------------
  3. Dairy - Zoom In
--------------------------------------------------*/

@-webkit-keyframes dairy {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(57%, 18%) scale(200%);
    transform: translate(57%, 18%) scale(200%);
  }
}

@keyframes dairy {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(57%, 18%) scale(200%);
    transform: translate(57%, 18%) scale(200%);
  }
}

/*--------------------------------------------------
  4. Deli - Zoom In
--------------------------------------------------*/

@-webkit-keyframes deli {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(31%, -18%) scale(200%);
    transform: translate(31%, -18%) scale(200%);
  }
}

@keyframes floral {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(31%, -18%) scale(200%);
    transform: translate(31%, -18%) scale(200%);
  }
}

/*--------------------------------------------------
  5. Floral - Zoom In
--------------------------------------------------*/

@-webkit-keyframes floral {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-23%, -8%) scale(200%);
    transform: translate(-23%, -8%) scale(200%);
  }
}

@keyframes floral {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-23%, -8%) scale(200%);
    transform: translate(-23%, -8%) scale(200%);
  }
}

/*--------------------------------------------------
  6. Frozen - Zoom In
--------------------------------------------------*/

@-webkit-keyframes frozen {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(45%, 60%) scale(200%);
    transform: translate(45%, 60%) scale(200%);
  }
}

@keyframes frozen {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(45%, 60%) scale(200%);
    transform: translate(45%, 60%) scale(200%);
  }
}

/*--------------------------------------------------
  7. Grab N Go - Zoom In
--------------------------------------------------*/

@-webkit-keyframes grab-n-go {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-5%, 5%) scale(200%);
    transform: translate(-5%, 5%) scale(200%);
  }
}

@keyframes grab-n-go {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-5%, 5%) scale(200%);
    transform: translate(-5%, 5%) scale(200%);
  }
}

/*--------------------------------------------------
  8. Meat - Zoom In
--------------------------------------------------*/

@-webkit-keyframes meat {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(12%, 48%) scale(200%);
    transform: translate(12%, 48%) scale(200%);
  }
}

@keyframes meat {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(12%, 48%) scale(200%);
    transform: translate(12%, 48%) scale(200%);
  }
}

/*--------------------------------------------------
  9. Produce - Zoom In
--------------------------------------------------*/

@-webkit-keyframes produce {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-40%, -47%) scale(200%);
    transform: translate(-40%, -47%) scale(200%);
  }
}

@keyframes produce {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-40%, -47%) scale(200%);
    transform: translate(-40%, -47%) scale(200%);
  }
}

/*--------------------------------------------------
  10. Seafood - Zoom In
--------------------------------------------------*/

@-webkit-keyframes seafood {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-27%, 45%) scale(200%);
    transform: translate(-27%, 45%) scale(200%);
  }
}

@keyframes seafood {
  0% {
    -webkit-transform: translate(0%, 0%) scale(100%);
    transform: translate(0%, 0%) scale(100%);
  }
  100% {
    -webkit-transform: translate(-27%, 45%) scale(200%);
    transform: translate(-27%, 45%) scale(200%);
  }
}