.elementor-location-header.sticky{
	position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
    background-color: #FFFFFFC7;
    backdrop-filter: blur(12px);
}
.grecaptcha-badge{
	display:none !important;
}
#filters{
    border-bottom: 1px solid #c7c7c7;
    margin-bottom: 50px;
    padding: 20px 0px;
}
#filters .nav-link{
   font-family: 'Lexend';
    font-weight: 400;
    color: #000;
    font-size: 14px;
    border-radius: 0px;
}
#filters .nav-link.show {
    font-weight: 500;
    background: #f3e064;
    border-radius: 30px;
    min-width: 80px;
    text-align: center;
}
.row-projects{
        margin-right: -10px;
    margin-left: -10px;
}
.col-projects{
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin-bottom: 20px;
}
.col-projects img{
    height: 250px !important;
    object-fit: cover;
    object-position: center center;
    border-radius: 10px !important;

}
.col-projects .title{
    font-family: 'Lexend';
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3em;
    color: #000;
}
.col-projects  .category{
  background: #f3e064;
    border-radius: 30px;
    display: inline-block;
    padding: 3px 15px;
    font-size: 11px;
	    margin-bottom: 10px;
    font-weight: 300;
}





.up, .down {
  --column-height: 100vh;   /* tinggi kolom tampilan */
  --image-height: 240px;    /* tinggi gambar */
  --row-gap: 0px;           /* jarak antar gambar */
  --num-images: 4;           /* jumlah gambar dalam gallery */

  height: var(--column-height);
  overflow: hidden;
  position: relative;

  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    black 20%,
    black 80%,
    rgba(0, 0, 0, 0) 100%
  );
}

.up .gallery br,
.down .gallery br {
  display: none !important;
}

.gallery img {
  border: none !important;
}

.up .gallery,
.down .gallery {
  display: flex;
  flex-direction: column;
  gap: var(--row-gap);
}

/* IMAGE STYLING */
.up .gallery img,
.down .gallery img {
  height: var(--image-height);
  width: 100%;
  object-fit: cover;
  display: block;
}

/* ANIMATIONS */
.up .gallery {
  animation: imagescrolling-up 15s linear infinite alternate;
}

.down .gallery {
  animation: imagescrolling-down 15s linear infinite alternate;
}

/* KEYFRAMES */
@keyframes imagescrolling-up {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(calc(
      -1 * (
        ((var(--image-height) + var(--row-gap)) * var(--num-images))
        - var(--column-height)
      )
    ));
  }
}

@keyframes imagescrolling-down {
  0% {
    transform: translateY(calc(
      -1 * (
        ((var(--image-height) + var(--row-gap)) * var(--num-images))
        - var(--column-height)
      )
    ));
  }
  100% {
    transform: translateY(0);
  }
}


.left, .right {
  --column-width: 100vw;   /* lebar tampilan */
  --image-width: 340px;    /* lebar gambar */
  --col-gap: 10px;          /* jarak antar gambar */
  --num-images: 4;         /* jumlah gambar */

  width: var(--column-width);
  overflow: hidden;
  position: relative;

  -webkit-mask-image: linear-gradient(to right,
    rgba(0, 0, 0, 0) 0%,
    black 20%,
    black 80%,
    rgba(0, 0, 0, 0) 100%
  );
}

.left .gallery br,
.right .gallery br {
  display: none !important;
}

.gallery img {
  border: none !important;
}

/* GALERI */
.left .gallery,
.right .gallery {
  display: flex;
  flex-direction: row;
  gap: var(--col-gap);
}

/* IMAGE STYLING */
.left .gallery img,
.right .gallery img {
  width: var(--image-width);
  height: 250px;
  object-fit: cover;
  display: block;
}

/* ANIMASI */
.left .gallery {
  animation: imagescrolling-left 15s linear infinite alternate;
}

.right .gallery {
  animation: imagescrolling-right 15s linear infinite alternate;
}

/* KEYFRAMES */
@keyframes imagescrolling-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(
      -1 * (((var(--image-width) + var(--col-gap)) * var(--num-images)) - var(--column-width))
    ));
  }
}

@keyframes imagescrolling-right {
  0% {
    transform: translateX(calc(
      -1 * (((var(--image-width) + var(--col-gap)) * var(--num-images)) - var(--column-width))
    ));
  }
  100% {
    transform: translateX(0);
  }
}


@media only screen and (max-width: 760px) {
 .up, .down {
  --image-height: 190px !important;   
}
	
.left, .right {
--num-images: 1; /* ubah jumlah gambar untuk hitungan animasi */
}

  .left .gallery img,
  .right .gallery img {
    height: 110px;
  }
}