/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/


.fbox-media-overlay {
	/* Penting: Set position ke relative agar elemen anak dengan position absolute bisa relatif padanya */
	position: relative;
	/* Opsional: pastikan gambar mengisi ruang yang tersedia */
	width: 100%;
	height: auto; /* Sesuaikan atau biarkan max-height di inline style */
}

.fbox-media-overlay img {
	/* Pastikan gambar mengisi container dan responsif */
	width: 100%;
	height: 100%; /* Atau 'auto' jika max-height dari parent sudah cukup */
	object-fit: cover; /* Pastikan gambar tidak terdistorsi */
}

.fbox-title-overlay {
	/* Posisikan judul secara absolut di dalam .fbox-media-overlay */
	position: absolute;
	bottom: 0; /* Letakkan di bagian bawah gambar */
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.6); /* Latar belakang semi-transparan */
	color: white; /* Warna teks judul */
	padding: 10px 15px; /* Padding di sekitar judul */
	box-sizing: border-box; /* Pastikan padding tidak membuat lebar melebihi 100% */
	text-align: left; /* Sesuaikan perataan teks jika perlu */
}

.fbox-title-overlay h3 {
	margin: 0; /* Hapus margin default pada h3 */
	font-size: 1.2em; /* Sesuaikan ukuran font */
}

.fbox-title-overlay h3 a {
	color: white; /* Pastikan link tetap berwarna putih */
	text-decoration: none; /* Hapus underline pada link */
}

.fbox-title-overlay h3 a:hover {
	color: orange;
	text-decoration: underline; /* Tambahkan underline saat hover */
}