/* here you can put your own css to customize and override the theme */
#mymessage {
    position: fixed;
    top: 0;
    right: 0;
	z-index:999999;
}
#myinner-message {
    margin: 0 auto;
}

#fountainTextG{
  position:fixed;
	top:50%;
	left:40%;
	z-index:10000000;
	filter: alpha(opacity=40); /* For IE8 and earlier */
}
/* Mobile */
@media only screen and (max-width: 767px) {
	.fountainTextG{
		font-size:30px;
	}
}

/* Tablet */
@media only screen and (min-width: 768px) and (max-width: 979px) {
	.fountainTextG{
		font-size:35px;
	}
}

/* Computer */
@media only screen and (min-width: 980px) {
	.fountainTextG{
		font-size:65px;
	}
}
.fountainTextG{
	color:#F00;
	font-family:Arial;
	text-decoration:none;
	font-weight:bold;
	font-style:normal;
	float:left;
	animation-name:bounce_fountainTextG;
		-o-animation-name:bounce_fountainTextG;
		-ms-animation-name:bounce_fountainTextG;
		-webkit-animation-name:bounce_fountainTextG;
		-moz-animation-name:bounce_fountainTextG;
	animation-duration:1.82s;
		-o-animation-duration:1.82s;
		-ms-animation-duration:1.82s;
		-webkit-animation-duration:1.82s;
		-moz-animation-duration:1.82s;
	animation-iteration-count:infinite;
		-o-animation-iteration-count:infinite;
		-ms-animation-iteration-count:infinite;
		-webkit-animation-iteration-count:infinite;
		-moz-animation-iteration-count:infinite;
	animation-direction:normal;
		-o-animation-direction:normal;
		-ms-animation-direction:normal;
		-webkit-animation-direction:normal;
		-moz-animation-direction:normal;
	transform:scale(.5);
		-o-transform:scale(.5);
		-ms-transform:scale(.5);
		-webkit-transform:scale(.5);
		-moz-transform:scale(.5);
}#fountainTextG_1{
	animation-delay:0.65s;
		-o-animation-delay:0.65s;
		-ms-animation-delay:0.65s;
		-webkit-animation-delay:0.65s;
		-moz-animation-delay:0.65s;
}
#fountainTextG_2{
	animation-delay:0.78s;
		-o-animation-delay:0.78s;
		-ms-animation-delay:0.78s;
		-webkit-animation-delay:0.78s;
		-moz-animation-delay:0.78s;
}
#fountainTextG_3{
	animation-delay:0.91s;
		-o-animation-delay:0.91s;
		-ms-animation-delay:0.91s;
		-webkit-animation-delay:0.91s;
		-moz-animation-delay:0.91s;
}
#fountainTextG_4{
	animation-delay:1.04s;
		-o-animation-delay:1.04s;
		-ms-animation-delay:1.04s;
		-webkit-animation-delay:1.04s;
		-moz-animation-delay:1.04s;
}
#fountainTextG_5{
	animation-delay:1.17s;
		-o-animation-delay:1.17s;
		-ms-animation-delay:1.17s;
		-webkit-animation-delay:1.17s;
		-moz-animation-delay:1.17s;
}
#fountainTextG_6{
	animation-delay:1.3s;
		-o-animation-delay:1.3s;
		-ms-animation-delay:1.3s;
		-webkit-animation-delay:1.3s;
		-moz-animation-delay:1.3s;
}
#fountainTextG_7{
	animation-delay:1.43s;
		-o-animation-delay:1.43s;
		-ms-animation-delay:1.43s;
		-webkit-animation-delay:1.43s;
		-moz-animation-delay:1.43s;
}
#fountainTextG_8{
	animation-delay:1.56s;
		-o-animation-delay:1.56s;
		-ms-animation-delay:1.56s;
		-webkit-animation-delay:1.56s;
		-moz-animation-delay:1.56s;
}
#fountainTextG_9{
	animation-delay:1.69s;
		-o-animation-delay:1.69s;
		-ms-animation-delay:1.69s;
		-webkit-animation-delay:1.69s;
		-moz-animation-delay:1.69s;
}
#fountainTextG_10{
	animation-delay:1.82s;
		-o-animation-delay:1.82s;
		-ms-animation-delay:1.82s;
		-webkit-animation-delay:1.82s;
		-moz-animation-delay:1.82s;
}

@keyframes bounce_fountainTextG{
	0%{
		transform:scale(1);
		color:#000000;
	}

	100%{
		transform:scale(.5);
		color:#FFFFFF;
	}
}

@-o-keyframes bounce_fountainTextG{
	0%{
		-o-transform:scale(1);
		color:#000000;
	}

	100%{
		-o-transform:scale(.5);
		color:#FFFFFF;
	}
}

@-ms-keyframes bounce_fountainTextG{
	0%{
		-ms-transform:scale(1);
		color:#000000;
	}

	100%{
		-ms-transform:scale(.5);
		color:#48A5FF;
	}
}

@-webkit-keyframes bounce_fountainTextG{
	0%{
		-webkit-transform:scale(1);
		color:#000000;
	}

	100%{
		-webkit-transform:scale(.5);
		color:#48A5FF;
	}
}

@-moz-keyframes bounce_fountainTextG{
	0%{
		-moz-transform:scale(1);
		color:#000000;
	}

	100%{
		-moz-transform:scale(.5);
		color:#48A5FF;
	}
}

.btn:disabled,
.btn.disabled {
  background-color: #ccc !important;
  color: #666 !important;
  cursor: not-allowed;
  border-color: #bbb !important;
}

html, body {
  height: 100%;
  margin: 0;
}

.wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.content {
  flex: 1;
}

a.btn.btn-disabled {
  background-color: #ccc !important;
  color: #666 !important;
  border-color: #bbb !important;
  cursor: not-allowed !important;
  opacity: 0.7;
  pointer-events: none;
}

.panel-body {
  min-height: 9em !important;
}

ul.custom-list {
    list-style: none !important; /* Menghilangkan bullet default */
    padding-left: 0;   /* Menghilangkan padding default UL */
    margin: 0;         /* Menghilangkan margin default UL */
}

ul.custom-list li {
    padding-left: 1.5em;
    text-indent: -1.5em;
    display: flex; /* Menggunakan flexbox untuk penataan */
    margin-bottom: 8px; /* Jarak antar item daftar */
}

ul.custom-list .list-number {
    /* Gaya untuk nomor */
    flex-shrink: 0;    /* Mencegah nomor menyusut */
    width: 2em;        /* Lebar tetap untuk nomor (sesuaikan sesuai panjang nomor) */
    text-align: right; /* Rata kanan untuk nomor agar sejajar dengan titik */
    padding-right: 0.5em; /* Jarak antara nomor dan teks */
    font-weight: bold; /* Opsional: membuat nomor tebal */
}

ul.custom-list li::before {
    /* Kosongkan pseudo-element default jika ada */
    content: none;
}

.bibles a {
	color: #3e4d5c;
}
.bibles a, .bibles a:focus, .bibles a:hover, .bibles a:active {
	outline: 0;
 	text-decoration: none;
}
.bibles a:hover {
	color: #E02222;
	text-decoration: underline;
}
.vertical-stack > div {
  display: block;
  width: 100%;
}
.modal {
  z-index: 999999; /* pastikan lebih tinggi dari semua elemen lain */
  position: fixed; /* pastikan tidak relative */
  top: 40px;
  left: 0;
  width: 100%;
  height: 100%;
}
.modal-footer{
  text-align: left !important;
}
.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th {
  padding: 2px !important;
  /*vertical-align: middle !important;*/
}
/*
.table > tbody > tr > td a > i {
  display: inline !important;
}*/

.modal-draggable .modal-backdrop {
  position: fixed;
}

.modal.modal-draggable {
    overflow: overflow-y;
}

.modal-draggable .modal-content:hover {
  cursor: move;
}
@media (min-width: 768px) {
  .modal-dialog {
    width: 700px;
    margin: 30px auto;
  }
  .modal-content {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
            box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
  }
  .modal-sm {
    width: 300px;
  }
 	.mymodal{
  	height: 300px;
  	overflow-y: auto;
	}
  .modal-lg{
    width: 900px;
  }
}
@media screen and (max-width: 767px) {
	.mymodal{
  	height: 300px;
  	overflow-y: auto;
	}
}

.search-box {
	/*right: -7px;*/
	top: 100%;
	padding: 15px;
	display: none;
	background: #fcfafb;
	position: absolute;
	border-top: solid 2px #ea4c1d;
	box-shadow: 5px 5px rgba(91, 91, 91, 0.2);
	width: 300px;
	margin-top: 10px;
	z-index: 22;
  left: calc(30% - 60px);
}
.search-box:after {
	top: -8px;
	width: 0;
	height: 0;
	right: 8px;
	z-index: 2;
	content: " ";
	display: block;
	position: absolute;
	border-bottom: 8px solid #e6400c;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
}
.search-box button {
	margin-left: 0 !important;
}
@media screen and (max-width: 767px) {
  .menu-search {
    top:26px;
  }
  .search-box {
    left :0 !important;
  }
  .search-box:after {
    right: 266px !important;
  }
}
.responsive-iframe {
  position: absolute;
  top: 60px;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 768px;
}

.fixed-thumb {
  height: 150px; /* atau 200px sesuai kebutuhan */
  object-fit: cover;
  width: 100%;
}
