.element_give_donation {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	@media (max-width: 1024px) {
		align-items:center;
	}
	.give_detail{
		width: 100%;
		position: relative;
		.button_donate{
			margin: 35px 55px 50px 55px;
			@media(max-width: 767px){
				text-align: center;
			}
			a{
				padding: 15px 25px;
				border-radius: 50px;
				background-color: #ff6d12;
				color: #fff;
				font-size: 14px;
				line-height: 24px;
				font-weight: 700;
				transition: 0.4s ease;
				&:hover{
					background-color:#ff9d00;
				};
				i{
					margin-right: 10px;
				}
			}
		}

			.post_cat{
						position: absolute;
						right: 20px;
						top: -38px;
						a{
						font-size: 16px;
						font-weight: 500;
						color: #fff;
						background-color: #ff9d00;
						padding: 10px 20px;
						border-radius: 5px 5px 0px 0px;
						text-transform: capitalize;
						transition: 0.4s ease;
						&:hover{
							background-color:#2c2734;
						};
					    }
					}
	}

		.detail_body {
				
					
					transition: .3s all ease;
		
				
					.title {
						margin: 55px 55px 18px 55px;
						@media( max-width: 767px ){
							margin: 30px 30px 18px 30px;
						}
						a {
							color: #2c2734;
							font-size: 24px;
							line-height: 30px;
							font-weight: 500;
							transition: .3s all ease;
							&:hover {
								color: #ff6d12;
								transition: .3s all ease;
							}
						}
					}
					.desc {
						margin-bottom: 30px;
						color: #88858e;
						font-size: 18px;
						line-height: 30px;
						padding:0px 55px 30px 55px;
						border-bottom: 1px solid #423d49;

						@media( max-width: 767px ){
							padding: 0px 30px 30px 30px;
						}
					
					}
					.donate_remaining {
						display: flex;
						justify-content: baseline;
						align-items: center;
						padding-bottom: 15px;
						.donate {
							color: #fff;
							font-weight: 600;
							font-size: 16px;
							line-height: 24px;
							transition: .3s all ease;
							padding: 10px 20px;
							background-color: #222222;
							&:hover {
								transition: .3s all ease;
								background-color: #f0c84c;
							}
						}
					}
					.progress{
						height: 9px;
						overflow: visible;
						border-radius: 20px;
						margin: 55px 55px 10px 55px;
						background-color: #423d49;

						@media( max-width: 767px ){
							margin: 50px 30px 10px 30px;
							text-align: center;
						}
						.wrap_percentage_2{
							background-color: #ff6d12;
							position: relative;
							border-radius: 20px;
						}
						.wrap_percentage_1{
							background-color: #ff6d12;
							position: relative;
							border-radius: 20px;
						}
						.percentage{
							color: #2c2734 !important;
							position: absolute;
							top: -35px;
							right: -20px;
							z-index: 777;
							color: #fff;
							transition: .3s all ease;
							font-size: 16px;
						}
					}
					.raised {
						display: flex;
						margin-bottom: 20px;
						margin-top:30px;
						font-size: 20px;
						line-height: 40px;
						justify-content: space-between;
						flex-wrap: wrap;
						align-items: flex-end;
						margin: 0px 55px 0px 55px;
						@media( max-width: 767px ){
							margin: 0px 30px 0px 30px;
						}
						>div {
							span {
								display: block;
							}
						}
						.income {
							display: flex;
							font-size: 20px;
							line-height: 40px;
							color:#2c2734;
							align-items: flex-end;
							@media(max-width: 767px){
								width: 100%;
    							justify-content: center;
							}
							span:last-child {
								color: #88858e;
								padding: 0px 5px 0 5px;
								font-size: 14px;
								line-height: 40px;
							}
						}
						.goal {
							display: flex;
							font-size: 20px;
							line-height: 40px;
							color:#2c2734;
							align-items: flex-end;
							@media(max-width: 767px){
								width: 100%;
    							justify-content: center;
							}
							span:last-child {
								
								padding: 0px 0px 0 5px;
							}
						}

					}
				}


}