#special-container {
    position: relative; /* Set to relative to act as a bounding box for the car */
    height: 800px; /* Your specified height for the container */
    padding: 3rem;
}

.street-signs{
  height: 700px;
  border-left: 3px dashed #fff;
  z-index: 1;
  opacity: 0.3;
  margin-left: 3px;
}

@media (max-width: 991.98px) {
  .street-signs{
    height: 1550px;
  }
}

#car {
    position: absolute; /* Positioned absolutely within the special-container */
    left: 50%; /* Centered horizontally */
    transform: translateX(-50%); /* Adjust horizontally for center alignment */
    transition: transform 0.3s ease-in-out, top 0.3s ease;
    z-index: 10; /* Ensure the car is above other content */
}

img#car{
  height: 11rem;
}

@media (max-width: 991.98px) {
  img#car{
    height: 8rem;
  }
}

#car.turning-up {
    animation: turnUp 1s ease-in-out forwards;
}

#car.turning-down {
    animation: turnDown 1s ease-in-out forwards;
}

@keyframes turnUp {
    0% { transform: translateX(-50%) translateY(0) rotate(0deg); }
    50% { transform: translateX(-50%) translateY(-30px) rotate(90deg); }
    100% { transform: translateX(-50%) translateY(0) rotate(180deg); }
}

@keyframes turnDown {
    0% { transform: translateX(-50%) translateY(0) rotate(180deg); }
    50% { transform: translateX(-50%) translateY(30px) rotate(270deg); }
    100% { transform: translateX(-50%) translateY(0) rotate(360deg); }
}


/********* SHINY CAR EFFECT *********/
/*
.header-car {
    position: relative;
    overflow: hidden;
    height: 350px;
  width: 100%;
}

.header-car-mask {
  height: 100%;
  width: 100%;
  background-image: url('/images/header-car.png');
  -webkit-mask-image: url('/images/header-car.png');
  mask-image: url('/images/header-car.png');
  background-color: #ccc;
  background-repeat: no-repeat;
}

.shine::before {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  content: "";
  display: block;
  height: 100%;
  left: -75%;
  position: absolute;
  top: 0;
  transform: skewX(-25deg);
  width: 50%;
  z-index: 2;
  animation: shine 0.85s infinite linear;
}

@keyframes shine {
  to {
    left: 125%;
  }
}
*/
