body {
	background-color: #EEEEEE !important;
}

/*Phone*/
@media screen and (max-width: 767px) {
	.container {
		padding-left: 0px !important;
		padding-right: 0px !important
	}

	#content {
		width: 100% !important;
		margin: 0px auto 58px;
		background-color: #ffffff;
		text-align: center;
	}

	#content .content-header {
		margin-bottom: 20px;
		padding: 1em;
	}

	#content .content-header img{
		width: 100%;
		margin-top: 10px;
	}	

	#content .content-body .text-slogan {
		margin-top: -1.5em;
		font-size: 1.2em;
		font-weight: bold;
		color: #000000;
	}

	#content .content-body .info-img {
		width: 90%;
		margin: 15px;
	}

	.btn-donation .donations {
		width: 100%;
		padding: 0.5em;
		margin: auto;
		background-color: #000000;
		border-radius: 20px;
		font-size: 1em;
		font-weight: bold;
		color: #ffde16 !important;
	}

	.hr-text {
		width: 50% !important;
	}

	.content-donation {
		width: 90% !important;
	}

	.qr-content {
		width: 59% !important;
	}

	.img-donation {
		width: 65%;
		margin: auto;
	}

	.content-footer {
		margin-top: -50px !important;
	}

	.box-report {
		width: 90% !important;
	}

	#content .content-carousel {
		width: 100% !important;
	}

	.img-donation {
		width: 100% !important;
	}

	.owl-slider {
		width: 90% !important;
	}

	.width-flexible {
		width: 90% !important;
		margin: auto;
	}
}


/*Tab*/
@media screen and (min-width: 768px) and (max-width: 1023px){
	#content {
		width: 100% !important;
		margin: 35px auto 90px ;
		background-color: #ffffff;
		text-align: center;
	}

	#content .content-header {
		padding: 1em;
	}

	#content .content-header img{
		width: 60%;
		margin-top: 10px;
		margin-bottom: 25px;
	}

	#content .content-body .text-slogan {
		margin-top: -1.2em;
		font-size: 2em;
		font-weight: bold;
		color: #000000;
	}

	#content .content-body .info-img {
		width: 80%;
		margin: 15px;
	}

	.btn-donation .donations {
		width: 65%;
		padding: 0.5em;
		margin: auto;
		background-color: #000000;
		border-radius: 20px;
		font-size: 1.4em;
		font-weight: bold;
		color: #ffde16 !important;
	}

	.content-footer {
		margin-top: -70px !important;
	}

	.box-report {
		width: 80% !important;
	}

	.img-donation {
		width: 60% !important;
	}

	.owl-slider {
		width: 80% !important;
	}

	.width-flexible {
		width: 80% !important;
		margin: auto;
	}

}

/*Dekstop*/
@media screen and (min-width: 1024px){
	#content {
		width: 65% !important;
		margin: 20px auto 55px;
		background-color: #ffffff;
		text-align: center;
	}

	#content .content-header {
		padding: 1em;
	}

	#content .content-header img{
		width: 50%;
		margin-top: 10px;
		margin-bottom: 25px;
	}

	#content .content-body .text-slogan {
		margin-top: -1.2em;
		font-size: 2em;
		font-weight: bold;
		color: #000000;
	}

	#content .content-body .info-img {
		width: 65%;
		margin: 15px;
	}

	#content .content-body .info-img , .info-img-qr{
		width: 53%;
	}

	.btn-donation .donations {
		width: 25%;
		padding: 0.5em;
		margin: auto;
		background-color: #000000;
		border-radius: 20px;
		font-size: 1em;
		font-weight: bold;
		color: #ffde16 !important;
	}

	.box-report {
		width: 65% !important;
	}

	.owl-slider {
		width: 65% !important;
	}

	.width-flexible {
		width: 65% !important;
		margin: auto;
	}
}


#content .content-body {
	background-color: #FFDE16 ;
	padding: 1em;
}


#content .content-carousel {
	width: 65%;
	margin: auto;
	margin-bottom: 25px; 
	padding: 1em;
}

.btn-donation {
	width: 100%;
	padding: 0.5em;
	background-color: #ffffff;
	position: fixed;
	bottom: 0;
	box-shadow: 0 0 30px 0 rgb(0 0 0 / 20%);
	z-index: 5;
}

/*.btn-donations:hover {
	color: black !important;
}*/

.donations:hover {
	background-color: #ead34d;
	border-color: #ead34d;
	color: #ffffff !important;
}

.donations:focus {
	background-color: #ffde16;
	border-color: #ffde16;
	color: #000000;
}

.donations:visited {
	background-color: #000000;
	border-color: #000000;
	color: #ffffff;
}

.donations:active {
	background-color: #000000;
	border-color: #000000;
	color: #FFDE16;
}

hr {
	/*border: 1px solid #000000 !important;*/
	border-color: black;
}

.hr-text {
	width: 40%;
	background-color: #ffde16;
	margin: auto;
	font-size: 1.2em !important;
	margin-top: -1.5em !important;
}

.content-donation {
	width: 80%;
	padding: 1em;
	margin: auto;
	text-align: left;
}

.label-txt {
	font-weight: bold;
}

.qr-content {
	width: 40%;
	margin-top: 15px;
	padding: 1em;
	margin: auto; 
}

.bank-content {
	width: 50%;
	background-color: #ffffff;
	border-radius: 20px;
	padding: .5em;
	margin: auto;
	text-align: left;
	display: flex;
}

.bank-content img {
	margin-right: 5px;
}

.img-donation {
	width: 50%;
	margin: auto;
}

.content-footer {
	margin-top: -30px;
	text-align: center;
	padding: 1em;
	font-family: Roboto, sans-serif;
	font-weight: 400;
	font-size: 11px;
	color: #babbbb;
}

.donation-box-content {
	width: 100%;
	margin-top: -15px !important; 
	margin: auto;
	padding: 1em;
}

.donation-box-content .box{
	background-color: #ffffff;
	margin: 10px;
	padding: 1.2em;
	border-radius: 20px;
	font-weight: 600;
	font-family: Segoe UI-MONOSPACE;
	font-size: 17px;
	color: black;
	box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%);

}

.num-box {
	margin-bottom: -5px;
}

.label-box {
	font-weight: 500;
	font-size: 14px;
}

.box-report {
	margin: auto;
	font-family: Segoe UI;
	border-radius: 20px;
	font-size: 18px;
}

.box-report .head-box{
	background-color: #f7f7f7;
	border-top-left-radius: 20px;
	border-top-right-radius:  20px;
}

.box-report .footer-box{
	padding: 0.4em;
	background-color: #f7f7f7;
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
}

.label-title {
	font-size: 20px;
}

.label-desc {
	font-size: 13px;
}

.hr-down {
	border-bottom: 1px solid #dee2e6 !important;
}

.hr-left {
	font-size: 18px
}

.owl-slider {
	width: 65%;
	margin: auto;
	z-index: 0;
}

.news {
	/*width: 65%;*/
	padding: 0.7em;
	background-color: white;
	margin: 0px auto 15px;
	border-radius: 20px;
}

.news-block {
	width: 28%;
	background-color: whitesmoke;
	/*text-align: center;*/
	padding: 0.4em;
	border-radius: 20px;
	margin-bottom: 12px;
	font-size: 19px;
	font-weight: 700;
}

.news-block label {
	margin: auto;
}

.another-block {
	font-size: 1em;
	padding: 14px;
}

.news .news-image {
	width: 100%;
	height: 190px;
	border-radius: 20px;
	background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.news .news-image-more {
	width: 100%;
}

.news .news-image img{
	border-radius: 20px
}

.news .news-detail {
	margin: 10px;
	text-align: left;
}

.news .news-detail h5 {
	font-size: 18px;
	margin-top: 10px;
}

.news .news-detail .link-a {
	width: 53%;
	border-radius: 15px;
	font-size: 15px;
}

.br-radius {
	border-radius: 20px;
}

.bg-white {
	background-color: white !important;
	margin-bottom: -20px;
}

.img-slider {
	border-radius: 20px; 
	background-color: #ffde16; 
	padding: 0.3em;
}

.mt-min1 {
	margin-top: -1px;
}

.mb-min1 {
	margin-bottom: -1px;
}

.don-title {
	font-size: 1.1em;
	font-weight: 700;
}

.don-desc {
	font-size: 1.1em;
	font-weight: 500;
}

.btn-form {
	background-color: black !important;
	color: #ffde16 !important;
	border-radius: 20px !important;
}

.select2{
    width: 100%;
}