@charset "utf-8";
:root {
  --blue: #336633;
  --white: #ffffff;
  --gray: #323333;
  --light-blue: #121e8a;
  --red: #121e8a;
  --prograph: #646565;
  --light_gray: #e3ebef;
}
@font-face {
  font-family: "Neo Sans Arabic";
  src: url("fonts/NeoSansArabic.woff2") format("woff2"),
    url("fonts/NeoSansArabic.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

::selection {
  background-color: var(--blue);
  color: white;
}
body {
  background-color: var(--white);
  font-family: Neo Sans Arabic;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #ffffff;
  z-index: 20;
}


.row-eq-height {

  display: -webkit-box;

  display: -webkit-flex;

  display: -ms-flexbox;

  display:         flex;

}


/*-------------- header style -----------*/
.bg_blue {
  background-color: var(--blue);
}
.div_radus {
  border-radius: 50px;
}
.div_radus {
  color: var(--gray);
}

a .div_radus:hover {
  background-color: var(--blue) !important;
  color: var(--white) !important;
  border: 1px solid var(--white) !important;
}


/* الصحن البيضاوي الثابت */
.icon_circal {
  width: 60px;      /* عرض البيضاوي */
  height: 30px;     /* ارتفاع البيضاوي */
  border: 1px solid #fff;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px;
  background: transparent;
  color: white;
  text-decoration: none;

  /* إمالة الصحن ليبدو وكأنه مستوٍ أفقياً */
  transform: rotateX(70deg);
  transform-origin: center center;
  /* الصحن ثابت: لا يوجد animation هنا */
}

/* العنصر الذي يدور أفقياً حول المحور Y */
.icon_coin {
  display: inline-block;
  transform-style: preserve-3d;

  /* دوران مستمر في 8 ثوانٍ */
  animation: coinSpin 8s linear infinite;

  /* الأيقونة أكبر من الصحن */
  font-size: 40px;

  /* عكس إمالة الصحن حتى تبقى الأيقونة عمودية */
  transform: rotateX(-70deg);
}

/* الحركة: تدور 0° إلى 360° حول المحور Y */
@keyframes coinSpin {
  0%   { transform: rotateY(0deg); }
  100% { transform: rotateY(360deg); }
}

/* السماح برؤية ظهر الأيقونة (معكوسة) عند 180° */
.icon_coin i {
  backface-visibility: visible;
}

/* تغييرات الألوان عند مرور الماوس (اختياري) */
.icon_circal.w:hover .icon_coin { color: #25d366; }  /* واتساب */
.icon_circal.in:hover .icon_coin { color: #e1306c; } /* إنستغرام */
.icon_circal.y:hover .icon_coin { color: #ff0000; }  /* يوتيوب */
.icon_circal.t:hover .icon_coin { color: #1da1f2; }  /* تويتر */
.icon_circal.f:hover .icon_coin { color: #3b5998; }  /* فيسبوك */



/* حاوية تجمع الأيقونة والنص، مع ترتيب عكسي (RTL) */
.app-container {
  display: inline-flex;
  align-items: center;
  flex-direction: row-reverse; /* هذا يجعل النص يظهر على اليمين في صفحات RTL */
}

/* الدائرة الثابتة (الصحن) */
.app_icon_circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;         /* يمكنك تعديل الحجم حسب رغبتك */
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2); /* خلفية خفيفة تشبه باقي الأيقونات */
  margin-left: 5px;    /* مسافة بسيطة بين الدائرة والنص */
  position: relative;
  overflow: hidden;    /* لضمان عدم خروج الصورة عن حدود الدائرة */
}

/* الصورة داخل الدائرة */
.app_img {
  width: 35px;         /* حجم الصورة داخل الدائرة (يمكنك ضبطها لتكون أكبر قليلاً إذا أردت) */
  height: 35px;
  border-radius: 50%;  /* لتظهر الصورة بشكل دائري */
  object-fit: cover;   /* لضمان ملء الصورة للدائرة دون تشويه */
  animation: spinImg 6s linear infinite; /* تدور الصورة بشكل ناعم */
}

/* حركة الدوران للصورة */
@keyframes spinImg {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* النص بجانب الأيقونة */
.app_label {
  color: #fff;        /* لون النص كما باقي الأيقونات */
  font-size: 14px;    /* حجم الخط المناسب */
  margin-right: 8px;  /* مسافة بين النص والدائرة */
}


.md_fontsize {
  font-size: 16px;
}
nav div ul li a {
  color: var(--gray) !important;
}
nav div ul li.active a,
nav div ul li.current a,
nav div ul li.section a,
nav div ul li:hover a,
nav div ul li:active a,
nav div ul li:focus a {
  color: var(--blue) !important;
}



..donate{
  margin-right: auto;
  margin-left: 10px;
  margin-top: -5px;}
.navbar .nav-item .dropdown-menu {
  display: none;
  float: left !important;
  padding-bottom: 30px;
  border-radius: 0 0 20px 20px;
  margin-top: -10px;
  background-color: var(--blue);
}
.navbar .nav-item:hover .dropdown-menu,
.navbar .nav-item:focus .dropdown-menu {
  display: block;
}
.navbar .nav-item:hover .dropdown-menu .dropdown-item {
  color: #bbe5f9 !important;
}
.navbar .nav-item:hover .dropdown-menu .dropdown-item:hover {
  color: #fff !important;
  background-color: var(--blue);
}
/*----------- Top slider style ------------------ */
.gray_img{ filter: grayscale();}
.bg_gradient_blue{ 
  position: absolute;
  top:0;
  height: 800px;
  width: 100%;
  opacity: 1;
  background: linear-gradient(360deg, rgb(0, 114, 54) , #bbe5f909 100%);
}
.top_slide .carousel-caption {
  top: 190px;
  right: 160px;
  width: 800px;
  text-align: right;
}
.top_slide .carousel-caption h1 {
  font-size: 70px;
}
.see_more {
  background-color: var(--red);
  border-radius: 50px;
  right: -50px;
  font-size: 14px !important;
}
.carousel-control-prev,
.carousel-control-next {
  top: 450px;
  background-color: var(--light-blue);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  text-decoration: none;
  position: absolute;
}
.carousel-control-prev {
  
  left: 16%;
}
.carousel-control-next {
  right: 78.5%;
}

.owl-next,
.owl-prev {
  position: absolute;
  top: 7px !important;
  background-color: var(--light-blue) !important;
  color: var(--white) !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  text-decoration: none !important;
  opacity: 0.7;
}
.owl-next:hover,
.owl-prev:hover {
  opacity: 1;
}
.owl-prev {
right: -50px !important;
}
.owl-next {
  left: -50px !important;
}


/*----------- About us  style ------------------ */

.about_us_bg {
  background: url("../images/about_us_bg.png") no-repeat;
  background-size: 100% 100%;
}
.title h5 {
  color: var(--blue);
  font-size: 1.8rem;
}
.navbar_fs{
  font-size: 17.9px;
}
.prograph {
  color: var(--prograph);
  font-size: 17px;
  line-height: 1.6;
  padding-right: 10px;
}
.fsize{
  font-size:16.5px !important;
}
.accordion .card .card-header h2 button.btn-nav-accordion{
  font-size:17px !important;
}
.btn-link{
  font-size: 13px !important;
  text-decoration: none;
}
.btn-link,
.btn-link:hover {
  text-decoration: none;
}
.btn:focus {
  outline: none;
  box-shadow: none;
}
.btn-nav-accordion[aria-expanded="true"] .fa-chevron-right {
  transform: rotate(90deg);
}
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: 0.5s ease;
}
.item:hover .overlay {
  opacity: 0.8;
}
.link-icon {
  background-color: var(--red);
  width: 60px;
  height: 60px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.link-icon i {
  color: var(--white);
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.close {
  color: #fff;
  position: absolute;
  right: -10px;
  top: -14px;
}
.skroller{
  max-height: 120px;
  overflow-y: auto;
}
/*----------- Last news  style ------------------ */
.light_gray_bg {
  background-color: var(--light_gray);
}
.slide_description a {
  text-decoration: none;
}
.slide_description a:hover {
  color: var(--blue) !important;
}

.slide_description .details {
  padding-right: 3px;
  font-size: 12px;
}
.slide_description .details i {
  color: var(--blue);
}
.pr_n1 {
  padding-right: 3px;
  font-size: 16.5px;
}
/* Hide the images by default */
.mySlides {
  display: none;
}
/* Position the image container (needed to position the left and right arrows) */
.container {
  position: relative;
}
/* Add a pointer when hovering over the thumbnail images */
.cursor {
  cursor: pointer;
}
/* Add a transparency effect for thumnbail images */
.demo {
  opacity: 0.6;
}

.active,.current,.section,
.demo:hover {
  opacity: 1;
}
.Gallery_slide .carousel-control-prev,
.Gallery_slide .carousel-control-next {
  top: 100%;
}
.Gallery_slide .carousel-control-prev {
  left: 49.5%;
}
.Gallery_slide .carousel-control-next {
  right: 49.5%;
}
.date_share {
  position: absolute;
  width: 60px;
  height: 100%;
  background-color: var(--white);
}
.date_share .icon_circal {
  border-color: var(--gray);
}
.date_share .icon_circal:hover {
  color: var(--white) !important;
}
.date_share .icon_circal.y {
  font-size: 14px !important;
  padding: 3px;
}
.btn_radus {
  width: 120px;
  font-size: 12px;
  border-radius: 50px;
  margin-left: -10px;
}
/*----------- Our projects style ------------------ */
.project_main {
  position: relative;
  margin-top: -220px;
}
.card-img-top {
  width: 85% !important;
  height: 150px !important;
  margin: 20px auto 0px auto;
}
.card.projects {
  border-radius: 0 20px;
}
.card-title {
  font-size: 17px;
}
.card-body .light_gray_bg {
  border-radius: 0 10px;
  padding: 10px;
}
.card-body .light_gray_bg span {
  font-size: 14px;
  padding-right: 0px;
}
.card-body .light_gray_bg .detaies {
  margin-top: -20px;
}
.card-body .light_gray_bg .detaies i {
  font-size: 20px;
}
.projects .carousel-control-prev,
.projects .carousel-control-next {
  top: 100%;
}
.projects .carousel-control-prev {
  left: 46.8%;
}
.projects .carousel-control-next {
  right: 46.8%;
}
a.projects:hover img {opacity: 0.8;}
a.projects_title{ text-decoration:none;
color: var(--gray);}
a.projects_title:hover{ text-decoration:none;
  color: var(--red);
}

/*----------- Media center style ------------------ */
.parallax {
  /* The image used */
  background-image: url("../images/media_center_bg.png");

  /* Set a specific height */
  min-height: 650px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.media_main {
  margin-top: -630px;
}
.card_padding_n .card-body {
  margin-top: -40px !important;
  border-radius: 50px;
}
.card_padding_n {
  border-radius: 18px;
}
.icon_bg {
  border-radius: 50% !important;
  padding-top: 10px;
  text-align: center;
  width: 60px;
  height: 60px;
  background-color: white;
  color: #aaa8a8;
  font-size: 27px;
}
.mt_n {
  margin-top: -7px;
  margin-bottom: 20px;
}
.img_overlay .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 91.5%;
  opacity: 0;
  transition: 0.3s ease;
  background-color: var(--red);
}

.img_overlay:hover .overlay {
  opacity: 0.8;
}

.img_overlay .icon {
  color: white;
  border: 1px solid white;
  padding: 19% 40%;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}
.img_overlay h6 {
  color: white;
  font-size: 12px;
  margin-top: -30px;
  margin-bottom: 17px;
  text-align: center !important;
}
.vidio_desc {
  background-color: #e3ebef !important;
}
.vidio_desc h6 {
  font-size: 9px;
  padding: 10px 5px;
  color: var(--light_gray_bg);
}

.mySlides_media_center {
  display: none;
}
/* Position the image container (needed to position the left and right arrows) */
.container {
  position: relative;
}
/* Add a pointer when hovering over the thumbnail images */
.cursor1 {
  cursor: pointer;
}
/* Add a transparency effect for thumnbail images */
.demo1 {
  opacity: 0.6;
}

.active,.current,.section,
.demo1:hover {
  opacity: 1;
}
.Gallery_slide_media .carousel-control-prev,
.Gallery_slide_media .carousel-control-next {
  top: 75%;
}
.Gallery_slide_media .carousel-control-prev {
  left: 48%;
}
.Gallery_slide_media .carousel-control-next {
  right: 48%;
}
.vidio.overlay {
  height: 0%;
  top: 50%;
}
.vidio_icon {
  top: -70px;
  border-radius: 7px !important;
  width: 40px;
  height: 25px;
}
.vidio_icon i {
  font-size: 10px !important;
}

.custom_mt {
  margin-top: 115px !important;
}
.report_text h6 {
  font-size: 12px !important;
}

.download {
  font-size: 12px;
  padding: 9px 5px;
  color: var(--white);
  background-color: var(--blue);
}
a:hover .download {
  color: var(--blue);
  border: 1px solid var(--blue);
  background-color: var(--white);
}
.custom_report_mt {
  margin-top: 28px;
}
/*----------- Our partners style ------------------ */
.prev_down_slide,
.next_down_slide {
  top: 70% !important;
}
.prev_down_slide {
  left: 2%;
}
.next_down_slide {
  right: 2%;
}

 /* -------------------------------------------
    --         About us page style         --
    -------------------------------------------*/

.Breadcrumb_content {
  margin-top: -110px;
  margin-bottom: 18px;
}
.Breadcrumb_content h6{
  font-size: 14px;
}
.Breadcrumb_content h6 a:hover span{
color: var(--red)!important;
}
.Breadcrumb_content h6 span i{
  font-size: 10px;
}
.icon_border{
  border: 2px solid var(--light_gray) !important;
  border-radius:50%;
  width: 170px;
  height: 170px;
}
.fildes_link{
  text-decoration: none;
  color: var(--gray);
}
.fildes_link:hover{
  text-decoration: underline;
  color: var(--gray);
}
.fildes_link:hover .icon_border{
  background-color: var(--blue);
}

 /* -------------------------------------------
    --         Contact us page style         --
    -------------------------------------------*/
/* enable absolute positioning */
.inner-addon { 
  position: relative; 
}
.inner-addon input{ 
font-size: 14px;
text-align: right;}

.inner-addon .tags{ 
  font-size: 14px;}
/* style icon */
.inner-addon .icon_input {
   position: absolute;
  padding: 10px ;
  pointer-events: none;
  color: var(--blue);
}

/* align icon */
.left-addon .icon_input  { left:  0px;}
.right-addon .icon_input { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  40px; }
.right-addon input { padding-right: 40px; }
.btn_form_radus{ border-radius: 40px;}

 /* -------------------------------------------
    --         News page style         --
    -------------------------------------------*/
.bg_news_desc{ background-color:#e0f2fa;}
.bg_news_desc p{ font-size:12.5px;}

 /* -------------------------------------------
    --         News Details page style         --
    -------------------------------------------*/
  .share_border{ border: 1px solid var(--light_gray);
    border-radius:50%;
    padding: 5px 10px;
    }
    .share_link:hover .share_border{ background-color: var(--blue);}
    .share_link:hover .share_border i{ color: var(--white);}
    .grad_blue_white_bg{
      height: auto;
      background-image: linear-gradient(#007236, white);
    }
 /* -------------------------------------------
    --         search page style         --
    -------------------------------------------*/
  
    .custom_search_btn{
      background-color: var(--blue);
      color: var(--white);
    }
    .form_radius input{
      border-top-right-radius:5px !important;
      border-bottom-right-radius:5px !important;
    }
    .form_radius button{
      border-top-left-radius:5px !important;
      border-bottom-left-radius:5px !important;
    }
/* -------------------------------------------
    --         project details page style         --
    -------------------------------------------*/
  
    .bg_light_blue{ background-color:#e0f2fa ;
    margin-bottom: 10px;
    }
/* -------------------------------------------
    --         vidio galary page style         --
    -------------------------------------------*/
  
    .vidio_icon_galary{ top: -30px;}
/* Responsive Web Design - Media Queries */


.object .card {
  border-radius: 20px;
}
.max_height{
  max-height: 150px;
  overflow-y: auto;
}
.object .card .contact_icon {
  position: absolute;
  background-color: var(--white);
  top: -25px;
  font-size: 30px;
  margin-right: 39%;
  border: 1px solid rgb(209, 207, 207);
  border-radius: 50%;
  width: 50px;
}
/* Extra small devices (phones, 600px and down) */
@media (max-width: 575.98px) {

  .owl-next,
  .owl-prev {
    position: absolute;
    top: 80px !important;
  }
  .owl-prev {
  right: 38% !important;
  }
  .owl-next {
    left: 38% !important;
  }
  /*-------------- header style -----------*/
  .Logo {
    width: 100px;
    height: 50px;
  }
  .search_icon {
    display: none !important;
  }
  .navbar .nav-item .dropdown-menu {
    display: block;
    width: 100%;
    text-align: left;
    padding-bottom: 10px;
    border-radius: 0 0 0 0;
    margin-top: 0px;
  }
  .navbar .nav-item .dropdown-menu .dropdown-item {
    color: #bbe5f9 !important;
  }
  .navbar .nav-item .dropdown-menu .dropdown-item:focus {
    color: #fff !important;
    background-color: var(--blue);
  }
  /*----------- Top slider style ------------------ */
  .bg_gradient_blue{ 
    height: 300px;
    }
  .top_slide .carousel-caption {
    top: 1px;
    right: 50px !important;
    width: 200px;
  }
  .top_slide .carousel-caption h1 {
    font-size: 30px;
  }
  .see_more {
    font-size: 8px !important;
    padding: 3px 5px !important;
  }
  .carousel-control-prev,
  .carousel-control-next {
    top: 98px;
    width: 30px;
    height: 30px;
  }
  .carousel-control-prev {
    left: 16%;
  }
  .carousel-control-next {
    right: 81.5%;
  }
  /*----------- About us  style ------------------ */
  .title h3 {
    font-size: 17px;
  }
  .prograph.fsize {
    font-size: 12px;
  }
  .card-header button:focus {
    outline: 0 !important;
  }
  .btn-link {
    font-size: 13px !important;
  }
  .mt_top_V {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  /*----------- Our projects style ------------------ */
  .projects .carousel-control-prev {
    left: 42%;
  }
  .projects .carousel-control-next {
    right: 42%;
  }
  /*----------- Our partners style ------------------ */
  .prev_down_slide,
  .next_down_slide {
    top: 110% !important;
  }
  .prev_down_slide {
    left: 42%;
  }
  .next_down_slide {
    right: 42%;
  }

  /*----------- Last news  style ------------------ */
  .slide_description .details {
    padding-right: 3px;
    font-size: 9px;
  }
  .slide_description a h5 {
    font-size: 12px;
  }
  .slide_description h6 {
    font-size: 10px;
  }
  .pr_n1 {
    padding-right: 3px;
    font-size: 11px;
    text-align: justify;
  }

  .Gallery_slide .carousel-control-prev,
  .Gallery_slide .carousel-control-next {
    top: 100%;
  }
  .Gallery_slide .carousel-control-prev {
    left: 86.5%;
  }
  .Gallery_slide .carousel-control-next {
    right: 11%;
  }
  .date_share {
    width: 40px;
    font-size: 10.5px;
  }
  .date_share .icon_circal.y {
    font-size: 10.5px !important;
  }
  /*----------- Media center style ------------------ */
  .parallax {
    /* The image used */ /* The image used */
    background-image: url("../images/media_center_bg.png");

    /* Set a specific height */
    min-height: 1620px;
  }
  .media_main {
    margin-top: -1600px;
  }
  .img_overlay h6 {
    font-size: 10px;
    margin-top: -30px;
  }
  .mt_v_n {
    margin-top: -7px;
    margin-left: 6px;
    margin-right: 5px;
  }
  .custom_mt {
    margin-top: 85px;
  }
     /* -------------------------------------------
    --         About us page style         --
    -------------------------------------------*/
.Breadcrumb img{
  height:80px;
}
.Breadcrumb_content h3{
  font-size: 22px;
}
.Breadcrumb_content h6{
  font-size: 12px;
}
.Breadcrumb_content {
  margin-top: -65px;
  margin-bottom: 10px;
}
.icon_border{
  width: 120px;
  height: 120px;
}
.icon_border img{
  width: 80px;
  height: 100px;
}

 /* -------------------------------------------
    --         News Details page style         --
    -------------------------------------------*/
    .img_hight_news_details img{ height:200px;}

   /* -------------------------------------------
    --         search page style         --
    -------------------------------------------*/
   
.search_result_smfont h5{  font-size: 15.5px ;}
.search_result_smfont p{  font-size: 12px ;}

.criteria_img{height: 300px !important;}
}

/* Small devices (tablets and large phones, 576px and up) */
@media (min-width: 576px) and (max-width: 991.98px) {


  /*-------------- header style -----------*/
  .Logo {
    width: 150px;
    height: 70px;
  }
  .search_icon {
    display: none !important;
  }
  .navbar .nav-item .dropdown-menu {
    width: 100%;
    text-align: left;
    border-radius: 0 0 0 0;
    margin-top: 0px;
  }
  /*----------- Top slider style ------------------ */
  .bg_gradient_blue{ 
    height: 700px;
}
  .top_slide .carousel-caption {
    top: 100px;
    right: -10px;
    width: 300px;
  }
  .top_slide .carousel-caption h1 {
    font-size: 50px;
    padding-right: 80px;
  }
  .see_more {
    font-size: 10px !important;
  }
  .carousel-control-prev,
  .carousel-control-next {
    top: 220px;
  }
  .carousel-control-prev {
    left: 10%;
  }
  .carousel-control-next {
    right: 81.5%;
  }
  /*----------- About us  style ------------------ */
  .title h3 {
    font-size: 17px;
  }
  .prograph.fsize {
    font-size: 12px;
  }
  .btn-link {
    font-size: 13px !important;
  }
  .mt_top_V{ 
    margin-top: -45px !important;
  }
  .overlay {
    top: 55px;
    height: 50%;
  }
  .link-icon {
    width: 40px;
    height: 40px;
  }
  
  .link-icon i {
    font-size: 12px;
  }
  /*----------- Last news  style ------------------ */
  .slide_description .details {
    padding-right: 3px;
    font-size: 9px;
  }
  .slide_description a h5 {
    font-size: 12px;
  }
  .slide_description h6 {
    font-size: 10px;
  }
  .pr_n1 {
    padding-right: 3px;
    font-size: 11px;
    text-align: justify;
  }

  .Gallery_slide .carousel-control-prev,
  .Gallery_slide .carousel-control-next {
    top: 100%;
  }
  .Gallery_slide .carousel-control-prev {
    left: 89%;
  }
  .Gallery_slide .carousel-control-next {
    right: 9.5%;
  }
  .date_share {
    width: 40px;
    font-size: 10.5px;
  }
  .date_share .icon_circal.y {
    font-size: 10.5px !important;
  }
  /*----------- Our projects style ------------------ */
  .projects .carousel-control-prev {
    left: 45%;
  }
  .projects .carousel-control-next {
    right: 45%;
  }

  /*----------- Media center style ------------------ */
  .parallax {
    /* The image used */ /* The image used */
    background-image: url("../images/media_center_bg.png");

    /* Set a specific height */
    min-height: 1120px;
  }
  .media_main {
    margin-top: -1100px;
  }
  .img_overlay .overlay {
    width: 93%;
  }
  .img_overlay .icon {
    padding: 13% 40%;
  }
  .mt_v_n {
    margin-top: -6px;
    margin-left: 12px;
    margin-right: 11px;
  }
  .custom_mt {
    margin-top: 85px;
  }

  /*----------- Our partners style ------------------ */
  .prev_down_slide,
  .next_down_slide {
    top: 20%;
  }
  .prev_down_slide {
    left: -6%;
  }
  .next_down_slide {
    right: -6%;
  }

   /* -------------------------------------------
    --         About us page style         --
    -------------------------------------------*/

.Breadcrumb_content {
  margin-top: -75px;
  margin-bottom: 18px;
}
.icon_border{
  width: 120px;
  height: 120px;
}
.icon_border img{
  width: 80px;
  height: 100px;
}
  /* -------------------------------------------
    --         News Details page style         --
    -------------------------------------------*/
    .img_hight_news_details img{ height:300px;}

    .criteria_img{height: 600px !important;}

}
@media (min-width: 1900px) {
  /*-------------- header style -----------*/
}

.card_hover:hover {
  opacity: 0.8;
  
}
.card_hover  a {
  text-decoration: none !important;
  
}

/* banjar*/


.video-play-button {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  /* background: #fa183d; */
  border-radius: 50%;
  padding: 18px 20px 18px 28px;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 60px;
  height: 60px;
  background: #fff;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 60px;
  height: 60px;
  background: #2903ffbe;
  border-radius: 50%;
  transition: all 200ms;
}

.video-play-button:hover:after {
  background-color: darken(#2903ffbe, 10%);
}

.video-play-button img {
  position: relative;
  z-index: 3;
  max-width: 100%;
  width: auto;
  height: auto;
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
border-left: 15px solid #fff;
border-top: 7px solid transparent;
border-bottom: 9px solid transparent;
right: 9px;
top: 14px;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}



.video-overlay {
  position: fixed;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.80);
  opacity: 0;
  transition: all ease 500ms;
}

.video-overlay.open {
  position: fixed;
  z-index: 1000;
  opacity: 1;
}

.video-overlay-close {
  position: absolute;
  z-index: 1000;
  top: 15px;
  right: 20px;
  font-size: 36px;
  line-height: 1;
  font-weight: 400;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  transition: all 200ms;
}

.video-overlay-close:hover {
  color: #2903ffbe;
}

.video-overlay iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  /* width: 90%; */
  /* height: auto; */
  box-shadow: 0 0 15px rgba(0,0,0,0.75);
}
.modal-dialog-img{
  max-width: 90% !important;
}


.center{
  display: block !important;
  margin: auto !important;
}
.left{
  float: left !important;
}
.right{
  float: right !important;
}
.image{width: 100% ; height: 100% }
.map iframe{ width: 100% !important;}
.vidio_desc_fs{
  font-size: 0.9rem;
}
.fs-17{font-size:17px !important}



.enviro{background-color: #F0F5F8; border-radius: 24px; padding: 24px;}
.enviro h2{color: #007236;}
.enviro p{color: #6A6767;}
.enviro-box{display: block; text-align: center; padding:24px; width: 100%;  text-decoration: none; color: #fff; border-radius: 24px;}
.enviro-box:hover{text-decoration: none; opacity: 0.8; color: #fff;}


.footerdiv{
	direction: rtl;
	
    padding: 0px 50px;

}

.footerdiv_row{
	display: flex;
  text-align: right;
  justify-items: right;
	flex-wrap: wrap;
}
ul{
  
	list-style: none;
}
.footerdiv-col{
  text-align: right;
  justify-items: right;
   width: 25%;
   padding: 0px 10px;
}
.footerdiv-col h4{
	
  text-align: right;
	font-size: 18px;
	color: #ffffff;
	text-transform: capitalize;
	margin-bottom: 35px;
	font-weight: 500;
	position: relative;
}
.footerdiv-col h4::before{
  text-align: right;
	content: '';
	position: absolute;
	content: 0;
	bottom: -10px;
	background-color: #2c1ee9;
	height: 2px;
	box-sizing: border-box;
	width: 50px;
}
.footerdiv-col ul li:not(:last-child){
	margin-bottom: 10px;
}
.footerdiv-col ul li a{
	font-size: 16px;
	text-transform: capitalize;
	color: #ffffff;
	text-decoration: none;
	font-weight: 300;
	color: #bbbbbb;
	display: block;
	transition: all 0.3s ease;
}
.footerdiv-col ul li a:hover{
	color: #ffffff;
	padding-left: 8px;
}
.footerdiv-col .social-links a{ 
	display: inline-block;
	height: 35px;
	width: 35px;
	background-color: rgba(255,255,255,0.2);
	margin:0 5px 5px 0;
	text-align: center;
	line-height: 35px;
	border-radius: 50%;
	color: #ffffff;
	transition: all 0.5s ease;
  
}
.footerdiv-col .social-links a:hover{
	color: #24262b;
	background-color: #210dd4;
}

/*responsive*/
@media(max-width: 767px){
  .footerdiv-col{
    width: 50%;
    margin-bottom: 30px;
}
}
@media(max-width: 574px){
  .footerdiv-col{
    width: 100%;
}
}