/* ============================================================
   BANNER JUDUL HALAMAN (pengganti gradasi bawaan tema)
   Berlaku untuk semua halaman yang memakai .rbt-breadcrumb-default
   (Berita, Fasilitas, Album Foto, Profil, dan lain-lain).

   Gambar:  assets/images/banner-halaman.jpg         layar komputer
            assets/images/banner-halaman-tablet.jpg  tablet
            assets/images/banner-halaman-hp.jpg      HP

   Tinggi banner mengikuti perbandingan gambar, sehingga gambar
   tampil utuh (logo di kiri atas tidak terpotong).
   Untuk mengganti gambar, cukup timpa berkas JPG dengan nama sama.
   ============================================================ */

.rbt-breadcrumb-default{
  background:#e9e4f7 url('../images/banner-halaman.jpg') center / cover no-repeat !important;
  padding:24px 0 !important;
  min-height:calc(100vw * 254 / 1195);   /* perbandingan gambar komputer */
  display:flex;
  align-items:center;
  position:relative;
}
.rbt-breadcrumb-default > .container{ position:relative; z-index:1; width:100%; }

/* Hapus lapisan putih bawaan tema yang menutupi gambar */
.rbt-breadcrumb-default::before,
.rbt-breadcrumb-default::after,
.rbt-breadcrumb-default .breadcrumb-inner::before,
.rbt-breadcrumb-default .breadcrumb-inner::after{
  display:none !important;
  content:none !important;
  background:none !important;
}
.rbt-breadcrumb-default .breadcrumb-inner{ background:none !important; }

/* Judul dan breadcrumb tetap terbaca di atas foto */
.rbt-breadcrumb-default .breadcrumb-inner .title{
  text-shadow:0 0 14px rgba(255,255,255,.95), 0 0 4px rgba(255,255,255,.9);
}
.rbt-breadcrumb-default .page-list{
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.72);
  border-radius:999px; padding:4px 16px;
}
.rbt-breadcrumb-default .page-list li{ text-shadow:none; }

/* Tablet */
@media (max-width:991px){
  .rbt-breadcrumb-default{
    background-image:url('../images/banner-halaman-tablet.jpg') !important;
    min-height:calc(100vw * 150 / 360);
  }
}

/* HP */
@media (max-width:575px){
  .rbt-breadcrumb-default{
    background-image:url('../images/banner-halaman-hp.jpg') !important;
    min-height:100vw;
  }
}