a { color: #3706C8; }
a:hover { color: #0b6ab0; }

  /* Container untuk logo index */
  .index-logo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Membuat 3 kolom sama besar */
    gap: 15px; /* Jarak antar gambar */
    justify-items: center; /* Memposisikan gambar di tengah kolom */
    align-items: center;
    margin: 20px auto; /* Memusatkan grid di dalam blok */
    padding: 0 20px; /* Memberikan jarak batas kiri dan kanan agar tidak mepet */
  }

  /* Mengatur gambar agar responsif mengikuti lebar OJS */
  .index-logo-grid img {
    max-width: 100%;
    height: auto;
    border-radius: 4px; /* Opsional: memberi sudut agak membulat */
    transition: transform 0.3s ease; /* Opsional: animasi halus untuk hover */
  }

  /* Opsional: Efek membesar sedikit saat kursor diarahkan ke gambar */
  .index-logo-grid a:hover img {
    transform: scale(1.05);
  }

  /* Responsif: Berubah menjadi 2 kolom di layar tablet */
  @media (max-width: 768px) {
    .index-logo-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  /* Responsif: Berubah menjadi 1 kolom di layar HP */
  @media (max-width: 480px) {
    .index-logo-grid {
      grid-template-columns: 1fr;
    }
  }