/* ========== WARNA & EFEK DARI SCRIPT BARU ========== */
@keyframes gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes borderPulse {
  0% { box-shadow: 0 0 0 5px rgba(255,255,255,0.4),0 0 0 0 rgb(255,255,255); }
  100% { box-shadow: 0 0 0 3px rgba(226,193,96,0),0 0 0 10px rgba(253,237,124,0); }
}

.gold-gradient {
  background: linear-gradient(144deg, #755f1d 15%, #dbbd62 33%, #755f1d 67%, #e2c460 100%);
  background-size: 400% 400%;
  animation: gradient 5s ease infinite;
  box-shadow: inset 0 0 5px 3px #ffd045, 3px 3px 3px 1px rgba(0,0,0,.2);
}

.border-gold {
  border: 2px solid #ffc115 !important;
  animation: borderPulse 1s infinite ease-out;
}

/* ================================================== */
/* == CSS UTAMA YANG SUDAH DIUBAH WARNANYA ==========*/
/* ================================================== */

.waktu{
  color: #fff;
  text-shadow: 4px 5px 1px black;
  font-size: 23px;
  font-weight: bolder;
  text-align: center;
}

.waktu img{
  display: inline-block;
  width: 70px;
  height: 70px;
}

.waktu p{
  display: inline-block;
}

/* TABLE GOLD */
table{
  text-align: center;
  margin-bottom: 10px;
}
table, table caption, table th, table tr, table td{
  text-shadow: 1px 1px 1px black;
  border: 2px outset #dbbd62;
  text-align: center;
  color: #fff;
  font-weight: bolder;
  background: linear-gradient(144deg, #755f1d 15%, #dbbd62 33%, #755f1d 67%, #e2c460 100%);
  background-size: 400% 400%;
  animation: gradient 5s ease infinite;
}

.atas{
  width: 100%;
  text-align: center;
}

.kontener{
  margin: 0 auto;
  width: 90%;
  display: flex;
  height:auto;
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
}

.bawah{
  width: 100%;
  height: auto;
  text-align: center;
}

/* LINK BAGIAN BAWAH */
.bawah a{
  color: #fff;
  text-decoration: none;
  display: inline-block;
  width: 100%;
  padding: 5px;
  font-weight: bolder;
  border-bottom-right-radius: 7px;
  border-bottom-left-radius: 7px;
  text-shadow: 1px 1px 1px black;

  /* warna baru */
  background: linear-gradient(144deg,#755f1d,#dbbd62,#755f1d);
  background-size: 400% 400%;
  animation: gradient 5s ease infinite;
  box-shadow: inset 0 0 5px 3px #ffd045;
}

.gambar{
  width: 100%;
  height: 100px;
  line-height: 100px;
  color: white;
  box-shadow: 0px 0px 3px 3px black;

  background: linear-gradient(144deg, #043a54, #755f1d 40%, #dbbd62);
}

h2, h4{
  color: white;
  text-shadow: 4px 5px 1px black;
}

/* BOX LIST */
.lihat{
  width: 250px;
  border-radius: 10px;
  border: 2px solid #ffc115;
  display: flex;
  flex-wrap: wrap;
  margin: 10px 7px;

  animation: borderPulse 1s infinite ease-out;
}

.credit{
  filter: brightness(200%);
  text-shadow: 2px 2px 1px black;
}

.credit a{
  text-decoration: none;
  color: #ffd045;
}

/* FOOTER GRADIENT GOLD */
.copyright{
  font-size: 24px;
  text-align: center;
  background-image: linear-gradient(144deg, #e2c160, #755f1d 50%, #fded7c);
  text-shadow: 2px 2px 1px black;
  padding: 10px;
}

/* MENU & SEARCH */
.collapse ul li a{
  color:white;
}

.search #searchbar{
  background-color: white;
  border-radius: 10px;
  width: 100%;
  height: 30px;
  font-size: 20px;
  font-weight: bolder;
}

.kotak{
  border: 1px solid #e2c460;
  color: white;
  font-weight: bolder;
  text-shadow: 0px 0px 5px black, 0px 0px 10px gold;
}

.kotak div{
  border-bottom: 1px solid #e2c460;
}