/**
* Template Name: 
* Updated: 
* Template URL: 
* Author: 
* License: 
*/


/*! 	Available Bootstrap breakpoints		*/
/*! Breakpoint 			|	Class infix |		Dimensions
/*!-----------------------------------------------------*/
/*! Extra small 			|	None 			|		<576px
/*! Small 					|	sm 			|	 	≥576px
/*! Medium 					|	md 			|		≥768px
/*! Large 					|	lg 			|		≥992px
/*! Extra large 			|	xl 			|		≥1200px
/*! Extra extra large	| 	xxl 			|		≥1400px 
/*!-----------------------------------------------------*/
/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
   font-family: "Georgia", sans-serif;
   color: #444444;

}

a {
   text-decoration: none;
   color: #0880e8;
}

a:hover {
   color: #2b99f8;
   text-decoration: none;
}

h1,
h2,
h3:not(#org-dgdn h3),
h4,
h5,
h6 {
   font-family: 'Georgia', "Raleway", sans-serif;
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
   /*tochange*/
   position: fixed;
   visibility: hidden;
   opacity: 0;
   /* right: 15px; */
   bottom: 15px;
   z-index: 996;
   background: hwb(0 100% 0%);
   width: 40px;
   height: 40px;
   border-radius: 50px;
   transition: all 0.4s;
}

[dir='ltr'] .back-to-top {
   right: 15px;
}

[dir='rtl'] .back-to-top {
   left: 15px;
}

.top {
   --offset: 50px;

   position: sticky;
   bottom: 20px;
   /* margin-right: 10px; */
   place-self: end;
   margin-top: calc(100vh + var(--offset));

   /* visual styling */
   text-decoration: none;
   padding: 10px;
   font-family: sans-serif;
   color: #fff;
   background: #000;
   border-radius: 100px;
   white-space: nowrap;
}

[dir='ltr'] .top {
   margin-right: 10px;
}

[dir='rtl'] .top {
   margin-left: 10px;
}

.back-to-top i {
   font-size: 28px;
   color: rgb(255, 0, 0);
   line-height: 0;
}

.back-to-top:hover {
   background: #d9e7d3;
   color: hsl(0, 11%, 85%);
}

.back-to-top.active {
   visibility: visible;
   opacity: 1;
}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 9999;
   overflow: hidden;
   background: #fff;

}

#preloader:before {
   content: "";
   position: fixed;
   top: calc(50% - 30px);
   /* left: calc(50% - 30px); */
   border: 6px solid hsl(208, 93%, 47%);
   border-top-color: #bfe0fd;
   border-radius: 50%;
   width: 60px;
   height: 60px;
   animation: animate-preloader 1s linear infinite;
}

[dir='ltr'] #preloader:before {
   left: calc(50% - 30px);
}

[dir='rtl'] #preloader:before {
   right: calc(50% - 30px);
}

@keyframes animate-preloader {
   0% {
      transform: rotate(0deg);
   }

   100% {
      transform: rotate(360deg);
   }
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
   [data-aos-delay] {
      transition-delay: 0 !important;
   }
}

/*--------------------------------------------------------------*/
.amiri {
   font-family: "Amiri", serif;
   /* font-family: "Noto Nastaliq Urdu", serif; */
   font-size: 22px;
   text-align: center;
   background: -webkit-linear-gradient(rgb(28 101 39), #1c6527a1, #fc08089f, #fc0808);
   font-weight: 900;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   /* padding-left: 725px; */

}

/*--------------------------------------------------------------*/

.cta .cta-btn:hover {
   background: #f6b024;
}

@media (max-width: 1024px) {
   .cta {
      background-attachment: scroll;
   }
}

@media (min-width: 769px) {
   .cta .cta-btn-container {
      display: flex;
      align-items: center;
      justify-content: flex-end;
   }
}


@keyframes blink {
   0% {
      opacity: 1;
   }

   50% {
      opacity: 0;
   }

   100% {
      opacity: 1;
   }
}


.blinking-a {
   animation: blink 5s infinite;
}


.container {
   /* background: rgba(3, 84, 15, 0.9); */
   /* --bs-gutter-x: rem; */
}

/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
   /* padding: 60px 0; */
   overflow: hidden;
   position: relative;
   top: 350px;
}

.section-bg {
   background-color: #eafce9;
}

.section-title {
   text-align: center;
   padding-bottom: 30px;
}

.section-title h2 {
   font-size: 32px;
   font-weight: bold;
   text-transform: uppercase;
   margin-bottom: 20px;
   padding-bottom: 0;
   color: rgba(3, 85, 30, 0.997);
   /*tochnge*/
}

.section-title p {
   margin-bottom: 0;
   font-style: italic;
}

/*--------------------------------------------------------------*/
/* ======= index  ====== */


.h-100,
.scrollspy-example-2 {
   display: block;
   /* margin: 0 auto; */
   /* text-align: center; */
}

.h-100 {
   /* width: ; */
   max-width: 400px;
   padding: 5px;
   text-align: justify;
   /* border: 1px solid black; */
}

.scrollspy-example-2 {
   /* width: auto; */
   height: 400px;
   overflow-y: scroll;
   scroll-behavior: smooth;
   text-align: justify;
}

.scroll-page {
   /* display: flex; */
   /* align-items: center; */
   /* justify-content: center; */
   height: auto;
   color: #000;
   /* margin-right: 20px; */
   /* font-size: 1%; */
}

[dir='ltr'] .scroll-page {
   margin-right: 20px;
}

[dir='rtl'] .scroll-page {
   margin-left: 20px;
}

div.scroll-page h4,
div.scroll-page h5 {
   color: rgb(255, 0, 0);
}

/* ======= fin index  ====== */
/*--------------------------------------------------------------*/
/*! todo */

.paragraph-with-ellipsis {
   /* width: 300px; */
   /* Adjust width as needed */
   display: -webkit-box;
   -webkit-line-clamp: 6;
   /* Number of lines to display */
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}

/*--------------------------------------------------------------*/
.card-header,
.card-body {
   background-color: #eafce9;
}

.border-success {
   border-color: #b6e6cf !important;
}

/*--------------------------------------------------------------
# activités
--------------------------------------------------------------*/
#activitesR .anime:hover {
   background-color: #3d7434;
}

#activitesR .anime:hover a {
   color: white;
}

/*--------------------------------------------------------------
# contacte
--------------------------------------------------------------*/
#contacte .img-fluid {
   width: 50%;
}

#recours input[type="text"],
#recours select,
#recours textarea {
   width: 100%;
   padding: 12px;
   border: 1px solid #ccc;
   border-radius: 4px;
   box-sizing: border-box;
   margin-top: 6px;
   margin-bottom: 16px;
   resize: vertical;
   background-color: #f8fff8;
}

#recours input[type="submit"] {
   background-color: #04aa6d;
   color: white;
   padding: 12px 20px;
   border: none;
   border-radius: 4px;
   cursor: pointer;
}

#recours input[type="submit"]:hover {
   background-color: #45a049;
}

#recours .containerForm {
   border-radius: 5px;
   background-color: #eafce9;
   padding: 20px;
}


/*--------------------------------------------------------------*/
/*! bootstrap Spacing
Notation

Spacing utilities that apply to all breakpoints, from xs to xxl, have no breakpoint abbreviation in them. This is because those classes are applied from min-width: 0 and up, and thus are not bound by a media query. The remaining breakpoints, however, do include a breakpoint abbreviation.

The classes are named using the format {property}{sides}-{size} for xs and {property}{sides}-{breakpoint}-{size} for sm, md, lg, xl, and xxl.

Where property is one of:

    m - for classes that set margin
    p - for classes that set padding

Where sides is one of:

    t - for classes that set margin-top or padding-top
    b - for classes that set margin-bottom or padding-bottom
    s - (start) for classes that set margin-left or padding-left in LTR, margin-right or padding-right in RTL
    e - (end) for classes that set margin-right or padding-right in LTR, margin-left or padding-left in RTL
    x - for classes that set both *-left and *-right
    y - for classes that set both *-top and *-bottom
    blank - for classes that set a margin or padding on all 4 sides of the element

Where size is one of:

    0 - for classes that eliminate the margin or padding by setting it to 0
    1 - (by default) for classes that set the margin or padding to $spacer * .25
    2 - (by default) for classes that set the margin or padding to $spacer * .5
    3 - (by default) for classes that set the margin or padding to $spacer
    4 - (by default) for classes that set the margin or padding to $spacer * 1.5
    5 - (by default) for classes that set the margin or padding to $spacer * 3
    auto - for classes that set the margin to auto 
	 
/*! */