@tailwind base;
@tailwind components;
@tailwind utilities;

/* Eigen CSS */
.height-15 {
  height: 60px;
}

/* Slider animatie normaal */
@keyframes tech-slide {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Slider animatie reverse */
@keyframes tech-slide-reverse {
  0%   { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}

.tech-animate {
  display: flex;
  width: 200%; /* dubbele set iconen voor naadloze loop */
  animation: tech-slide 25s linear infinite;
}

.tech-animate-reverse {
  display: flex;
  width: 200%; /* dubbele set iconen voor naadloze loop */
  animation: tech-slide-reverse 25s linear infinite;
}

.tech-animate:hover,
.tech-animate-reverse:hover {
  animation-play-state: paused; /* stop animatie bij hover */
}


.btn-green {
  background: #22C55E;
  color: white;
  padding: 1em;
  border-radius: 10px;
}

.mt-10 {
  margin-top: 2rem;
}