/* General Body Styling */
body {
  font-family: 'Arial', sans-serif;
  background: linear-gradient(135deg, #ffefba, #ffffff); /* Latar belakang gradasi cerah */
  color: #333;
  margin: 0;
  padding: 0;
  animation: backgroundAnimation 15s ease infinite;
  background-size: 400% 400%; /* Untuk membuat animasi latar belakang lebih dinamis */
}

/* Animasi Latar Belakang */
@keyframes backgroundAnimation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* General Link Styling */
a {
  color: #ff6347; /* Warna teks merah tomato */
  text-decoration: none;
  font-weight: bold;
  transition: color 0.3s ease, transform 0.3s ease, background-color 0.3s ease;
}

/* Hover Effect for Links */
a:hover {
  color: #ffffff; /* Ubah warna teks menjadi putih saat hover */
  background-color: #ffa07a; /* Latar belakang oranye saat hover */
  padding: 5px;
  border-radius: 5px;
}

/* Active (Clicked) Effect for Links */
a:active {
  color: #ffffff; /* Warna teks putih saat klik */
  background-color: #ff4500; /* Warna jingga saat klik */
  transform: scale(1.1); /* Membesarkan sedikit elemen saat klik */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Tambahkan bayangan */
  border-radius: 10px;
}

/* Button Styling */
button, .obj_galley_link {
  background-color: #ffa07a; /* Latar belakang oranye */
  color: #ffffff;
  padding: 10px 20px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

button:hover, .obj_galley_link:hover {
  background-color: #ff6347; /* Warna merah tomato saat hover */
  transform: scale(1.05); /* Membesarkan sedikit saat hover */
}

button:active, .obj_galley_link:active {
  background-color: #cd5c5c; /* Warna merah Indian saat klik */
  transform: scale(1.1); /* Membesarkan sedikit lebih saat klik */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Tambahkan bayangan */
}

/* Header Styling */
h1, h2, h3, h4, h5, h6 {
  color: #ff4500; /* Warna teks jingga */
  text-transform: uppercase;
  letter-spacing: 1px;
  text-shadow: 2px 2px 4px #ffefba; /* Tambahkan bayangan teks cerah */
  transition: color 0.3s ease, transform 0.3s ease;
}

h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {
  color: #ffa07a; /* Ubah warna teks menjadi oranye saat hover */
  transform: scale(1.05); /* Membesarkan sedikit saat hover */
}

/* Paragraph Styling */
p {
  line-height: 1.6;
  color: #333;
  animation: textAnimation 5s ease infinite;
}

/* Animasi Teks */
@keyframes textAnimation {
  0%, 100% {
    color: #333;
  }
  50% {
    color: #ff6347; /* Berubah menjadi merah tomato di tengah animasi */
  }
}

/* Breadcrumb Styling */
.cmp_breadcrumbs {
  font-size: 14px;
  color: #333;
  text-transform: capitalize;
}

.cmp_breadcrumbs a {
  color: #ff4500; /* Warna teks jingga */
  transition: color 0.3s ease, transform 0.3s ease;
}

.cmp_breadcrumbs a:hover {
  color: #ffa07a; /* Ubah warna teks menjadi oranye saat hover */
  transform: scale(1.1);
}

.cmp_breadcrumbs a:active {
  color: #ffffff;
  background-color: #ff4500; /* Warna jingga saat klik */
  border-radius: 5px;
  padding: 3px;
}