
/* ╔═════════════════════════════════════════════════════════════════════════╗ */
/* ║                    CAROUSEL : SPRING PATCHES                            ║ */
/* ╚═════════════════════════════════════════════════════════════════════════╝ */


/* carousel : spring : turnip : L0 */
#carouselSpringPatchTurnipL0A:checked ~ .carousel-images {
  transform: translateX(0%);
}
#carouselSpringPatchTurnipL0B:checked ~ .carousel-images {
  transform: translateX(-100%);
}
#carouselSpringPatchTurnipL0C:checked ~ .carousel-images {
  transform: translateX(-200%);
}
#carouselSpringPatchTurnipL0D:checked ~ .carousel-images {
  transform: translateX(-300%);
}
#carouselSpringPatchTurnipL0E:checked ~ .carousel-images {
  transform: translateX(-400%);
}

/* navigation dot highlight */
#carouselSpringPatchTurnipL0A:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL0A"],
#carouselSpringPatchTurnipL0B:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL0B"],
#carouselSpringPatchTurnipL0C:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL0C"],
#carouselSpringPatchTurnipL0D:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL0D"],
#carouselSpringPatchTurnipL0E:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL0E"] {
  background: #444;
}

/* carousel : spring : turnip : L1 */
#carouselSpringPatchTurnipL1A:checked ~ .carousel-images {
  transform: translateX(0%);
}
#carouselSpringPatchTurnipL1B:checked ~ .carousel-images {
  transform: translateX(-100%);
}
#carouselSpringPatchTurnipL1C:checked ~ .carousel-images {
  transform: translateX(-200%);
}
#carouselSpringPatchTurnipL1D:checked ~ .carousel-images {
  transform: translateX(-300%);
}
#carouselSpringPatchTurnipL1E:checked ~ .carousel-images {
  transform: translateX(-400%);
}

/* navigation dot highlight */
#carouselSpringPatchTurnipL1A:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL1A"],
#carouselSpringPatchTurnipL1B:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL1B"],
#carouselSpringPatchTurnipL1C:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL1C"],
#carouselSpringPatchTurnipL1D:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL1D"],
#carouselSpringPatchTurnipL1E:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL1E"] {
  background: #444;
}

/* === Carousel : Spring : Turnip : L2 === */
#carouselSpringPatchTurnipL2A:checked ~ .carousel-images {
  transform: translateX(0%);
}
#carouselSpringPatchTurnipL2B:checked ~ .carousel-images {
  transform: translateX(-100%);
}
#carouselSpringPatchTurnipL2C:checked ~ .carousel-images {
  transform: translateX(-200%);
}
#carouselSpringPatchTurnipL2D:checked ~ .carousel-images {
  transform: translateX(-300%);
}
#carouselSpringPatchTurnipL2E:checked ~ .carousel-images {
  transform: translateX(-400%);
}

/* navigation dot highlight */
#carouselSpringPatchTurnipL2A:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL2A"],
#carouselSpringPatchTurnipL2B:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL2B"],
#carouselSpringPatchTurnipL2C:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL2C"],
#carouselSpringPatchTurnipL2D:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL2D"],
#carouselSpringPatchTurnipL2E:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL2E"] {
  background: #444;
}

/* carousel : spring : turnip : L3 */
#carouselSpringPatchTurnipL3A:checked ~ .carousel-images {
  transform: translateX(0%);
}
#carouselSpringPatchTurnipL3B:checked ~ .carousel-images {
  transform: translateX(-100%);
}
#carouselSpringPatchTurnipL3C:checked ~ .carousel-images {
  transform: translateX(-200%);
}
#carouselSpringPatchTurnipL3D:checked ~ .carousel-images {
  transform: translateX(-300%);
}
#carouselSpringPatchTurnipL3E:checked ~ .carousel-images {
  transform: translateX(-400%);
}

/* navigation dot highlight */
#carouselSpringPatchTurnipL3A:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL3A"],
#carouselSpringPatchTurnipL3B:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL3B"],
#carouselSpringPatchTurnipL3C:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL3C"],
#carouselSpringPatchTurnipL3D:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL3D"],
#carouselSpringPatchTurnipL3E:checked ~ .carousel-nav label[for="carouselSpringPatchTurnipL3E"] {
  background: #444;
}
