.box-title-post {
	color: #001a31;
	font-weight: bold;
	text-align: left;
}

.panel-body {
	padding: 15px 0 20px 20px;
	background-color: #fff;
	border-radius: 25px;
	transition: transform 0.5s ease, box-shadow 0.5s ease;
}
.panel-body:hover {
	transform: scale(1.05);
	/* Scale up by 5% on hover */
	box-shadow: 0 8px 16px rgba(172, 172, 172, 0.2);
}

.panel-body p {
	padding: 0px 15px 0px 15px;
}

.battambang-light {
	font-family: "Battambang", system-ui;
	font-weight: 300;
	font-style: normal;
	font-size: 4rem;
	font-weight: bold;
}

.battambang-regular {
	font-family: "Battambang", system-ui;
	font-weight: 400;
	font-style: normal;
}

.battambang-bold {
	font-family: "Battambang", system-ui;
	font-weight: 700;
	font-style: normal;
}

.battambang-black {
	font-family: "Battambang", system-ui;
	font-weight: 900;
	font-style: normal;
}

.badge-container {
	border: 2px solid #007bff;
	padding: 20px;
	margin: 50px auto;
	width: 300px;
	border-radius: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.badge-count {
	font-size: 3em;
	font-weight: bold;
	color: #28a745;
	/* Success Green */
}

.custom-box-container {
	padding-top: 20px;
}

.custom-panel {
	box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
	padding: 10px;
}

.custom-row-align {
	display: table;
	width: 100%;
}

/* Makes the columns behave like vertically centered table cells */
.custom-row-align>div {
	display: table-cell;
	float: none;
	/* Override Bootstrap's default float */
	vertical-align: middle;
	/* Vertical Centering */
}

/* Logo Image Styling */
.logo-img {
	/* max-width: 100px; Max-width requirement */
	height: auto;
	/* In the logo-column, the `vertical-align: middle;` on the parent table-cell 
       handles the vertical centering for the image. */
	display: block;
	/* Ensures max-width works correctly */
}

/* ---------------------------------------------------- */
/* --- Content Specific Styles --- */
/* ---------------------------------------------------- */

.box-title {
	margin-top: 0;
	color: #001a31;
}

.box-description {
	color: #000000;

}

.box-meta {
	margin-top: 10px;
}

.box-meta p {
	margin-bottom: 5px;
	font-size: 14px;
	color: #000000;
	text-align: left;
}

.box-meta i {
	margin-right: 5px;
	width: 15px;
	/* Ensures icons align nicely */
	text-align: center;
}

.muse-card {
	border-radius: 8px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	/* Smooth transition for changes */
}

.muse-card:hover {
	transform: scale(1.05);
	/* Scale up by 5% on hover */
	box-shadow: 0 8px 16px rgba(172, 172, 172, 0.2);
	/* Enhance shadow on hover */
}

@media screen and (max-width: 769px) {
	.logo-column {
		width: 100%;
	}

	.logo-colum-text {
		width: 100%;
	}

	.col-xs-12 img {
		width: 30%;
		margin: auto;
	}

	.col-xs-4-post img {
		width: 90%;
		margin-bottom: 15px;
	}

	.col-xs-12 h1 {
		color: rgb(255, 0, 0);
		font-weight: bold;
		text-align: center;
	}

	.col-xs-12 .battambang-light {
		font-size: 4rem;
		color: rgb(255, 0, 0);
		font-weight: bold;
		width: 100%;
		text-align: center;
	}

	.col-xs-12 .battambang-light-post {
		font-size: 2rem;
		color: rgb(0, 17, 100);
		font-weight: bold;
		width: 100%;
	}

	.logo-img {
		height: auto;
		display: block;
		width: 90%;
	}

	.custom-row-align {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(1fr));
		/* Responsive columns */

	}

	.logo-img-post {
		height: auto;
		display: block;
		width: 100%;
	}
}

@media screen and (max-width: 768px) {
	/* Styles for medium screens */
}

@media screen and (max-width: 480px) {
	.logo-column {
		width: 100%;
	}

	.logo-colum-text {
		width: 100%;
	}

	.col-xs-12 img {
		width: 30%;
		margin: auto;

	}

	.col-xs-4-post img {
		width: 90%;
		margin-bottom: 15px;
		border-radius: 15px
	}

	.col-xs-12 h1 {
		font-size: 2rem;
		color: rgb(255, 0, 0);
		font-weight: bold;
	}

	.col-xs-12 .battambang-light {
		font-size: 2.5rem;
		color: rgb(255, 0, 0);
		font-weight: bold;
		text-align: center;
	}

	.logo-img {
		height: auto;
		display: block;
		width: 90%;
	}

	.custom-row-align {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(1fr));
		/* Responsive columns */

	}

	.box-description {
		float: left;
		font-size: 2rem;
	}

	.panel-body p {
		padding: 0px;
	}

	.battambang-light-post {
		width: 100%;
	}

	.box-title-post {
		color: #001a31;
		font-weight: bold;
	}
}

.battambang-black {
	font-family: "Battambang", system-ui;
	font-weight: 900;
	font-style: normal;
}


@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.loading-text {
	color: #000000;
	font-size: 16px;
	margin-top: 15px;
}

.glyphicon-spin {
	animation: spin 1s infinite linear;
}