@font-face
{
	font-family: 'Tanseek';
	src : url('../fonts/TanseekModernProArabic-Bold.ttf');
}

body
{
	margin:0;
	padding:0;
	font-family: 'Tanseek';
	overflow-x:hidden;
	padding-top: 185px;
	text-align: left;
}
.navbar
{
	background:#fff !important;
	box-shadow:0px 7px 6px rgba(0,0,0, 0.5);
}
.navbar .container-header
{
	max-width:100%;
}
.navbar .navbar-nav  .style-border
{
	color:#6f6e73;
	font-size:28px;
	margin-right:8px;
	position: relative;
	width: 148px;
}
.style-border::before , .style-border::after
{
	content: '';
	display:block;
	background-color:#972121;
	width:10px;
	height:3px;
	transition:width 1s;
}
.style-border::before
{
	position:absolute;
	left:0;
	top:3px;
}
.style-border::after
{
	position:absolute;
	right:0;
	bottom:-2px;
}
.style-border:hover::before , .style-border:hover::after
{
	width:100%;
}

.navbar-menu
{
	background:#972121;
}
.navbar-menu li
{
	position:relative;
	border-bottom: 0 solid #fff;
	margin:0 !important;
	margin-left: -4px !important;
	transform:skewX(-15deg);
	border-left:2px solid #fff;
	width: 160px;
}
.navbar-menu li:last-child
{
	border-right:2px solid #fff;
}
.navbar-menu li a
{
	font-size:20px;
	color:#fff;
	text-transform: uppercase;
	padding:15px;
	width: 100%;
}
.navbar-menu li a:hover
{
	color:#972121 !important;
}
.navbar-menu li .hvr-sweep-to-right:before
{
	background:#fff;
}
.navbar-menu li a div
{
	transform:skewX(15deg);
	text-align:center;
}
.navbar-menu li.active
{
	background:#fff;
}
.navbar-menu li.active div
{
	color:#972121 !important;
}
#carouselHome .carousel-item .carousel-img
{
	height: calc(100vh - 182px);
	object-fit: cover;
	object-position: center;
}
#carouselHome .carousel-control-prev, #carouselHome  .carousel-control-next
{
	top:47%;
	background:#6f6e73;
	padding:30px 20px;
	width:auto;
	height:20px;
}
.text h3
{
	font-size:3em;
	color:#972121;
}
.text h3::before , .text h3::after
{
	content: '';
	display:inline-block;
	background:#6f6e73;
	width:25px;
	height:4px;
	position:relative;
	top:-10px;
	border-radius:2px;
}
.text h3::before
{
	right:10px;
}
.text h3::after
{
	left:10px;
}
.text-about
{
	position:relative;
}
.text-about p
{
	font-size:1.7em;
	margin-top:20px;
}
.text-about a
{
	color: #972121;
	padding: 15px 25px;
	font-size: 25px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: 1px 0px 25px rgba(0,0,0, 0.3);
	position: absolute;
	overflow: hidden;
	right: 0;
}
.text-about a span:nth-child(1)
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:3px;
	background: linear-gradient(to right , #6f6e73, #972121);
	animation: animationButton1 2s linear infinite;
}
@keyframes animationButton1
{
	0%
	{
		transform: translateX(-100%);
	}
	100%
	{
		transform: translateX(100%);
	}
}
.text-about a span:nth-child(2)
{
	position:absolute;
	top:0;
	right:0;
	width:3px;
	height:100%;
	background: linear-gradient(to bottom , #6f6e73, #972121);
	animation: animationButton2 2s linear infinite;
	animation-delay:1s
}
@keyframes animationButton2
{
	0%
	{
		transform: translateY(-100%);
	}
	100%
	{
		transform: translateY(100%);
	}
}
.text-about a span:nth-child(3)
{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:3px;
	background: linear-gradient(to left , #6f6e73, #972121);
	animation: animationButton3 2s linear infinite;
}
@keyframes animationButton3
{
	0%
	{
		transform: translateX(100%);
	}
	100%
	{
		transform: translateX(-100%);
	}
}
.text-about a span:nth-child(4)
{
	position:absolute;
	top:0;
	left:0;
	width:3px;
	height:100%;
	background: linear-gradient(to top , #6f6e73, #972121);
	animation: animationButton4 2s linear infinite;
	animation-delay:1s
}
@keyframes animationButton4
{
	0%
	{
		transform: translateY(100%);
	}
	100%
	{
		transform: translateY(-100%);
	}
}
.projects
{
	/* background-color:#972121; */
	background:url('../image/volunteer-bg.png');
	/* background-size:cover; */
	background-position:center
}
#project-col
{
	display:flex;
	justify-content:center;
}

.social-media
{
	position: fixed;
	top: 40%;
	left: 20px;
	z-index: 9999;
}
.social-media .share
{
	display:inline-block;
	background-color:#fff;
	width:110px !important;
	height:110px;
	box-shadow:0 0 15px 0 rgba(0,0,0,0.1);
	border-radius:50%;
	text-align:center;
	line-height:110px;
	font-size:1.8em;
	cursor:pointer;
	position:relative;
	color:#972121;
	z-index:2;
}

.social-media .circle
{
	display:none;
	width: 190px;
	height: 190px;
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-22%,-22%) rotate(-45deg);
	border-right-width: 40px;
	border-right-color: #972121;
	border-right-style: solid;
	border-top-width: 40px;
	border-top-color: transparent;
	border-top-style: solid;
	border-bottom-width: 40px;
	border-bottom-color: #972121;
	border-bottom-style: solid;
	border-left-width: 40px;
	border-left-color: transparent;
	border-left-style: solid;
	box-sizing: border-box;
	border-radius: 200px;
	transform-origin: center;
	animation: rotatingIcon 1.5s cubic-bezier(.97 , .11 , .33 , .6) forwards;
}

@keyframes rotatingIcon
{
	0%
	{
		transform: translate(-22%,-22%) rotate(360deg);
	}
	100%
	{
		transform: translate(-22%,-22%) rotate(-45deg);
	}
}
.social-media .circle::before{
	content: '';
	display: block;
	width: 40px;
	height: 40px;
	background-color: #972121;
	position: absolute;
	top: -16px;
	left: 90px;
	border-radius: 50%;
}

.social-media .circle::after{
	content: '';
	display: block;
	width: 40px;
	height: 40px;
	background-color: #972121;
	position: absolute;
	bottom: -16px;
	left: -20px;
	border-radius: 50%;
}

.social-media .circle ul
{
	color:#f00;
	position:absolute;
	right:-50px;
	list-style:none;
}
.social-media .circle ul li a
{
	text-decoration:none;
}
.social-media .circle ul li a span
{
	transform: rotate(45deg);
	position: relative;
	display: flex;
	width: 39px;
	height: 39px;
	text-align: center;
	line-height: 39px;
	border-radius: 50%;
	color: #fff;
	z-index: 1;
	align-items: center;
	justify-content: center;
}
.social-media .circle ul li:nth-child(1) a span
{
	top: -5px;
	left: -22px;
}

.social-media .circle ul li:nth-child(2) a span
{
	top: 4px;
	left: -10px;
}

.social-media .circle ul li:nth-child(3) a span
{
	top: 13px;
	left: -33px;
}

.social-media .circle ul li:nth-child(4) a span
{
	top: -6px;
	left: -81px;
}

.social-media .circle ul li:nth-child(5) a span
{
	bottom: 58px;
	left: -128px;
}
.social-media .circle ul li a span
{
	transition:background-color 0.3s ease-out
}
.social-media .circle ul li a span:hover
{
	background-color:#6f6e73
}

.news .text h3::before , .news .text h3::after
{
	background:#fff;
}

.donate .donate-card
{
	position:relative;
	height:250px;
	background:#fff;
	display:flex;
	/* width:25%; */
	margin:30px 0;
	border-radius:7px;
	box-shadow: 0px 0px 10px  rgba(151,33,33, 0.7);
}

.donate .donate-card .image-box
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#972121;
	z-index:1;
	justify-content:center;
	align-items:center;
	overflow:hidden;
	transition: 0.5s ease-in-out;
}
.donate .donate-card:hover .image-box
{
	width:150px;
	height:150px;
	left:-75px;
	top:calc(50% - 75px);
	transition: 0.5s ease-in-out;
	background:#6f6e73;
}
.donate .donate-card .image-box:before
{
	content: attr(data-text);
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	text-align:center;
	font-size:6em;
	color:rgba(255,255,255,0.05);
	font-weight:700;
}
.donate .donate-card .image-box img
{
	margin-top:30px !important;
	max-width:150px;
	transition: 0.5s ease-in-out;
}
.donate .donate-card:hover .image-box img
{
	max-width:75px;
}
.donate .donate-card .content-box
{
	position:absolute;
	right:0;
	width:calc(100% - 75px);
	height:100%;
	padding:20px;
	display:flex;
	justify-content:center;
	align-items: center;
}
.donate .donate-card .content-box h3
{
	margin-bottom: 15px;
	font-size: 3em;
}
.donate .donate-card .content-box p
{
	font-size:24px;
}
.counters
{
	background-image : linear-gradient(rgba(255, 255, 255, 0.582),rgba(255, 254, 254, 0.79))
		, url(../image/volunteer-background.jpeg);
	background-size:cover;
	background-position:center;
	padding:0;
	padding-bottom:40px;
	background-attachment: fixed;
}
.counters .icon-counter
{
	display:inline-block;
	padding:10px;
	padding-bottom:0;
}
.counters .icon-counter span
{
	font-size:4em;
	margin:25px auto 0;
	color:#972121;
}

.counters p
{
	font-size:30px;
	margin-bottom: 0;
	color:#6f6e73;
}
.counters .counter
{
	font-size:40px;
}
.counters .line
{
	background:#6f6e73;
	height:2px;
	width:50%;
	margin:auto;
	position:relative;
}
.counters .line:before , .counters .line:after
{
	display:inline-block;
	content:'';
	background-color:#6f6e73;
	height:5px;
	width:5px;
	border-radius:50%;
	position:absolute;
}
.counters .line:before
{
	left: -15px;
	top: -2px;
}
.counters .line:after
{
	right: -15px;
	top: -2px;
}
.team
{
	padding:20px;
}
.team span.swiper-pagination-bullet.swiper-pagination-bullet-active
{
	background:#972121;
}
.team .swiper-container {
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
}
.team .swiper-slide {
	background-position: center;
	background-size: cover;
	width: 300px;
	height: 300px;
}
.team .swiper-slide.swiper-slide-active
{
	overflow:hidden;
	position:relative;
	transition: all 0.3s ease 0s;
	box-shadow: 1px 2px 9px rgba(0,0,0,0.7);
}
.team .swiper-slide .team-overlay
{
	display:none;
}
.team .swiper-slide.swiper-slide-active .team-overlay .position
{
	display:block;
	font-size:20px;
	color:#fff;
}
.team .swiper-slide.swiper-slide-active .team-overlay
{
	width:100%;
	height:100%;
	font-size:16px;
	color:#fff;
	background:rgba(151,33,33,0.5);
	text-align:center;
	padding:20%;
	opacity:0;
	position:absolute;
	top:0;
	left:0;
	transition: all 0.6s ease 0s;
	display:block;
}
.team .swiper-slide.swiper-slide-active .team-overlay::before , .team .swiper-slide.swiper-slide-active .team-overlay::after
{
	content:'';
	position:absolute;
	top:20px;
	left:20px;
	bottom:20px;
	right:20px;
	opacity:0;
	z-index:1;
	transform:scale(1.5);
	transition:all 0.6s ease 0.2s;
}
.team .swiper-slide.swiper-slide-active .team-overlay::before
{
	border-left:1px solid rgba(255,255,255,0.9);
	border-right:1px solid rgba(255,255,255,0.9);
	left:30px;
	right:30px;
}
.team .swiper-slide.swiper-slide-active .team-overlay::after
{
	border-top:1px solid rgba(255,255,255,0.9);
	border-bottom:1px solid rgba(255,255,255,0.9);
	top:30px;
	bottom:30px;
}
.team .swiper-slide.swiper-slide-active:hover
{
	transform: translateY(-8px);
}
.team .swiper-slide.swiper-slide-active:hover .team-overlay
{
	opacity:1;
}
.volunteer
{
	padding:25px;
	background:url('../image/volunteer-bg.png');
	/* background-size:cover; */
	background-position:center
}
.volunteer  .box
{
	width: 100%;
	position:relative;
}
.volunteer  .box .btn-volunteer , .btn-send , .btn-show-news
{
	position:relative;
	display:inline-block;
	border:none;
	text-transform:uppercase;
	background:#972121;
	text-decoration:none;
	font-size:30px;
	margin-bottom:-28px;
	padding:5px 30px 10px;
	color:#fff;
	margin: 0 40%;
}
.volunteer  .box .btn-volunteer:before , .btn-send:before , .btn-show-news:before
{
	position: absolute;
	content: "";
	border-style: solid;
	border-color: #972121;
	border-width: 0px 0px 2px 2px;
	bottom: -4px;
	left: -4px;
	right: 6px;
	top: 6px;
	display: block;
}
.btn-show-news:hover{
	text-decoration:none;
	color:#fff;
}
.volunteer  .box .btn-volunteer:after , .btn-send:after , .btn-show-news:after
{
	position: absolute;
	content: "";
	border-style: solid;
	border-color: #972121;
	bottom: 6px;
	left: 6px;
	border-width: 2px 2px 0px 0px;
	right: -4px;
	top: -4px;
	display: block;
}
.volunteer .box p
{
	margin:10px 0 40px;
	padding: 0;
	color: #972121;
	font-size: 30px;
	text-align: center;
}
.stripe-line
{
	background:url('../image/stripe.bg.png');
	width:100%;
	height:20px;
	background-size:contain;
	background-repeat:repeat-x;
}
.stripe-line-rotate 
{
	background:url('../image/striperotate.png');
	width:100%;
	height:20px;
	background-size:contain;
	background-repeat:repeat-x;
	margin-top:-8px;
}

.line-style
{
	position:relative;
	color:#972121;
}
.line-style:after
{
	background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgb(165, 165, 165), rgba(0, 0, 0, 0));
	background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
	background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
	background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#000000', GradientType=1);
	position: absolute;
	left: 0;
	right: 0;
	height: 1px;
	width: 100%;
	content: "";
	bottom: -30px;
}
.contact-box
{
	height:200px;
	margin-top:10px;
}

.contact-box span 
{
	color: #fff;
	font-size: 40px;
	margin: auto;
	display: flex;
	background: #972121;
	width: 75px;
	height: 75px;
	border-radius: 50%;
	justify-content: center;
	align-items: center;
}
.contact-box h3 
{
	color:#6f6e73;
}
.contact-box a
{
	font-size:25px;
	color:#972121;
	text-decoration:none;
	direction:ltr;
}
.contact-box p
{
	font-size: 20px;
	color: #972121;
}
.bg-gray
{
	background-color:#d6d5de;
}
#contact-from
{
	background:#fff;
	box-shadow:0px 0px 10px rgba(151,33,33, 0.7);
	border-radius:7px;
	margin-top:50px;
	padding:30px;
	padding-bottom:50px;
	text-align: left;
}
#contact-from label 
{
	font-size:30px;
	color:#972121;
}
#contact-from .form-control 
{
	height:50px;
	font-size:30px;
	border:none;
	outline:none;
	box-shadow:none;
	border-bottom:3px solid #972121;
	border-radius:0;
}
#contact-from .form-control::placeholder
{
	font-size: 20px;
}
#contact-from textarea
{
	height:auto !important;
}

[class^='imghvr-'] figcaption, [class*=' imghvr-'] figcaption
{
	background-color:rgba(151,33,33,0.1) !important;
}
.btn-gallery
{
	position:relative !important;
	display:inline-block;
	border:none;
	text-transform:uppercase;
	background:#fff;
	text-decoration:none;
	font-size:25px;
	padding:5px 20px 10px;
	color:#972121;
	margin-top:30px;
}
.btn-gallery:hover
{
	text-decoration:none;
	color:#972121;
}
.btn-gallery:before
{
	position: absolute;
	content: "";
	border-style: solid;
	border-color: #fff;
	border-width: 0px 0px 2px 2px;
	bottom: -4px;
	left: -4px;
	right: 6px;
	top: 6px;
	display: block;
}

.btn-gallery:after
{
	position: absolute;
	content: "";
	border-style: solid;
	border-color: #fff;
	bottom: 6px;
	left: 6px;
	border-width: 2px 2px 0px 0px;
	right: -4px;
	top: -4px;
	display: block;
}
.gallery-box
{
	padding: 5px;
	border: 2px solid #972121;
	height: 270px;
	box-sizing: content-box;
}
.gallery-box .imghvr-hinge-up
{
	background-color:#6f6e73;
}
.gallery-box .imghvr-hinge-up .main-image
{
	width:270px;
	height:270px;
	object-fit: cover;
}
.pattren-background
{
	background:url('../image/Pattern-background.png');
	height:375px;
	background-size:contain;
	background-repeat:no-repeat;
	position:absolute;
	width:100%;
	bottom:0;
	left: 0;
}

#about p , #message p , #tamkini p , #helmi p
{
	font-size:25px;
	text-align:justify;
	/* text-indent:25px; */
}

#daameh-pro p{
    font-size:18px;
}
.pattren-rotate
{
	background:url('../image/Pattern-rotate.png');
	height:500px;
	background-size:contain;
	background-repeat:no-repeat;
	position:absolute;
	width:100%;

}

.goals
{
	list-style:none;
	font-size:25px;
	text-align:right;
	padding:0;
}
.goals li 
{
	margin-bottom: 7px;
}
.goals li::before
{
	font-family: "Font Awesome 5 Free"; 
	font-weight: 900; 
	content: "\f124";
	color:#972121;
	position: relative;
	top: 5px;
	margin-left: 10px;
}
[class^='imghvr-shutter-out-']:before, [class*=' imghvr-shutter-out-']:before
{
	background:#972121;
}
[class^='imghvr-'], [class*=' imghvr-'], [class^='imghvr-']:before, [class^='imghvr-']:after, [class*=' imghvr-']:before, [class*=' imghvr-']:after, [class^='imghvr-'] *, [class*=' imghvr-'] *, [class^='imghvr-'] *:before, [class^='imghvr-'] *:after, [class*=' imghvr-'] *:before, [class*=' imghvr-'] *:after
{
	transition: all 1s ease;

}
.prog-style
{
	position:relative;
}
.prog-style:before
{
	position: absolute;
	content: "";
	border-style: solid;
	border-color: #972121;
	border-width: 0px 0px 4px 4px;
	bottom: 3px;
	left: -4px;
	right: 40px;
	top: 40px;
	display: block;
	z-index:-9

}
.prog-style:after
{
	position: absolute;
	content: "";
	border-style: solid;
	border-color: #972121;
	bottom: 40px;
	left: 40px;
	border-width: 4px 4px 0px 0px;
	right: -4px;
	top: -4px;
	display: block;
	z-index:-9
}

#helmi .swiper-pagination
{
	position:static;
}
#helmi span.swiper-pagination-bullet.swiper-pagination-bullet-active
{
	background:#972121;
}


#login .form-check
{
	display:flex;
	align-items:center;
}
#login .form-check-label
{
	font-size:20px;
}
#login .btn-link
{
	font-size:18px;
}
#login .card-header
{
	font-size:30px;
}
#login .col-form-label
{
	font-size:23px;
	padding:0 !important;
}
#login .btn-primary
{
	background-color:#972121;
	font-size:20px;
	padding:5 15px;
	border-color:#972121;
}

.news
{
	background:url('../image/news.jpg');
	background-size:cover;
	background-position:right;
}
.news .container
{
	padding:40px;
}
.news .slider-news
{
	margin-top:20px;
}
.news .slider-news .card
{
	max-width: 500px;
	margin-left:20px;
	border:0px;
	background:transparent;
}
.news .slider-news .card .row.no-gutters
{
	background: #fff;
	border-radius: 10px;
	border:2px solid #972121;
}
.news .slider-news .card .row.no-gutters .image-news
{
	left:-20px;
	display:flex;
	align-items:center;
}
.news .slider-news .card .row.no-gutters .image-news img
{
	border-radius: 7px;
	border:2px solid #972121;
	height:165px;
	width: 165px;
	object-fit: cover;
}

.news .slider-news .card .row.no-gutters .card-body
{
	text-align:left;
}
.z-index
{
	z-index:999;
}
.team .img-person
{
	object-fit: cover;
	width: 300px;
	height: 300px;
}

.cutom-btn ,
.cutom-btn-primary
{
	background:#6f6e73;
	color:#fff;
	border-radius: 0;
	padding:10px 15px;
	width:100px;
	font-size:18px;
	font-weight: bold;
	margin-top:20px;
}
.cutom-btn-primary
{
	background-color: #972121;
}
.cutom-btn:hover,
.cutom-btn-primary:hover
{
	color:#fff;
}
.custom-modal
{
	border-radius: 0;
}
.custom-modal .font-size-paragraph
{
	font-size: 19px;
	white-space: break-spaces;
}
.custom-modal .modal-header,
.custom-modal .modal-footer
{
	border:none;
}
.main-color
{
	color:#972121
}
.secondery-color
{
	color:#6f6e73
}
.btn-custom-bg
{
	position: relative;
	border: 6px solid #6f6e73;
	z-index: 2;
	padding: 12px 22px;
	margin: 0 10px;
	box-sizing: border-box;
	font-size: 26px;
	font-weight: 600;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
}
.btn-custom-bg:hover
{
	color:#Fff;
	text-decoration: none;
}
.btn-custom-bg:hover:before
{
	top: 0;
	left: 0;
	width: 102%;
	height: 100%;
}

.btn-custom-bg:active:before
{
	top: -10px;
	left: 18px;
	width: 102%;
	height: 100%;
}
.btn-custom-bg:before
{
	content: "";
	position: absolute;
	z-index: -1;
	top: 12px;
	left: -14px;
	width: calc(100% + 6px);
	height: calc(100% + 6px);
	background-color: #972121;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
#makeDonate .btn-sm
{
	width: 100px;
	font-size: 20px !important;
	padding: 7px;
	padding-bottom: 10px;
}
.news-content{
	text-align:left;
	font-size:24px;
}
.text-align-lang{
	text-align:left;
}
.contact-news .card-text{
	height:72px;
	max-height:72px;
}
.style-double-line::before,
.style-double-line::after
{
	content: '';
	width: 40%;
	display: block;
	height: 1px;
	background: #972121;
	position: absolute;
}
.style-double-line::after {
	right: 0;
	top: 24px;
}
.style-double-line::before {
	left: 0;
	top: 24px;
}

.donate .donate-card.bank .content-box h3{
	font-size:2em;
}
.news-card .card-img-top{
	width: 18rem;
	height: 250px;
	object-fit: cover;
	object-position: center;
	border-radius: 30px 15px;
	transform: scale(1.08);
	border: 1px solid #972121;
}
.news-card .card-text{
	height:72px;
	max-height:72px;
}

.notransition{
      -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

.section-padding {
    padding: 3em 0;
  }


@media only screen and (max-width: 600px) {
  .social-media .share {
    width: 90px !important;
    height: 90px;
    line-height: 96px;
  }
}