/********** Template CSS **********/
:root {
--primary: #074D31;
--secondary: #25935F;
--Gray25: #FCFCFD;
--dark: #0D121C;
--gray800: #1F2A37;
--SA800:#14573A;   
--black:#161616;
--foundation-color: #e9dfcf;


}

@font-face {
font-family: 'Myfont';
src: url(../fonts/IBMPlexSansArabic-Regular.woff);
}


#preloader{
background:white url(../img/logo.jpg) no-repeat center center ;
height:100vh;
width: 100%;
position:fixed;
z-index:1000;
background-size: 190px;
}


.body{
font-family: 'Myfont' !important;
}
/***for main title size  ***/

.xl{

line-height:  3.75rem;
font-weight: 900;
font-size: 3rem;
font-family: 'Myfont' !important;


}

.foundation-color{
    color: var(--foundation-color);
}
.gray25{
color:  var(--Gray25);
}

.black_color{
color:  var(--black);
}

.gray800{
color:  var(--Gray800);
}

.SA800{
color:  var(--SA800);
}
.green
{
    color: #1B8354;
}

 
.lg{

line-height: 2.75rem;
font-weight: 900;

font-size:  2.25rem ;
font-family: 'Myfont';
cursor: default;
}

.md_title{
cursor: default;
line-height: 2.375rem;
font-weight: 900;
color: #1F2A37;
font-size: 1.875rem;
font-family: 'Myfont'; 
}

.sm_title{
cursor: default;
line-height: 2.375rem;
font-weight: 900;
color: #1F2A37;
font-size: 1.5rem;
font-family: 'Myfont'; 
}
.align_text
{
align-self: stretch;
}
/***for main title size  ***/


.md_p{    cursor: default;

line-height: 1.875rem;

font-size: 1.25rem;
font-family: 'Myfont' !important;

}
.xs_p{
cursor: default;
line-height: 1.5rem;

font-size: 1rem;
font-family: 'Myfont' !important;

}
.xs_weight_normal{
font-weight: normal;
}

.xs_weight_900{
font-weight: 900;
}
.justify_P{
text-align: justify !important;  
}

.text-center{
text-align: center;
}


/*** spacing **/


/*** Button ***/

.primary-button {
position: relative;
border-radius: 4px;
background-color: #1b8354;
width: auto;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #fff;
font-family: 'Myfont';
border:0px;
line-height: 24px;
font-weight: 500;
}
.primary-button:hover{
background-color: #166A45;

}

.secondary-button {
position: relative;
border-radius: 4px;
background-color: #0D121C;
width: auto;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #fff;
font-family: 'Myfont';
border:0px;
line-height: 24px;
font-weight: 500;
}

.secondary-outline {
position: relative;
border-radius: 4px;
background-color: white;
width: auto;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #fff;
font-family: 'Myfont';
border:0px;
line-height: 24px;
font-weight: 500;
border: 1px solid #D2D6DB;
}

.secondary-outline:hover {

background-color: #F3F4F6;
}

.secondary-button:hover{
background-color: #1F2A37;

}



.bg-box:hover{
background-color: #166A45;
cursor: pointer;
}


.linkOfFooter:hover{
color: rgba(255, 255, 255, .8);
text-decoration: underline;
}


.social-icon {
width: 20px;
position: relative;
height: 20px;
}
.button_social {
width: 100%;
position: relative;
border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0.3);
box-sizing: border-box;
height: 32px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 12px;
min-width: 32px;
max-width: 32px;
min-height: 32px;
max-height: 32px;
}


.link-animated a:hover {
padding-left: 0px;
}
.button_social:hover {
background-color: #ffffff3d;
}




.navbar-dark .navbar-nav .show>.nav-link, .navbar-dark .navbar-nav .nav-link.active {
color: #000000;
}

.btn {
font-family: 'Myfont';
font-weight: 600;
transition: .5s;
}

.btn-primary,
.btn-secondary {
color: #FFFFFF;
box-shadow: inset 0 0 0 50px transparent;
}

.btn-primary:hover {
box-shadow: inset 0 0 0 0 var(--primary);
}

.btn-secondary:hover {
box-shadow: inset 0 0 0 0 var(--secondary);
}
.btn_second{
padding-left: 16px; padding-right: 16px; border-radius: 4px; overflow: hidden; border: 1px #D2D6DB solid;

}
.btn-square {
width: 36px;
height: 36px;
}

.btn-sm-square {
width: 30px;
height: 30px;
}

.btn-lg-square {
width: 48px;
height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
padding-left: 0;
padding-right: 0;
text-align: center;
}


/*** Navbar ***/
.navbar-dark .navbar-nav .nav-link {
font-family: 'Myfont', sans-serif;
position: relative;
color: black;
font-size: 16px;
font-weight: 600;
outline: none;
transition: .5s;
height: 72px;
align-content: center;


}



.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active {
color: var(--primary);
background-color: #1b8354;
color: #fff;
border-radius: 4px;
}


/*.active-arrowDown{
filter: invert(100%) brightness(200%);

}*/

.navbar-dark .navbar-nav .nav-link:hover{

background-color: #F3F4F6;
color: #161616;
border-radius: 4px;
}
.navbar-dark .navbar-brand h1 {
color: #FFFFFF;
}

.navbar-dark .navbar-toggler {
color: var(--primary) !important;
border-color: var(--primary) !important;
}

.navbar-dark .navbar-nav .nav-link.active {
color: #fff;
background-color: #1b8354;
border-radius: 4px;
}

/* Ensure hover styles do not override active links */
.navbar-dark .navbar-nav .nav-link.active:hover {
color: #fff; /* Keep text white */
background-color: #166a45;; /* Keep background green */
}

/* Hover styles for non-active links */
.navbar-dark .navbar-nav .nav-link:not(.active):hover {
background-color: #F3F4F6;
color: #161616;
border-radius: 4px;
}


@media (max-width: 992px){



.hide_mobile{
display: none;}
}
@media (min-width: 992px){

.hide_desktop{
display: none;
}



}
@media (min-width: 992px) {
/* Default hover underline for nav links */
.navbar-dark .navbar-nav .nav-link:hover::before {
width: 80%;
left: 11px;
bottom: 0;
height: 6px;
width: calc(100% - 24px);
display: block;
position: absolute;
bottom: 0px;
background-color: #9DA4AE; /* Default underline color */
border-radius: 4px;
z-index: 9;
}

/* Red underline for active links */
.navbar-dark .navbar-nav .nav-link.active::before {
background-color: #54C08A; /* Red underline for active links */
}

/* Ensure hover does not override active styles */
.navbar-dark .navbar-nav .nav-link.active:hover::before {
background-color: #54C08A; /* Maintain red underline on hover */
}
}


@media (min-width: 992px) {
.navbar-dark .navbar-nav .nav-link:hover::before {
width: 80%;
left: 11px;
bottom: 0;
height: 6px;
width: calc(100% - 24px);
display: block;
position: absolute;
bottom: 0px;
background-color: #9DA4AE;
border-radius: 4px;
z-index: 9;
}
}


@media (min-width: 992px) {
.nav-link.active::before {
width: 80%;
left: 11px;
bottom: 0;
height: 6px;
width: calc(100% - 24px);
display: block;
position: absolute;
bottom: 0px;
background-color: #34ad54;
border-radius: 4px;
z-index: 9;
}
}






/*** Carousel ***/
.carousel-caption {
/*top: 0;*/
left: 0;
right: 0;
bottom: 0;
z-index: 1;
/*
background: linear-gradient(-183deg, #181010 18.07%, rgba(24, 16, 16, .77) 61.28%, rgba(24, 16, 16, 0) 110.35%);
    */
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 40px 80px;
box-sizing: border-box;
text-align: right;
font-size: 60px;
color: #fff;
font-family: 'Myfont'; 
              background: url("/img/hero/22.svg") center / cover no-repeat;


}

.carousel-control-prev,
.carousel-control-next {
width: 10%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
width: 3rem;
height: 3rem;
}


/*** Section Title ***/

.section-title.text-center::before {
left: 50%;
margin-left: -75px;
}

.section-title.section-title-sm::before {
width: 90px;
height: 3px;
}






@-webkit-keyframes section-title-run {
0% {left: 0; } 50% { left : 145px; } 100% { left: 0; }
}

@-webkit-keyframes section-title-run-center {
0% { left: 50%; margin-left: -75px; } 50% { left : 50%; margin-left: 45px; } 100% { left: 50%; margin-left: -75px; }
}

@-webkit-keyframes section-title-run-sm {
0% {left: 0; } 50% { left : 85px; } 100% { left: 0; }
}


/*** Service ***/

.stat-item {
position: relative;
min-height: 250px;
transition: .5s;
background: white; 
border-radius: 16px;   
border: 1px solid #d2d6db
}

.Card-MDA-item {
position: relative;
min-height: 300px;
/** padding: 0 30px;**/
transition: .5s;

background: white; 
border: 1px #D2D6DB solid;
border-radius: 16px;    
}

.Card-MDA-item .car-mda-icon {
margin-bottom: 30px;
width: 60px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
background: var(--primary);
border-radius: 2px;
transform: rotate(-45deg);
}

.Card-MDA-item .car-mda-icon i {
transform: rotate(45deg);
}

.Card-MDA-item a.btn {
position: absolute;
width: 60px;
bottom: -48px;
left: 50%;
margin-left: -30px;
opacity: 0;
}

.Card-MDA-item:hover a.btn {
bottom: -24px;
opacity: 1;
}


/*** Advertisement ***/
.adv-carousel .owl-dots {
margin-top: 55px;
display: flex;
align-items: flex-end;
justify-content: center;
}

.adv-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.adv-carousel .owl-dot.active {
background: #1b8354;
border: 1px solid #1b8354;
}

.adv-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.adv-carousel .owl-item .adv-item {
transition: .5s;
}

.AboutStat-carousel .owl-dots {
display: flex;
align-items: flex-end;
justify-content: center;
margin-top: 16px;
}

.AboutStat-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.AboutStat-carousel .owl-dot.active {
background-color: #1b8354;
border: 1px solid #1b8354;
}

.AboutStat-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.AboutStat-carousel .owl-item .AboutStat-item {
transition: .5s;
}









/*** about project ***/
.AboutProject-carousel .owl-dots {

display: flex;
align-items: flex-end;
justify-content: center;
}

.AboutProject-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.AboutProject-carousel .owl-dot.active {
background-color: #1b8354;
border: 1px solid #1b8354;
}

.AboutProject-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.AboutProject-carousel .owl-item .AboutProject-item {
transition: .5s;
}




.News-carousel .owl-dots {
margin-top: 55px;
display: flex;
align-items: flex-end;
justify-content: center;
}

.News-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.News-carousel .owl-dot.active {
background: #1b8354;
border: 1px solid #1b8354;
}

.News-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.News-carousel .owl-item .News-item {
transition: .5s;
}





.team-item .team-img img,
.blog-item .blog-img img ,
.Card-MDA-item  .blog-img img{
transition: .5s;
}

.team-item:hover .team-img img,
.blog-item:hover .blog-img img,
.Card-MDA-item:hover .blog-img img
{
transform: scale(1.15);
}


.back-to-top {
position: fixed;
display: none;
right: 45px;
bottom: 45px;
z-index: 99;
}

.bg-header {
background: linear-gradient(rgba(9, 30, 62, .7), rgba(9, 30, 62, .7)), url(../img/carousel-1.jpg) center center no-repeat;
background-size: cover;
}

.link-animated a {
transition: .5s;
}

.link-animated a:hover {
padding-left: 10px;
}


.video-container {
position: relative;
width: 100%;
height: 60vh;
overflow: hidden;

flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 40px 80px;
box-sizing: border-box;
text-align: right;
font-size: 60px;
color: #fff;
font-family: 'Myfont';    

}

#background-video {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
object-fit: cover;
transform: translate(-50%, -50%);
z-index: -1;
}

.content {
position: relative;
z-index: 1;
color: white;
text-align: center;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}


.logo_heightWidth {
width: 190px;
height: 48px;
}

.background-careo{
width: 100%; 
background-image: url(../img/bg-02.jpg);
background-size: cover;
background-repeat: no-repeat;
position: relative; /* Make sure the container can position its pseudo-elements */

}

.background-stat{
background-color: white; 
}

.background-careo::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;

background: linear-gradient(45deg, #14573a, #1b8354bf);   z-index: 1; /* Make sure the overlay is above the background but below any content */
}



.background-news{
width: 100%;
height: 100vh; /* This makes the div cover the entire viewport height */
background-image: url('../img/Background.png'); /* Replace with your image URL */
background-size: cover; /* Ensures the background image covers the entire div */
background-position: center; /* Centers the background image */
background-repeat: no-repeat; /* Prevents the background image from repeating */
height: 400px;
width: 100%;
position: relative;
max-width: 100%;
overflow: hidden;
height: 255.2px;

}


.logo {
width: 200px;
}

.bg-box
{
background-color: #074d31;
border-radius: 16px;
background-color: #067647;
border: 1px solid #067647;
box-sizing: border-box;
height: 125.4px;
}

.bg-box-1{
background: #14573A;
min-height: 340px;
color: white;
text-align: right;
border-radius: 8px;
}
.bg-box-2{
background: #0D121C;
min-height: 340px;
color: white;
text-align: right;
border-radius: 8px;
}

.text-right{
text-align: right;
direction: ltr;
}


h2.title-style1 {
display: block;
padding-bottom: 0;
font-size: 40px;
text-align: right;
height: 46px;
line-height: 46px;
margin: 80px auto 30px auto;
}


h2.title-style1 span {
background-color: #fff;
position: relative;
z-index: 10;
padding: 0 0 0 30px;
color: #313233;
}

h2.title-style1:after {
content: " ";
display: block;
width: 100%;
background-color: #ededed;
height: 5px;
top: -20px;
position: relative;
}

.title_btn{
display: flex;
justify-content: space-between;
}


.btn-primary {
background-color: #0D121C;
border-radius: 4px !important;
color: #fff;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
border: 0;
padding: 0px 16px;
height: 40px;
min-height: 40px;
max-height: 40px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
text-align: left;
font-weight: 500;
line-height: 24px;
}



.bg-box-shortcut{
background: #14573A;
min-height: 125.37px;
width: 115.34px;
color: white;
text-align: right;
border-radius: 8px;
}


.empty-white{
height: 400px;
width: 100%;
background-color: white;
}


/*** ShortCut link ***/

.ShortCut_link-carousel .owl-dots {
margin-top: 55px;
display: flex;
align-items: flex-end;
justify-content: center;
}

.ShortCut_link-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.ShortCut_link-carousel .owl-dot.active {
background-color: #1b8354;
border: 0px solid #D2D6DB;
}

.ShortCut_link-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.ShortCut_link-carousel .owl-item .ShortCut_link-item {
transition: .5s;
}


/*** Discover All Projects ***/

.Discover_AllProjects-carousel .owl-dots {
margin-top: 55px;
display: flex;
align-items: flex-end;
justify-content: center;
}

.Discover_AllProjects-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.Discover_AllProjects-carousel .owl-dot.active {
background: #1b8354;
border: 1px solid #1b8354;
}

.Discover_AllProjects-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.Discover_AllProjects-carousel .owl-item .Discover_AllProjects-item {
transition: .5s;
}


.project-description {
padding: 20px;
}


.label_BG{
background-color: #1B8354;
color: white;
border: none;
padding: 0px 16px;
text-align: center;
display: inline-block;
font-size: 16px;
cursor: pointer;
border-radius: 4px;
height: 40px;
min-height: 40px;
max-height: 40px;
}

.more-button {
display: inline-flex;
align-items: center;
background-color: #4CAF50; /* Button background color */
color: white; /* Text color */
border: none;
padding-bottom: 16px;
text-align: center;
text-decoration: none;
font-size: 16px;
cursor: pointer;
border-radius: 5px;
}

.more-button img {
margin-right: 8px; /* Space between image and text */
}

.more-button span {
display: inline-flex;
align-items: center;
}

.more-button:hover{
text-decoration: underline;
color: white;
}

.round-img {
border-radius: 8px;
}


.more-button{

background-color: #ff000000;
border: 0px solid;
font-size: 1rem;
line-height: 24px;
color: white;
}


.footer-item{

color: #fff;
font-size: 1rem;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
cursor: pointer;
    text-decoration: none;
}


.footer-item:hover{

color: rgba(255, 255, 255, .8);
text-decoration: underline;  
}


.main-title-footer{
color: #fff;
font-size: 1.125rem;
margin-bottom: 16px;
}
.project-button{

border-radius: 4px;
background-color: #1b8354;
width: 100%;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #fff;
font-family: 'Myfont';
border: 0px solid ;
width: 8%;
}
.card-button {
border-radius: 4px;
background-color: #1b8354;
width: 100%;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #fff;
font-family: 'Myfont';
border: 0px solid ;

}
.card-button:hover {
background-color: #218838;
}

/*
.bg-dark
{
background-color: var(--primary) !important;
}
*/

.news_background{
object-fit: cover;
width: auto;
overflow: hidden;
background-size: cover; /* Ensures the image covers the entire div */
background-position: center; /* Centers the image */
background-repeat: no-repeat; /* Prevents the image from repeating */
border-radius:8px;
}

.blog-img {
height: 250px;
margin: 16px;
}


.owl-carousel .nav-btn{
position: absolute;
cursor: pointer;
top: 100px !important;

width: 100px;
height: 100px;
background-color: #f0f5f0; /* Light gray background */
display: flex;
justify-content: center;
align-items: center;
border-radius: 12px; /* Rounded corners */
border:0px solid;
}

.owl-carousel .owl-prev.disabled,
.owl-carousel .owl-next.disabled{
pointer-events: none;
opacity: 0.2;
}

.owl-carousel .prev-slide{
background: url(../img/next.svg) no-repeat scroll 0 0;
left: -43px;
}
.owl-carousel .next-slide{
background: url(../img/next.svg)  no-repeat scroll -24px 0px;
right: -33px;
}
.owl-carousel .prev-slide:hover{
background-position: 0px -53px;
}
.owl-carousel .next-slide:hover{
background-position: -24px -53px;
}   


.title_link{
text-align: center;
color: black;
font-weight: 900;
font-size: 1.25rem;
}


hr {
border: none;
height: 1px;
width: 70%;
}



.main-title-section {
width: 100%;
position: relative;
background-color: #f3fcf6;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;

box-sizing: border-box;
text-align: right;
font-size: 30px;
color: #161616;
font-family: 'Myfont';
}

































.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
color: rgb(0 0 0 / 75%);
}


.nav-link {
font-size: 16px;
font-weight: 600;
display: block;
padding: 1rem 1rem;
color: #000000;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}




.collapse:not(.show) {
display: none;
}
.navbar-collapse {
flex-basis: 100%;
flex-grow: 1;
align-items: center;
}



.img-padding-shortcut{


padding: 36px;
}

.width-shortcut{
width: 124px;
}



.vector-icon {
width: 1183px;
position: absolute;
margin: 0 !important;
top: calc(50% - 616px);
left: calc(50% - 1375px);
height: 1183px;
opacity: 0.02;
z-index: 0;
}
.button {
width: 90px;
border-radius: 4px;
border: 1px solid #d2d6db;
box-sizing: border-box;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: none;
min-height: 40px;
max-height: 40px;
}
.link-text {
position: relative;
line-height: 20px;
color: #384250;
}
.link-text:hover {
position: relative;
line-height: 20px;

text-decoration: underline;
color: #6c737f !important;
cursor: pointer;
}

.link-text2 {
position: relative;
line-height: 20px;
color:#9DA4AE;
}

.link-text2:hover {
cursor: default;
color:#9DA4AE;
}


.old-chevron-left-icon {
width: 16px;
position: relative;
height: 16px;
overflow: hidden;
flex-shrink: 0;
}
.breadcrumb-item {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
padding: 0px 0px 0px 4px;
gap: 4px;
}
.breadcrumb-item1 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
padding: 0px 0px 0px 4px;
color: #384250;
}
 
.breadcrumb-wrapper {
flex: 1;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
}
.title {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-end;
gap: 32px;
color: #9da4ae;
}
.b {
align-self: stretch;
position: relative;
line-height: 38px;
}
.title1 {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-end;
gap: 32px;
font-size: 30px;
}
.div {
width: 720px;
position: relative;
font-size: 16px;
line-height: 24px;
display: inline-block;
}
.content {
align-self: stretch;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
gap: 24px;
}
.section {
width: 1280px;
display: none;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
max-width: 1280px;
z-index: 1;
}

.image-continer{
align-self: stretch;
position: relative;
border-radius: 8px;
max-width: 100%;
overflow: hidden;
height: 250px !important;
flex-shrink: 0;
object-fit: cover;
}

.image-continer-related{
align-self: stretch;
position: relative;
border-radius: 8px;
max-width: 100%;

flex-shrink: 0;
object-fit: cover;
}
.image-icon-related {
align-self: stretch;
position: relative;
border-radius: 8px;
max-width: 100%;
overflow: hidden;
flex-shrink: 0;
/*object-fit: cover;
*/}




.image-news-detalis{
border-radius: 8px; 
}

.image-icon {
align-self: stretch;
position: relative;
border-radius: 8px;
max-width: 100%;
overflow: hidden;
height: 250px !important;
flex-shrink: 0;
object-fit: cover;
}

.image-icon-achivement{
align-self: stretch;
position: relative;
border-radius: 8px;
max-width: 100%;
overflow: hidden;

flex-shrink: 0;
object-fit: cover;
}



.image-icon-achivement:hover {
transform: scale(1.1);
overflow: hidden;
}


.image-icon-achivement{
transition: transform 0.5s ease;
display: block;
width: 100%;
transition: transform 0.3s ease;
}


.image-icon2 {
align-self: stretch;
position: relative;
border-radius: 8px;
max-width: 100%;
overflow: hidden;
height: 580px !important;
flex-shrink: 0;
object-fit: cover;
}



.image-icon2:before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: -moz-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
/* background: -webkit-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%); */
/* background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(18%, transparent), color-stop(99%, rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.8))); */
background: -o-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
background: linear-gradient(to bottom, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );
z-index: 2;
}




.b1 {
align-self: stretch;
position: relative;
line-height: 28px;
width: 100%;
font-size: 1.25rem;
line-height: 28px;
display: inline-block;
color: #0d121c;
text-align: right;
}


}

.div1 {
align-self: stretch;
position: relative;
font-size: 16px;
line-height: 24px;
color: #1f2a37;
}
.content-news {
align-self: stretch;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
/*gap: 8px;*/
overflow: hidden;
}


.text-wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.button2 {
border-radius: 4px;
background-color: #1b8354;
height: 40px;
overflow: hidden;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
font-weight: 500;
cursor: pointer;

}
.actions {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
text-align: left;
font-size: 16px;
color: #fff;
}
.card {
flex: 1;
border-radius: 16px;
background-color: #fff;
border: 1px solid #d2d6db;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
padding: 16px;
gap: 24px;
overflow: hidden;
}
.card1 {
flex: 1;
border-radius: 16px;
background-color: #fff;
border: 1px solid #d2d6db;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
padding: 16px;
gap: 24px;
}
.cards {
align-self: stretch;
width: 1280px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 16px;
z-index: 2;
font-size: 18px;
overflow: hidden;
}
.articles-and-news-section {
width: 100%;
position: relative;
height: 550px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 40px 80px;
box-sizing: border-box;
text-align: right;
font-size: 14px;
color: #0d121c;
font-family: 'Myfont';
}


.responsiveNews-carousel .owl-dots {
margin-top: 55px;
display: flex;
align-items: flex-end;
justify-content: center;
}

.responsiveNews-carousel .owl-dot {
position: relative;
display: inline-block;
margin: 0 5px;
width: 15px;
height: 15px;
background: white;
border-radius: 200px;
transition: .5s;
height: 14px;
width: 14px;
border-radius: 20px;
margin: 5px 4px;
border: 1px solid #D2D6DB;
}

.responsiveNews-carousel .owl-dot.active {
background: #1b8354;
border: 1px solid #1b8354;
}


.dropdown-item.active, .dropdown-item:active {
color: #fff;
text-decoration: none;
background: #1B8354;

}




.responsiveNews-carousel .owl-item.center {
position: relative;
z-index: 1;
}

.responsiveNews-carousel .owl-item .responsiveNews-item {
transition: .5s;
}



.vector-icon {
width: 1183px;
position: absolute;
margin: 0 !important;
top: calc(50% - 616px);
left: calc(50% - 1375px);
height: 1183px;
opacity: 0.02;
z-index: 0;
}
.button {
width: 90px;
border-radius: 4px;
border: 1px solid #d2d6db;
box-sizing: border-box;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: none;
min-height: 40px;
max-height: 40px;
}
.link-text {
position: relative;
line-height: 20px;
}
.old-chevron-left-icon {
width: 16px;
position: relative;
height: 16px;
overflow: hidden;
flex-shrink: 0;
}
.breadcrumb-item {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
padding: 0px 0px 0px 4px;
gap: 4px;
}
.breadcrumb-item1 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
padding: 0px 0px 0px 4px;
color: #384250;
}
.breadcrumb {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
}
.breadcrumb-wrapper {
flex: 1;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
}
.title {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-end;
gap: 32px;
}
.b {
align-self: stretch;
position: relative;
line-height: 38px;
}
.title1 {
align-self: stretch;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-end;
gap: 32px;
font-size: 30px;
color: #0d121c;
}
.content {
align-self: stretch;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
gap: 24px;
}
.section {
width: 1280px;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
max-width: 1280px;
z-index: 1;
}
.articles-and-news-section {
width: 100%;
position: relative;
overflow: hidden;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 40px 80px;
box-sizing: border-box;
gap: 32px;
text-align: right;
font-size: 14px;
color: #9da4ae;
font-family: 'Myfont';
}



owl-carousel .owl-item img {
display: block;
/* width: 100%; */
}
.img-padding-shortcut {
padding: 40px;
}




.dropdown-item {
display: block;
width: 100%;

clear: both;
font-weight: 400;
color:black;
/* text-align: inherit; */
white-space: nowrap;
background-color: transparent;
border: 0;
text-align: right;
padding: 8px 16px;
}



.link-text {
position: relative;
line-height: 20px;
color: #384250;
}
.old-chevron-left-icon {
width: 16px;
position: relative;
height: 16px;
overflow: hidden;
flex-shrink: 0;
bottom: 7px;
}
.breadcrumb-item {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
padding: 0px 0px 0px 4px;
gap: 4px;
}
.breadcrumb-item1 {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
padding: 0px 0px 0px 4px;
color: #384250;
}
.breadcrumb {
display: flex;
flex-direction: row;
align-items: center;
justify-content: stretch;
}
.breadcrumb-parent {
flex: 1;
width: 100%;
position: relative;
display: flex;
flex-direction: column;

justify-content: flex-start;
text-align: right;
font-size: 14px;
color: #384250;
font-family: 'Myfont';
height: 75px;
}

.mda-card-paragraph {
text-align: right; /* Ensure paragraph text is right-aligned */
}
.Mda-card-content {
position: relative;
display: flex;
flex-direction: column;
align-items: flex-end; /* Align items to the end to position the text on the right */
text-align: right; /* Align text to the right */
width: 100%;
}

.mda-card-description {
max-height: 0;
overflow: hidden;
transition: max-height 0.5s ease-out, padding 0.5s ease-out;
text-align: right; /* Ensure text inside is right-aligned */
width: 100%;
}

.mda-card-description.open {
max-height: 500px; /* Adjust this value based on the content height */
padding-top: 10px;
padding-bottom: 10px;
width: 100%;
}

.toggle-content-button {
background: none;
border: none;
font-size: 24px;
cursor: pointer;
position: absolute;
left: 0; /* Position the button on the left */
top: 0; /* Ensure the button is at the top */
transition: transform 0.5s ease;
}

.toggle-content-button.open {
transform: rotate(180deg);
}

.mda-card-title {
text-align: right; /* Ensure title is right-aligned */
width: 100%; /* Ensure the title takes full width */
}
















/*pagination*/


.leading-icon {
width: 16px;
position: relative;
height: 16px;
}
.button_paggination {
width: 40px;
border-radius: 4px;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-width: 40px;
max-width: 40px;
min-height: 40px;
max-height: 40px;
}

.paginationitem {
width: 45px;
border-radius: 4px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px;
box-sizing: border-box;
}
.paginationitem1 {
width: 40px;
border-radius: 4px;
border: 1px solid #161616;
box-sizing: border-box;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px;
}
.paginationitem2 {
width: 26px;
border-radius: 4px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px;
box-sizing: border-box;
}
.div4 {
position: relative;
line-height: 24px;
z-index: 0;
}
.selector {
width: 24px;
position: absolute;
margin: 0 !important;
top: 37px;
left: calc(50% - 12px);
border-radius: 9999px;
background-color: #1b8354;
height: 3px;
z-index: 1;
}
.paginationitem4 {
width: 26px;
border-radius: 4px;
height: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px;
box-sizing: border-box;
position: relative;
}
.rtltrue-sizelarge {
position: relative;
width: 100%;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: flex-start;
gap: 8px;
text-align: left;
font-size: 16px;
color: #161616;
font-family: 'Myfont';
}






/*Center Media*/ 



.card-mda-icon {
width: 48px;
height: 48px;
border-radius: 50%;
background-color: #f3fcf6;
display: flex;
align-items: center;
justify-content: center;
position: relative;
margin-left: auto; /* Align to the right */
}

.mda-card-title,
.Mda-card-content,
.MDA-card-actions,
.content_map 
{
align-self: stretch;
position: relative;

}



.Mda-card-content {
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
/*gap: 8px;*/
} 

.Mda-card-content p {
text-align: right;
}


. {
display: flex;
align-items: center;
justify-content: center;
}

.MDA-services-card {

height: 310px;
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
border-radius: 16px;
background-color: #fff;
display: flex
;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;

box-sizing: border-box;
/* gap: 24px;*/
text-align: right;

color: #313233;
font-family: 'Myfont';
}
.MDA-services-card-auto-width {
    height: auto;
    box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
    border-radius: 16px;
    background-color: #fff;
    display: flex
;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    box-sizing: border-box;
    /* gap: 24px; */
    text-align: right;
    color: #313233;
    font-family: 'Myfont';
}


.services-button {
border-radius: 4px;
background-color: #1b8354;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
padding: 0 16px;
box-sizing: border-box;
}

.MDA-card-actions {
display: flex;
align-items: center;
font-size: 16px;
color: #fff;
}
.image-icon {

transition: transform 0.5s ease; /* Smooth transition */
display: block;
width: 100%; /* Ensure the image fits within the card */  transition: transform 0.3s ease; /* Smooth transition */
}

.image-icon:hover {
transform: scale(1.1); /* Scale the image to 1.5 times its size on hover */
overflow: hidden;

}

.MDA-card {
width: 100%;
height: auto;
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
border-radius: 16px;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: flex-start; /* Changed from flex-end to flex-start */
justify-content: flex-start;
padding: 16px;
box-sizing: border-box;
gap: 24px;
text-align: right;
font-size: 18px;
color: #313233;
font-family: 'Myfont';
}


.auto-height-card {
width: 100%;
height:auto;
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
border-radius: 16px;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: flex-start; /* Changed from flex-end to flex-start */
justify-content: flex-start;
padding: 16px;
box-sizing: border-box;
gap: 24px;
text-align: right;
font-size: 18px;
color: #313233;
font-family: 'Myfont';
}


.center_img{

display: block;
margin: 0 auto;
text-align: center;
}


#widthFullBorder {
border: 0;
width: 100%;
}


/* Contact */ 


.content_map {
display: flex;
flex-direction: column;
justify-content: center;
gap: 8px;
}

.map-card {
width: 100%;
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
border-radius: 16px;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
padding: 16px;
box-sizing: border-box;
gap: 24px;
text-align: right;
font-size: 18px;
color: #313233;
font-family: 'Myfont';

}




.text-input {
width: 100%;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 8px;
text-align: right;
font-size: 16px;
color: #161616;
}

.label {
display: flex;
flex-direction: column;
align-items: flex-end;
width: 100%;
}

.label1 {
display: flex;
flex-direction: row;
align-items: center;
gap: 4px;
width: 100%;
}

.label{
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 4px;
    text-align: right;
    color: #161616;
    font-family: 'IBM Plex Sans Arabic';
}
.text {
line-height: 24px;
}

.required-asterisk {
color: #b42318;
line-height: 24px;
}

.input-field {
width: 100%;
padding: 8px 16px;
border-radius: 4px;
border: 1px solid #9da4ae;
box-sizing: border-box;
color: #384250;
font-size: 16px;
}

.form-card {
width: 100%;
box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
border-radius: 16px;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
padding: 16px;
box-sizing: border-box;
/*gap: 24px;*/
text-align: right;
font-size: 18px;
color: #313233;
font-family: 'Myfont';
}

/* gallery */ 

.gallery {
display: flex;
flex-wrap: wrap;
/*gap: 10px;*/
}
.gallery a {
width: 100%;
height: 100%;
overflow: hidden;
display: block;
}
.gallery img {
width: 100%;
height: auto;
}


/* Statistics */ 

.stat-icon {
width: 48px !important;
position: relative;
height: 48px;
}
.stat-title {
position: relative;
letter-spacing: -0.02em;

color: #14573A;
font-size: 1.5rem;
font-weight: 700;
}
.stat-description {
position: relative;
color: #1f2a37;
}
.stat-content {

display: flex;
flex-direction: column;
align-items: center;

}
.stat-card {
width: 100%;
position: relative;
border-radius: 16px;
background-color: #fff;
border: 1px solid #d2d6db;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 16px;
gap: 24px;
text-align: center;
font-size: 12px;
color: #14573a;
font-family: 'Myfont';
}




/* Responsive */ 


@media (max-width: 991.98px) {

.hide_text {
display: inline-block;}
}

.sticky-top.navbar-dark {
position: relative;
background: #FFFFFF;
}

.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link.show,
.sticky-top.navbar-dark .navbar-nav .nav-link {

color: var(--dark);
}

.navbar-dark .navbar-brand h1 {
color: var(--primary);
}
}
@media (max-width: 1547px) {

.navbar-dark .navbar-nav .nav-link
{

margin-left: 20px;
}



}

@media (max-width: 1512) {

.navbar-dark .navbar-nav .nav-link
{

margin-left: 15px;
}



}

@media (max-width: 1163px) {
.navbar-dark .navbar-nav .nav-link {
font-size: 1em
}
}
@media (max-width: 1020px) {
.navbar-dark .navbar-nav .nav-link {
font-size: 1em
}

}

@media (min-width:992px) and (max-width:1020px) {

body{
margin: 0rem -1rem;
} 
}
@media (max-width: 991px) {
.navbar-dark .navbar-nav .nav-link {
font-size: 16px;
font-weight: 600;

padding-right: 24px;
}
}

@media (min-width: 992px) {
.navbar-dark {
position: relative;
width: 100%;
top: 0;
left: 0;
border-bottom: 1px solid rgba(256, 256, 256, .1);
z-index: 999;
background-color: white;
height: 72px;
}




nav-item nav-link nav-item:hover {
background-color: #F3F4F6;
color: #161616;
border-radius: 4px;
}


.navbar-dark .navbar-nav .nav-link::before {
position: absolute;
content: "";
width: 0;
height: 6px;
bottom: 12px;
left: 50%;
background: var(--primary);

border-radius: 8px;
}


.navbar-dark .navbar-nav .nav-link.active::before {
width: 80%;
left: 11px;
bottom: 0;
height: 6px;
width: calc(100% - 24px);
display: block;
position: absolute;
bottom: 0px;
background-color: #34ad54;
border-radius: 4px;
z-index: 9;


}
.navbar-dark .navbar-nav .nav-link:hover::before  {

width: 80%;
left: 11px;
bottom: 0;
height: 6px;
width: calc(100% - 24px);
display: block;
position: absolute;
bottom: 0px;
background-color: #9DA4AE;
border-radius: 4px;
z-index: 9;

}


.navbar-dark .navbar-nav .nav-link.nav-contact::before {
display: none;
}

.sticky-top.navbar-dark .navbar-brand h1 {
color: var(--primary);
}
}

@media (max-width: 576px) {
.carousel-caption h5 {
font-size: 14px;
font-weight: 500 !important;
}

.carousel-caption h1 {
font-size: 30px;
font-weight: 600 !important;
}
}


@media (min-width: 991.98px) {
.facts {
position: relative;
margin-top: -75px;
z-index: 1;
}
}

@media (min-width: 767.98px) {
.footer-about {
margin-bottom: -75px;
}
}



@media (max-width: 1376px) {
.logo {
width: 180px;
}
}

@media (max-width: 1321px) {
.logo {
width: 160px;
}
}


@media (max-width: 1300px) {
.hide_text {
display: none}
}

@media (min-width: 1176px) {

.nav-item .nav-link{
padding: 10px 10px;
}
}
@media (min-width: 1176px) {
.navbar-expand-lg {
flex-wrap:nowrap;
justify-content: flex-start
}

.navbar-expand-lg .navbar-nav {
flex-direction: row
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
position: absolute;
border-radius: 8px;
}

.navbar-expand-lg .navbar-nav .nav-link {
padding-right: .5rem ;
padding-left: .5rem ;
}

.navbar-expand-lg .navbar-nav-scroll {
overflow: visible
}

.navbar-expand-lg .navbar-collapse {
display: flex !important;
flex-basis: auto;
}

.navbar-expand-lg .navbar-toggler {
display: none
}


.navbar-expand-lg .navbar-collapse {
display: flex !important;
flex-basis: auto !important;
}

.navbar-expand-lg {
flex-wrap: nowrap;
justify-content: flex-start;
}



.py-lg-0 {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
}

@media (min-width: 1200px) {
.navbar-expand-lg .navbar-collapse {
display: flex !important
;
flex-basis: auto;
}
}


.dropdown-toggle::after {


vertical-align: .255em;
border-top: .3em solid;
border-right: .3em solid transparent;
border-bottom: 0;
border-left: .3em solid transparent;
color: #ff000000;
}




.breadcrumb-item+.breadcrumb-item::before {
float: left;
padding-right: .5rem;
color: #6c757d;
content: var(--bs-breadcrumb-divider, " ") /* rtl: var(--bs-breadcrumb-divider, "/") */;
}



.header-title {


color: #1F2A37;

}

.header-description {


width: 55%;

}



.content-container {
width: auto;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-start;
gap: 24px;

}

.button-text {
position: relative;
line-height: 24px;
font-weight: 500;
}

.button-wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}

.action-button {
border-radius: 4px;
background-color: #fff;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #161616;
border: 0px solid;
}


/* New CSS to position the button on the right */
.button-container {
display: flex;
width: 100%; /* Takes full width of its container */
}




.BG_G{

background-color: #F3FCF6;

}

.left-button {
    align-self: stretch;
    /* display: flex
; */
    /* flex-direction: row; */
    /* align-items: center; */
    justify-content: flex-end;
    flex-shrink: 0;
    display: flex
;
    
}


.button_ann{ 
width: 62px;
border-radius: 4px;
background-color: #f3f4f6;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;


}

.ann-button{
align-self: stretch;
/*display: flex;*/
flex-direction: row;
align-items: center;
justify-content: flex-end;
}


@media (min-width: 1200px) {
.box-stat-5 {
flex: 0 0 auto;
width: 20%;
}
}





.dropdown-toggle::after {
display: inline-block;
margin-left: 0em;
vertical-align: .255em;
content: none;
border-top: .3em solid;
border-right: .3em solid transparent;
border-bottom: 0;
border-left: .3em solid transparent;
}



.site-map {
width: 100%;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 16px;
font-family: 'Myfont';
color: #1b8354;
}
.main-link, .sub-link, .sub-sub-link, .sub-sub-sub-link {
display: flex;
align-items: center;
gap: 8px;

}
.main-link {
align-self: stretch;

}
.sub-link {
align-self: stretch;
padding-right: 16px;

}
.sub-sub-link {
align-self: stretch;
padding-right: 32px;

}
.sub-sub-sub-link {
padding-right: 48px;

}
.bullet {
font-size: 16px;
}

.img-fluid {
max-width: 100%;
height: 250px;
object-fit: cover;
}




@media (max-width: 992px){

.header-description {


width:100%;

}

}













.nav-link {
    text-decoration: none;
}

.link-text{
    text-decoration: none;
}
.link-text2{
    text-decoration: none;
}
.breadcrumb {
    text-decoration: none;
}
.dropdown-item{
        text-decoration: none;

}
.table-container {
overflow-x: auto;
border-radius: 8px;
border: 1px solid #d2d6db;
background-color: white;
max-width: 100%;
margin-top: 10px;
}

table {
width: 100%;
border-collapse: collapse;
text-align: right;
}

table {
border-collapse: collapse;
border-radius: 16px;
overflow: hidden;
border: 0px solid black;
}

thead {
background-color: #f3f4f6;
}

 
th {
font-size: 14px;
font-weight: 500;
color: #384250;

}

td {
font-size: 14px;
color: #1f2a37;
font-size: 12px;
line-height: 18px;
font-weight: 500;
font-family: 'IBM Plex Sans Arabic';
 
text-align: right;
/*width: 7rem;*/
    
 
  	font-size: 1rem;
  	line-height: 1.5rem;
  	font-family: 'IBM Plex Sans Arabic';
  	color: #161616;
 font-size: 1rem;
line-height: 1.5rem;
 

}

tr:hover{
    background-color: #D2D6DB;
}

.tag {
display: inline-block;
padding: 5px 10px;
border-radius: 4px;
background-color: #f9fafb;
border: 1px solid #e5e7eb;
font-size: 12px;
}

th {
border: 0px solid black;
padding: 20px;
background-color: #f8f9fa;
border-bottom: 1px solid #d2d6db;
font-size: .75rem;
line-height: 18px;
font-weight: 500;
font-family: 'IBM Plex Sans Arabic';
color: #384250;
text-align: right;
    font-size: 0.75rem;
line-height: 1.125rem;
font-weight: 500;

}
.lineoftable{
border: 0px solid black;
padding: 10px;
background-color: #f8f9fa;
border-bottom: 1px solid #d2d6db;
border-left: 1px solid #d2d6db;
    color: #384250;
    font-weight: bold;
font-size: 0.75rem;
line-height: 1.125rem;
font-weight: 500;
font-family: 'IBM Plex Sans Arabic';
color: #384250;
}

a{
font-size: 1rem;
color: #1B8354;
text-decoration: underline;

}

a:hover{
color:#54C08A;
}

a:focus{

border: 2px solid #161616;
box-sizing: border-box;
width: auto;
flex-direction: row;
align-items: center;
justify-content: flex-end;
gap: 0.5rem;
text-align: right;
font-size: 1rem;
color: #1b8354;
font-family: 'IBM Plex Sans Arabic';
}

.form-control {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6B6A75;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    appearance: none;
    border-radius: 4px;
    transition: border-color 0.15sease-in-out, box-shadow 0.15sease-in-out;
 
    border: 1px solid #9da4ae;
}
#searchInput:focus {
    outline: none;
    border-bottom: 2px solid black !important;
    box-shadow: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);
    
}

 


.form-control:focus {
    color:#161616;;
    background-color: #fff;
    border-color: #9DA4AE;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(6, 163, 218, 0.25);
 

}
/*
#searchInput:hover {
        border: 1px solid black !important;

}
*/
button {
    border: none;
    border-radius: 4px;
    height: 40px;
    display: flex
;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-start;
    padding: 0 16px;
    gap: 8px;
    min-height: 40px;
    max-height: 40px;
    cursor: pointer;
    font-family: inherit;
    font-size: 16px;
    text-align: right;
    transition: background-color 0.3sease;
}

.btn-secondary {
background-color: #f3f4f6;
color: #161616;
}
button.btn-secondary {
background-color: #f3f4f6;
color: #000;
justify-content: center;
}
button.btn-secondary:hover {
background-color: #E5E7EB;
}
button.btn-secondary:active {
background-color: #E5E7EB;
}
button.btn-secondary.selected {
background-color: #E5E7EB;
}





.btn-check:focus+.btn-primary, .btn-primary:focus {
color: #000;
background-color: #4D5761;
border-color: #4D5761;
}


.btn-primary,
.btn-secondary {
color: #FFFFFF;
box-shadow: inset 0 0 0 50px transparent;
justify-content: center;
}

.btn-primary:hover {
box-shadow: inset 0 0 0 0 var(--primary);
}

.btn-primary {
background-color: #0D121C;
border-radius: 4px !important;
color: #fff;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
border: 0;
padding: 0px 16px;
height: 40px;
min-height: 40px;
max-height: 40px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
text-align: left;
font-weight: 500;
line-height: 24px;
}

button.btn-primary {
background-color: #1b8354;
color: #fff;
}
button.btn-primary:hover {
background-color: #166a45;
}
button.btn-primary:active {
background-color: #104631;
}
button.btn-primary.selected {
background-color: #14573A;
}

.group-btn {
    display: flex
;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    text-align: right;
    font-size: 16px;
    color: #161616;
}


.secondary-button {
position: relative;
border-radius: 4px;
background-color: #0D121C;
width: auto;
height: 40px;
overflow: hidden;
flex-shrink: 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
min-height: 40px;
max-height: 40px;
text-align: left;
font-size: 16px;
color: #fff;
font-family: 'Myfont';
border:0px;
line-height: 24px;
font-weight: 500;
}


.actions-section {
    display: flex
;
 
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    text-align: right;
    font-size: 16px;
    color: #161616;
}

.tag_neutral {
    position: relative;
    border-radius: 9999px;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
    width: auto;
    height: 24px;
    display: flex
;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0px 12px;
    text-align: center;
    color: #1f2a37;
    width: fit-content;
}

 .text {
    line-height: 24px;
    margin-bottom: 0rem;
}

.breadcrumb {
 
justify-content: flex-start;

}



    .arrow-up-01-round-icon {
      width: 1rem;
      height: 1rem;
      position: relative;
      transition: transform 0.3s ease;
    }

    .accordion-title {
      flex: 1;
      position: relative;
      line-height: 1.5rem;
      font-weight: 600;
    }

    .accordion-header {
      align-self: stretch;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-end;
      padding: 1rem;
      gap: 1rem;
      cursor: pointer;
    }

    .content {
      flex: 1;
      position: relative;
      line-height: 1.5rem;
    }

    .accordion-content {
      align-self: stretch;
      display: none;
      flex-direction: row;
      align-items: flex-start;
 
      padding: 0.5rem 1rem 1.5rem 3rem;
      color: #384250;
    }

    .accordion.active .accordion-content {
      display: flex;
    }

    .accordion.active .arrow-up-01-round-icon {
      transform: rotate(180deg);
    }

    .rtltrue-sizelarge-icon-ali {
      width: 100%;
      position: relative;
      border-top: 1px solid #d2d6db;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      justify-content: flex-start;
      text-align: right;
      font-size: 1rem;
      color: #161616;
      font-family: 'IBM Plex Sans Arabic';
        padding: 0;
    }


.accordion-header:hover{
    background-color: #f3f4f6;
}


.accordion-header:focus{
    border-top: 2px solid #1B8354;

}

.Line_feedback {
    border-top: 2px solid #1B8354;
 
 
 
}

.feedback {
 
      	flex: 1;
   	display: flex;
 
 
}

.Q_feedback{
      	flex: 1;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-start;
  	gap: 1.5rem;
      	max-width: 80rem;
 
}

.r_feedback
{
      	flex: 1;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: flex-end;
  	gap: 1.5rem;
    
}

.par_margin{ margin-top: 15px;
    margin-bottom: 1rem;}
 




 

.radio-option {
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #000;
  cursor: pointer;
  gap: 10px;
  position: relative;
    line-height: 1.5rem;
    margin: 12px 0px;
    
    
}

.radio-option input[type="checkbox"] {
  display: none;
}

.custom-radio {
  width: 20px;
  height: 20px;
  border: 2px solid #1a7f64;
  border-radius: 50%;
  background-color: transparent;
  display: inline-block;
  position: relative;
}

.radio-option input[type="checkbox"]:checked + .custom-radio::after {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #1a7f64;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


.Inputbox:focus {
    outline: none;
    border-bottom: 2px solid black !important;
    box-shadow: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);
    
}




.paginationitem2.active div, .paginationitem4.active div {
     color: black;
 }


.active_pagination::after {
    
 
content: "";
    position: absolute;
    width: 100%;
    height: 3px;
    right: 0;
    bottom: 0;
    border-bottom: 3px solid;
    border-color: #1b8354;}
 
 
.paginationitem2:hover{    background-color: #F3F4F6;
    color: #161616;
    border-radius: 4px;}
 

.paginationitem2.active div, .paginationitem4.active div {
     font-weight: bold;
}
.paginationitem2, .paginationitem4 {
  /* padding: 5px 10px; */
    cursor: pointer;
    display: inline-block;
}
.button_paggination {
 margin-top: 8px;
    cursor: pointer;
    display: inline-block;
}
.pagesWrapper {
    display: inline-flex !important;
}



    canvas {
      background-color: white;
      border-radius: 15px;
      padding: 16px;
  width: 100%;
        border: 1px solid #d2d6db;
   
  
    }


  











.tag_success {
position: relative;
border-radius: 4px;
background-color: #ecfdf3;
border: 1px solid #abefc6;
box-sizing: border-box;
width: auto;
 
display: flex;
flex-direction: row;
justify-content: center;
padding: 0px 12px;
text-align: center;
 color: #085d3a;
border-radius: 9999px;
    padding: 0px 12px;
     
 }


.tag_neutral {
    position: relative;
    border-radius: 9999px;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    box-sizing: border-box;
    width: auto;
 
    display: flex
;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0px 12px;
    text-align: center;
    color: #1f2a37;
}

 th, td {
padding: 12px;
border-bottom: 1px solid #d2d6db;
 min-width: 120px; 
text-align: center;

}

 

.ShortCut_link-carousel {
  position: relative; /* عشان الـ dots يقدر يتموضع داخله */
}








--------------------------------------




.adv-carousel .owl-dots {
    margin-top: 16px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.News-carousel .owl-dots {
    margin-top: 16px;
    display: flex
;
    align-items: flex-end;
    justify-content: center;
}
@media (min-width: 1px) {
  


    .bg-footer-foundation {
        width: 100%;
        background: url(/img/hero/footer-backeground.svg) left / cover no-repeat;
        background-size: contain;
        background-position: left 90px;
        background-color: #231F20 !important;
    }

    .BG_G {
        width: 100%;
        min-height: 400px;
        background: url("/img/hero/services-section.svg") center / cover no-repeat;
    }
}
@media (min-width: 992px) {
    .navbar-dark {
        position: relative;
        width: 100%;
        top: 0;
        left: 0;
        border-bottom: 1px solid rgba(256, 256, 256, .1);
        z-index: 999;
        background-color: white;
        height: 72px;
    }

    .Discover_AllProjects-carousel .owl-dots {
        margin-top: 16px;
        display: flex;
        align-items: flex-end;
        justify-content: center;
    }

    .ShortCut_link-carousel .owl-dots {
        position: absolute;
        top: 85%;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 0;
    }



    --------------------------------------


    .carousel-caption {
        /* top: 0; تعديل يوم التأسيس*/
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        /*
background: linear-gradient(-183deg, #181010 18.07%, rgba(24, 16, 16, .77) 61.28%, rgba(24, 16, 16, 0) 110.35%);    flex-shrink: 0;
        */
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding: 40px 80px;
        box-sizing: border-box;
        text-align: right;
        font-size: 60px;
        color: #e9dfcf;
        font-family: 'Myfont';
        background: url("/img/hero/22.svg") center / cover no-repeat;
        width: 100%;
    }



    active-arrowDown {
        filter: invert(100%) brightness(200%);
    }
}