/* --- PENGATURAN MARGIN IMAGE 1 --- */
img.anim1 {
  margin-top: 25px !important;    /* Spasi terhadap Title di atasnya */
  margin-right: 5px!important;  /* Spasi terhadap teks Body di kanan */
  display: block !important;
}

/* --- PENGATURAN POSISI IMAGE 2 (DI BAWAH) --- */
img.anim2 {
  margin-top: 350px !important;   /* Mendorong Image2 jauh ke bawah kolom kiri */
  margin-right: 5px!important;  /* Spasi terhadap teks Body di kanan */  
  display: block !important;
}

/* --- STYLING DESKRIPSI & ANIMASI TYPING MENGGUNAKAN CSS --- */
.node .field--field_description_of_image1 {
  font-style: italic;
  color: #555555;
  margin-top: 25px !important;
  margin-left: 5px !important;
  font-family: monospace;         /* Khas gaya mesin tik */
  font-size: 14px;
  white-space: pre-wrap;          /* Menjaga teks tetap membungkus dengan rapi */
  border-right: 2px solid #000;   /* Efek kursor ketik */
  width: fit-content;
}

.node .field--field_description_of_image2 {
  font-style: italic;
  color: #555555;
  margin-top: 350px !important;
  margin-left: 5px !important;
  font-family: monospace;         /* Khas gaya mesin tik */
  font-size: 14px;
  white-space: pre-wrap;          /* Menjaga teks tetap membungkus dengan rapi */
  border-right: 2px solid #000;   /* Efek kursor ketik */
  width: fit-content;
}

/* Efek Kursor Berkedip */
@keyframes blink {
  50% { border-color: transparent; }
}
.typing-cursor-blink {
  animation: blink 0.7s step-end infinite;
}