.about-background .arrow, #portfolio .arrow {
  color: #ffffff!important;
  background-color: #4285F4!important;
  margin: 1rem;
  border-radius: 6px;
}
.home_head .owl-dots {
  margin-top: -30px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9;
  position: relative;
  border-radius: 0px;
}
.home_head .owl-dots .owl-dot {
  width: 15px!important;
  height: 2px!important;
  background-color: #daddde!important;
  /* border-radius: 50%!important; */
  margin: 2px;
}
.home_head .owl-dots .active {
  width: 60px!important;
  height: 2px!important;
  background-color: #5C7DEE!important;
  margin: 2px;
  /* border-radius: 5px!important; */
}
.about-background .arrow::after, #portfolio .arrow::after {
    display: inline-block;
    padding-left: 8px;
    content: "\0279E";
    -webkit-transition: transform 0.3s ease-out;
    -moz-transition: transform 0.3s ease-out;
    -ms-transition: transform 0.3s ease-out;
    -o-transition: transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
}
.about-background .arrow:hover::after, #portfolio .arrow:hover::after {
    animation: slide1 1s ease-in-out infinite;
}
#rectangle, #rectangle1, #rectangle2, #rectangle3 {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}
.header p {
  color: white;
}
#rectangle:after, #rectangle1:after, #rectangle2:after, #rectangle3:after {
  content: '»';
  position: absolute;
  opacity: 0;  
  top: 9px;
  right: 20px;
  transition: 0.5s;
  color: white;
}
.crd:hover #rectangle:after, .crd:hover #rectangle1:after,.crd:hover #rectangle2:after, .crd:hover #rectangle3:after {
  opacity: 1;
  right: 10px;
}
@keyframes slide1 {
  0%,
  100% {
    transform: translate(0, 0);
  }

  50% {
    transform: translate(10px, 0);
  }
}
.top-header .carousel-inner {
  background-color: #000000;
}
.top-header .header .row {
    height: 100%;
  }
  .top-header .child {
    margin-top: -150px;
  }
  .top-header .vd-line {
    margin-top: -40px;
    margin-bottom: 30px;
  }
  .top-header .mySlides .mt-5 {
    margin-top: 7rem!important;
  }
  .top-header .firstline {
    border: 1px solid #ccc;
    height: 62px;
    margin-top: 4px;
    width: 1px;
    opacity: 0.5;
    margin-left: 9px!important;
  }
  .top-header .scroll {
    writing-mode: vertical-lr;
  }
  #myProgress {
    width: 100%;
    background-color: #9c9c9c;
    height: 1px;
    z-index: 1!important;
    position: relative;
  }
  #myBar {
    width: 0%;
    height: 1px;
    background-color: #ffffff;
  }
  .top-header .ban1 {
      font-size: 130px;
      color: white;
      opacity: 5%;
      font-weight: 900;
      margin-top: -50px;
  }
  .top-header .slideshow-container {
    margin: auto;
  }
  .top-header .mySlides {
    display: none;
  }
  .top-header .controls {
    position: relative;
    cursor: pointer;
    margin: 4px 2px;
    background: none!important;
    color: white;
    transition: 0.6s ease;
    border-radius: 16px;
    text-decoration: none;
    border: none;
    user-select: none;
  }
  .top-header .controls:focus {
    outline: none;
  }
  .top-header .controls:focus-visible {
    outline: 3px solid black;
  }
  .top-header .text {
    color: rgb(255, 255, 255)!important;
    font-size: 18px;
    padding-left:5px!important;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    position: relative;
  }
  .top-header .slider-controls {
    width: auto!important;
    height: auto;
    display: flex;
    justify-content: end;
    align-items: center;
  }
  .top-header .slider-controls  .card {
      border-radius: 50%!important;
      width: 25px;
      height: 25px;
      background: none!important;
  }
  .top-header .carousel-control-next, .carousel-control-prev {
      width: 15px!important;
      opacity: 1!important;
      position: relative!important;
  }
  .top-header .ms-5 {
      margin-left:10rem!important;
  }
  .top-header .child .ms-5 {
    margin-left:5rem!important;
  }
  .top-header .carousel-item .row {
    scroll-behavior: smooth;
    animation: toTopFromBottom 0.6s forwards;
  }
  .top-header .carousel {
      position: relative;
      /* overflow: hidden; */
  }
  .bg__gradient {
    position: absolute;
    z-index: 0
  }
  .top-header .carousel-item {
      flex: 0 0 100%;
      will-change: transform;
      transition: all ease;
      /* transform: perspective(1500px) rotateX(0deg) rotateY(0deg); */
  }
  .top-header .current-slide {
      transform: translateX(0);
  }
  .next-slide {
      transform: translateX(100%);
  }
.fade:not(.show) {
    opacity: 1;
}
.about-background a.button, #portfolio a.button {
  padding: 10px 20px;
  font-size: 16px;
}
#about-us p {
  text-indent: 5rem;
  text-align: justify;
}
.tree-section h1,.tree-section p {
    color: #0F2257!important;
}
.empowerment-banner .cirtri {
  gap: 10rem;
}
#our-team .cirtri {
  gap: 6rem;
}
.empowerment-banner #triangle, #our-team #triangle {
    position: relative;
    transform: scale(var(--ggs,1));
    width: 22px;
    height: 17px;
    border-left: 3px solid transparent;
    border-bottom: 1px solid #FBBC05;
    transform: rotate(34deg);
}
.empowerment-banner #triangle, .empowerment-banner #triangle::before, #our-team #triangle, #our-team #triangle::before {
    display: block;
    box-sizing: border-box;
    border-right: 3px solid transparent
}
.empowerment-banner #triangle::before, #our-team #triangle::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    border-left: 1px solid #FBBC05;
    border-top: 1px solid #FBBC05;
    border-bottom: 3px solid transparent;
    transform: rotate(45deg) skew(10deg,10deg);
    left: -2px;
    bottom: -13px
}
.empowerment-banner #circle, #our-team #circle {
  height: 20px;
    width: 20px;
    border-color: white;
    border: 1px solid #ffffff;
    background: none;
    border-radius: 50%;
}
#technology .card:hover {
  transform: scale(1.065);
  box-shadow: 0px 3px 15px #91fffb26;
  background-color: #f7ffffe3;
}
/* .choose-background .owl-carousel .owl-item img {
  height: 350px!important;
} */
.choose-background .button img,svg, #blog .button img,svg {
  transition: 0.4s ease !important;
  }
  .choose-background .button:hover img,svg, #blog .button:hover img,svg {
    transform: scale(1.1)!important;
  }
.choose-background .card {
  box-shadow: 0px 3px 10px #4285F426;
  transition: 0.4s;
}
.choose-background .card:hover {
  box-shadow: rgb(207 207 207 / 35%) 0px 5px 15px;
  transform: scale(1.01);  
}
  #carousel-bouton-gauche,#carousel-bouton-droite {
      display: flex!important;
      align-items: end!important;
      z-index: 9!important;
  }
  #carousel-bouton-gauche {
    position: absolute;
    bottom: 0;
    left: 0;
    padding-left: 150px;
  }
  #carousel-bouton-droite {
    position: absolute;
    right: 0;
    padding-right: 150px;
    bottom: 0;
  }
  #chooses .owl-dots {
    text-align: end!important;
    margin-top: -56px;
    z-index: 9;
    margin-right: 1.5rem;
    margin-bottom: 30px;
    position: relative;
    gap: 1;
}
#chooses .owl-dot {
    width: 7px!important;
    height: 7px!important;
    background-color: #78bbdf;
    border-radius: 50%!important;
    margin-right: 2px;
}
#chooses .owl-dots .active {
    width: 9px!important;
    height: 9px!important;
    background-color: #3773d5;
}
@font-face {
  font-family: 'ESL Legend';
  src: url(https://raw.githubusercontent.com/SochavaAG/example-mycode/master/pens/timeline/fonts/legend/ESLLegend-Light.eot);
  src: url(https://raw.githubusercontent.com/SochavaAG/example-mycode/master/pens/timeline/fonts/legend/ESLLegend-Light.eot#iefix) format("embedded-opentype"),
  url(https://raw.githubusercontent.com/SochavaAG/example-mycode/master/pens/timeline/fonts/legend/ESLLegend-Light.woff2) format("woff2"),
  url(https://raw.githubusercontent.com/SochavaAG/example-mycode/master/pens/timeline/fonts/legend/ESLLegend-Light.woff) format("woff"),
  url(https://raw.githubusercontent.com/SochavaAG/example-mycode/master/pens/timeline/fonts/legend/ESLLegend-Light.ttf) format("truetype"),
  url(https://raw.githubusercontent.com/SochavaAG/example-mycode/master/pens/timeline/fonts/legend/ESLLegend-Light.svg#eicon) format("svg");
  font-style: normal;
  font-weight: 300;
}
.sdlc-img {
    width: 95%!important;
}
.left-plain, .right-dot {
  margin-top: 10rem;
}
.empowerment-banner {
position: relative;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
margin-top: 7.8em;
padding: 4em 0;
z-index: 1;
}
.empowerment-banner:before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 70%;
background-image: linear-gradient(to left, #bf443c, #c6443b, #cd443a, #d34339, #da4338, #da4338, #da4338, #da4338, #d34339, #cd443a, #c6443b, #bf443c);
border-radius: 50% 50% 0 0 / 100% 100% 0 0;
transform: scaleX(2);
z-index: -1;
}
.empowerment-banner .grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(237px, 1fr));
  /* grid-gap: 40px!important; */
}
.empowerment-banner .grid img,svg {
  width: 40%;
}
.empowerment-banner .grid .lh-lg {
  line-height: 1.7!important;
  height: 130px;
  max-height: 130px;
  min-height: 130px;
  overflow: hidden;
}
.empowerment-banner .grid .card {
  box-shadow: 0px 3px 20px #EA43351F;
}
.empowerment-banner .grid .card:hover {
  transform: scale(1.02);
}
.border-warning {
background-color: white!important;
}
#technology .tech {
  color: #d9ebfa;
  margin-bottom: 0rem!important;
}
#portfolio a:hover h3 {
  color: black!important;
    font-weight: 600!important;
}
#portfolio a:active h3 {
  color: black!important;
    font-weight: 600!important;
}
#portfolio .tab-pane .item {
  opacity:0.4;
  transition:.4s ease all;
  /* margin:0 20px; */
  transform:scale(.8)!important;
}
/* @media(max-width:1000px){
  .item{margin:0; transform:scale(.9)}
} */
#portfolio .tab-pane .active .item {
  opacity:1;
  transform:scale(1)!important;
}
#portfolio .owl-item {
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
}

/* #portfolio .inner{position:absolute; bottom:30px; left:0; right:0; text-align:center;} */
/* #portfolio .inner a{color:#fff; text-decoration:none; border-bottom:2px solid rgba(255,255,255,0.5); transition:.3s ease border-color} */
/* #portfolio .inner a:hover{border-color:#fff;} */
/* #portfolio .black .inner a{color:#000; border-color:rgba(0,0,0,0.4)} */
/* #portfolio .black .inner a:hover{border-color:#000;} */
/* #portfolio .owl-carousel:after{content:""; display:block; position:absolute; width:8%; top:0; bottom:0; left:50%; margin-left:-4%; pointer-events: none; background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/43033/aett_logo_slider.png) no-repeat center 50%; background-size:100% auto;} */
#portfolio .owl-controls{position:absolute; margin-top:300px;}
#portfolio .owl-dots{
  text-align: center!important;
}
#portfolio .languages_gf {
  white-space: nowrap!important;
  overflow: scroll!important;
  text-overflow: ellipsis!important;
}
.fade:not(.show) {
  opacity: 0;
  display: none;
}
#portfolio #v-pills-tab .active {
    color: #000!important;
    font-weight: 700!important;
}
#portfolio .owl-dots .owl-dot {
  width: 8px!important;
  height: 8px!important;
  background-color: #C8D2F8!important;
  border-radius: 50%!important;
  margin: 2px;
}
#portfolio .owl-dots .active {
  width: 10px!important;
  height: 10px!important;
  background-color: #5C7DEE!important;
  margin: 2px;
  border-radius: 5px!important;
}
#portfolio .custom-nav button {
    border: aliceblue;
    display: flex;
    align-items: center;
    gap: 5px;
    background: none;
}
#portfolio .owl-carousel .owl-nav, #chooses .owl-carousel .owl-nav {
  display: none;
}
#portfolio h5 {
  font-size: 18px!important;
}
#our-team .card {
  background-color: #101E3B;
  box-shadow: inset 0px 3px 20px #00000033, 0px 3px 25px #00000029;
}
#our-team hr {
  margin: 0 0 1rem!important;
  color: #ffffff!important;
  border-width: 3px!important;
  opacity: 1!important;
}
#our-team .light {
  width: 12%;
}
#our-team .p-5 {
  padding:0 3rem 3rem!important;
}
#our-team .light-img {
  position: absolute;
  width: 92%;
}
#our-team .row {
  overflow: inherit!important;
}
#our-team .flower {
  margin-bottom: -57px;
}
.empowerment-banner .grid .lh-lg::-webkit-scrollbar, #portfolio .languages_gf::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
#sdlc .span {
  width: 13% !important;
  height: 3px !important;
  background: transparent linear-gradient(90deg, #4285F4 20%, #4285F4 25%, #EA4335 25%, #EA4335 50%, #FBBC05 50%, #FBBC05 75%, #34A853 75%, #34A853 100%) 0% 0% no-repeat padding-box;
  border-radius: 0px;
  opacity: 1;
  margin-bottom: 2rem;
}
#sdlc .sdlc-slide .card {
  /* width: 80%; */
  /* height: 53%; */
  border: 5px solid transparent;
  /* border-image: linear-gradient(90deg, #003366 16%, #66ccff 84%) 1; */
  border-image-slice: 1;
  border-radius: 50%;
  /* border-color: #4285F426; */
}
#sdlc .sdlc-slide .crd-1, #sdlc .sdlc-slide .crd-2, #sdlc .sdlc-slide .crd-3, #sdlc .sdlc-slide .crd-4, #sdlc .sdlc-slide .crd-5, #sdlc .sdlc-slide .crd-6 {
  border-radius: 50%;
  padding: 0.3rem;
  width: 80%;
}
#sdlc .sdlc-slide .crd-1 {
  background: transparent linear-gradient(-112deg, #4184F2 19%, #4285F426 6%) 0% 0% no-repeat padding-box;
    /* background: transparent linear-gradient(90deg, #003366 16%, #66ccff 84%); */
}

#sdlc .sdlc-slide .crd-2 {
  background: transparent linear-gradient(-93deg, #4184F2 19%, #4285F426 6%) 0% 0% no-repeat padding-box;
}
#sdlc .sdlc-slide .crd-3 {
  background: transparent linear-gradient(-50deg, #4184F2 47%, #4285F426 6%) 0% 0% no-repeat padding-box;
}
#sdlc .sdlc-slide .crd-4 {
  background: transparent linear-gradient(-19deg, #4184F2 63%, #4285F426 6%) 0% 0% no-repeat padding-box;
}
#sdlc .sdlc-slide .crd-5 {
  background: transparent linear-gradient(6deg, #4184F2 83%, #4285F426 6%) 0% 0% no-repeat padding-box;
}
#sdlc .sdlc-slide .crd-6 {
  background: #4184F2;
}
.sdlc-slide .owl-stage-outer, .sdlc-slide .owl-stage {
  overflow-x: scroll!important;
  overflow-y: hidden;
}
.owl-carousel .owl-stage-outer::-webkit-scrollbar, .owl-carousel .owl-stage::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
#sdlc .sdlc-slide .card img {
  transition: 0.4s;
}
#sdlc .sdlc-slide .card:hover {
  /* box-shadow: rgb(220 230 251 / 35%) 0px -50px 36px -28px inset; */
  box-shadow: none;
}
#sdlc .sdlc-slide .card:hover img {
  transform: scale(1.05);
  margin-top: -20px;
  margin-bottom: 20px;
}
#sdlc .sdlc-slide .vertical-line hr {
  color: #003bff!important;
  width: 10%!important;
  margin: 2rem!important;
  transform: rotate(90deg);
  border: 0;
  border-top: 1px solid!important;
  opacity: 1!important;
}

#sdlc .sdlc-slide .horizontal-line hr {
  color: #4184F2!important;
  width: 100%!important;
  border: 0;
  border-top: 1px solid!important;
  opacity: 1!important;
  box-shadow: rgb(0 35 255 / 15%) 0px 0px 8px 1px;
}
#sdlc .sdlc-slide .horizontal-line {
  width: 10%;
}
#services .span {
  width: 8% !important;
  height: 3px !important;
  background: transparent linear-gradient(90deg, #4285F4 20%, #4285F4 25%, #EA4335 25%, #EA4335 50%, #FBBC05 50%, #FBBC05 75%, #34A853 75%, #34A853 100%) 0% 0% no-repeat padding-box;
  border-radius: 0px;
  opacity: 1;
  margin-top: -7px;
}
#services .card .span {
  width: 20% !important;
  height: 3px !important;
  background: transparent linear-gradient(90deg, #4285F4 20%, #4285F4 25%, #EA4335 25%, #EA4335 50%, #FBBC05 50%, #FBBC05 75%, #34A853 75%, #34A853 100%) 0% 0% no-repeat padding-box;
  border-radius: 0px;
  opacity: 1;
  margin-top: -7px;
}
#services .card .card-body {
  opacity: 0;
  transition: transform 0.9s ease, opacity 0.5s ease;
  transform: scale(0.8);
  padding-left: 2rem;
  padding-bottom: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: end;
}
#services .card:hover .card1, #services .card:hover .card2, #services .card:hover .card3, #services .card:hover .card4 {
  transform: scale(1.07);
}
#services .card:hover .card-body {
  opacity: 1;
  z-index: 9;
  transform: scale(1);
}
#services .card li a {
  font-size: 12px;
}
#services .card {
  overflow: hidden;
}
#services .card:hover .card1::before, #services .card:hover .card2::before, #services .card:hover .card3::before, #services .card:hover .card4::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 71%); /* Adjust the alpha value to control the darkness of the overlay */
}
@media (min-width: 1723px) and (max-width: 2000px){
  .empowerment-banner {
    margin-top: 10.6em!important;
  }
  .empowerment-banner .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr))!important;
  }
  #our-team .light-img {
    width: 95%;
  }
  #sdlc .sdlc-slide .card {
    width: 67%!important;
  }
}
@media (min-width: 1556px) and (max-width: 1723px){
  .empowerment-banner {
    margin-top: 9.5em;
  }
  .empowerment-banner .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr))!important;
  }
}
@media (min-width: 1376px) and (max-width: 1556px){
  .empowerment-banner {
    margin-top: 8.1em;
  }
  .empowerment-banner .grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(248px, 1fr))!important;
  }
  #sdlc .sdlc-slide .card {
    width: 70%!important;
  }
}
@media (min-width: 900px) and (max-width: 1024px){
  #sdlc .sdlc-slide .card {
    width: 66%!important;
  }
}
@media (min-width: 600px) and (max-width: 990px){
  .top-header .child {
    margin-top: -150px!important;
  }
  .col-1 {
    width: 11.33333333%!important;
  }
  .top-header .vd-line {
    margin-top: -32px!important;
    margin-bottom: 26px!important;
  }
  #about-us .my-5 {
    margin-top: 1rem!important;
    margin-bottom: 1rem!important;
  }
  .choose-background .p-5 {
    padding: 2rem!important;
  }
  .choose-background .col-md-6 {
    width: 100%!important;
  }
  #carousel-bouton-gauche {
    padding-left: 30px;
  }
  #carousel-bouton-droite {
    padding-right: 30px;
  }
  .flex-column {
    justify-content: space-around;
  }
  #sdlc .list-group .list-group-item.active .text-nowrap {
    font-size: 16px!important;
  }
  #technology .p-5 {
    padding: 1rem!important;
  }
  #portfolio .languages_gf {
    overflow: scroll!important;
  }
  #portfolio .w-75 {
    width: 80%;
  }
  #our-team .p-5 {
    padding: 0rem!important;
  }
  #our-team .light-img {
    width: 100%!important;
  }
  .left-plain, .right-dot {
    margin-top: 2rem;
  }
  #our-team .p-3, #technology .p-3 {
    padding: 0.5rem!important;
  }
  #our-team .m-3 {
      margin: 0.5em!important;
  }
  #our-team h1 {
    font-size: 16px!important;
  }
  #our-team h5 {
    font-size: 14px!important;
  }
  #our-team .flower {
    margin-bottom: -8px;
  }
  #our-team .cirtri {
    gap: 1rem;
  }
  #services .card1, #services .card2, #services .card3, #services .card4 {
    height: 275px!important;
  }
  #services .background::before {
    background-size: 100% 7%!important;
  }
  #services .card {
    margin-right: 5rem;
    margin-left: 5rem;
  }
  #services .card1 {
    height: 300px!important;
  }
  #services .col-md-6 {
    width: 100%;
  }
  .choose-background .owl-item .item {
    height: 100%!important;
  }
  .choose-background .owl-item .item .card {
    height: 94%!important;
  }
  #chooses .owl-dots {
    margin-top: -86px;
  }
}
@media (min-width: 600px) and (max-width: 712px){
  .top-header .ms-5 {
    margin-left: 2rem!important;
  }
  .top-header .child {
    margin-top: -140px!important;
  }
  .header .col-md-6 {
    width: 50%;
  }
  .empowerment-banner .grid {
    display: flex!important;
    overflow: scroll;
    padding-right: 0rem!important;
    padding-left: 0rem!important;
    flex-wrap: nowrap!important;
  }
  .empowerment-banner .grid .col-xs-6 {
    width: 40%;
  }
  .lh-lg {
    line-height: 1.5!important;
  }
}
@media (max-width: 1024px){
  .navbar {
    --bs-navbar-padding-y: 0rem!important;
  }
  .top-header .ms-5 {
    margin-left:5rem!important;
  }
  .home_head #top-navbar .top-header h1 {
    font-size: 2rem!important;
  }
  #about-us .col-md-6 {
    width: 100%!important;
  }
  #about-us .abt-img {
    width: 70%!important;
    padding-top: 20px;
    padding-bottom: 30px;
  }
  .about-background .px-2 {
    padding-right: 1rem!important;
    padding-left: 1rem!important;
  }
  .choose-background .col-md-11,.choose-background .carousel-item .col-md-6,.left-plain,.right-plain {
    width:100%!important;
  }
  .choose-background .card h1 {
    font-size: 1.5rem!important;
  }
  .choose-background .me-5 {
    margin-right: 1rem!important;
  }
  .choose-background .ms-5 {
    margin-left: 1rem!important;
  }
  .choose-background .card .w-100 {
    width: 70%!important;
    padding-bottom: 1rem;
  }
  .choose-background .owl-item .item .card {
    justify-content: flex-start!important;
  }
  .m-4 {
    margin: 1rem!important;
  }
  #rectangle,#rectangle1,#rectangle2,#rectangle3 {
    right: 5px;
  }
  #gallerywrapper {
    height: 300px!important;
  }
  #contact .position-absolute {
    padding-top: 78px;
  }
  .empowerment-banner {
    margin-top: 6em;
  }
  .tree-section .position-relative {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .tree {
    padding-top: 45px!important;
    padding-left: 35px!important;
    width: 87%!important;
  }
  .leafe {
    width:100%!important;
  }
  .empowerment-banner:before {
    transform: scaleX(2.3);
  }
}
@media (max-width: 600px){
  .vd-line .gap-3 {
    gap: 0.5rem!important;
  }
  .top-header .ban1 {
    font-size: 76px;
    color: white;
    opacity: 5%;
    font-weight: 900;
    margin-top: -75px;
  }
  /* .fixed-top {
    position: relative!important;
  } */
  .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {
    display: flex;
    flex-wrap: nowrap!important;
  }
  .col-2 {
    width: 40%!important;
  }
  .col-1 {
    width: 20%!important;
  }
  .top-header .text {
    font-size: 14px;
  }
  .top-header .row {
    height: auto;
  }
  .header .col-md-6 {
    margin-top: -71px;
  }
  .top-header .ms-5,.top-header .child .ms-5 {
    margin-left: 0rem!important;
    padding-left: 2rem!important;
    padding-right: 2.5rem!important;
  }
  .ban1 {
    margin-top: 2rem;
    font-size: 81px;
    position: relative!important;
  }
  .mySlides .mt-5,.faq-banner .mt-5 {
    margin-top: 0rem!important;
  }
  .about-background .my-5 {
    margin-top: 7rem!important;
    margin-bottom: 1rem!important;
  }
  #services .card .card-body {
    padding-left: 2rem;
    padding-bottom: 1rem;
  }
  #services .span {
    width: 20% !important;
  }
  .choose-background .row {
    overflow: visible;
  }
  #carousel-bouton-droite .card {
    border-radius: 50%!important;
    margin-right: -7px!important;
    display: flex!important;
    box-shadow: rgb(38 38 38 / 20%) 0px 2px 8px 0px;
  }
  #carousel-bouton-gauche {
    padding-left: 15px;
    bottom: 200px;
  }
  #carousel-bouton-droite {
    padding-right: 15px;
    bottom: 200px;
  }
  #carousel-bouton-gauche .card {
    border-radius: 50%!important;
    margin-left: -7px!important;
    display: flex!important;
    box-shadow: rgb(38 38 38 / 20%) 0px 2px 8px 0px;
  }
  .choose-background .p-5, .blog-banner .p-5 {
    padding: 1rem!important;
  }
  .choose-background .card ul {
    padding-left: 0rem!important;
  }
  .choose-background .chooses-img {
    margin-left: 0px!important;
    margin-right: 0px!important;
  }
  .choose-background .mbl-left-plus {
    width: 87px;
    height: 37px;
  }
  .choose-background .mbl-right-plain {
    width: 100px!important;
    height: 80px;
    margin-right: -7px;
    margin-top: -10px;
  }
  section .essential-background:before,.empowerment-banner:before{
    height: 100%;
    border-radius: 0 0 50% 50% / 0 0 25% 25%!important;
  }
  .empowerment-banner:before {
    height: 75%;
    border-radius: 50% 50% 0 0 / 100% 100% 0 0!important;
  }
  .empowerment-banner .cirtri {
    gap: 2rem!important;
  }
  .empowerment-banner #triangle {
    position: relative;
    transform: scale(var(--ggs,1));
    width: 12px;
    height: 6px;
    border-left: 1px solid transparent;
    border-bottom: 1px solid #FBBC05;
    transform: rotate(34deg);
  }
  .empowerment-banner #triangle,
  .empowerment-banner #triangle::before {
      display: block;
      box-sizing: border-box;
      border-right: 3px solid transparent
  }
  .empowerment-banner #triangle::before {
    content: "";
    position: absolute;
    width: 14px;
    height: 16px;
    border-left: 1px solid #FBBC05;
    border-top: 1px solid #FBBC05;
    border-bottom: 3px solid transparent;
    transform: rotate(45deg) skew(10deg,10deg);
    left: -2px;
    bottom: -10px;
  }
  .empowerment-banner #circle {
    height: 13px;
    width: 13px;
    border-color: white;
    border: 1px solid #ffffff;
    background: none;
    border-radius: 50%;
  }
  .tree-section img,svg {
      padding-top: 0!important;
      padding-left: 0!important;
  }
  .tree-section .leafe{
    width: 71%;
  }
  .empowerment-banner {
    margin-top: 3.5em!important;
    padding: 4em 0 0!important;
  }
  .tree-section .tree {
    width: 85%!important;
    padding-left: 18px!important;
    padding-top: 24px!important;
  }
  .tree-section .leafe {
    width: 100%!important;
  }
  .empowerment-banner .grid {
    display: flex!important;
    overflow: scroll;
    padding-right: 0rem!important;
    padding-left: 0rem!important;
    flex-wrap: nowrap!important;
  }
  .empowerment-banner .grid .col-xs-6 {
    width: 50%;
    padding: 1rem;
  }
  .lh-lg {
    line-height: 1.5!important;
  }
  .empowerment-banner .card h5 {
    font-size: 18px!important;
  }
  .empowerment-banner .grid img, svg {
    width: 25%!important;
  }
  .empowerment-banner .grid .lh-lg {
    line-height: 1.5!important;
    height: 130px;
    max-height: 130px;
    min-height: 130px;
    overflow: scroll;
  }
  .empowerment-banner .card{
    width: 100%;
    height: 90%;
  }
  /* #portfolio .languages_gf {
    justify-content: start!important;
  } */
  #portfolio .w-75 {
    width: 100%!important;
  }
  #portfolio .py-5 {
    padding-top: 1rem!important;
    padding-bottom: 1rem!important;
  }
  /* #portfolio .languages_gf::-webkit-scrollbar {
    width: 2px;
    height: 2px;
  } */
  /* #portfolio .languages_gf {
    overflow: scroll!important;
  } */
  #our-team .p-5 {
    padding: 0rem!important;
  }
  #our-team .p-3, #portfolio .p-5 {
    padding: 0.5rem!important;
  }
  #our-team .m-3 {
      margin: 0.5em!important;
  }
  #our-team h5 {
    font-size: 14px!important;
  }
  #our-team #triangle {
    width: 17px!important;
    height: 14px!important;
    border-left: 1px solid transparent!important;
    border-bottom: 1px solid #FBBC05!important;
  }
  #our-team #triangle::before {
    width: 19px!important;
    height: 17px!important;
    border-left: 1px solid #FBBC05!important;
    border-top: 1px solid #FBBC05!important;
    border-bottom: 1px solid transparent!important;
  }
  #our-team #circle {
    height: 15px!important;
    width: 15px!important;
    border: 1px solid #ffffff!important;
  }
  #our-team .light-img {
    width: 100%!important;
  }
  #our-team .view_gfd {
    display: flex;
  }
  #portfolio .custom-nav {
      display: none!important;
  }
  #portfolio h1 {
    font-size: 20px!important;
  }
  #our-team .cirtri {
    gap: 0rem!important;
  }
  #services .card1, #services .card2, #services .card3, #services .card4 {
    height: 190px!important;
  }
  #services .card .card-body {
    justify-content: flex-start;
  }
  #services .background::before {
    background-size: 100% 7%!important;
  } 
  #services .px-3 {
    padding-right: 0rem!important;
    padding-left: 0rem!important;
  }
  #services h1 {
    font-size: 20px!important;
    margin-bottom: 0rem!important;
  }
  #services .card-body .row {
    overflow: scroll;
  }
  #services .card-body .row::-webkit-scrollbar {
    width: 1px;
    height: 0px;
  }
  .choose-background .owl-item .item, .choose-background .owl-item .item .card {
      height: 100%!important;
  }
  #sdlc .sdlc-slide .card {
    width: 59%!important;
  }
}
@media (max-width: 447px){
  .empowerment-banner {
    margin-top: 3.5em!important;
  }
  #sdlc .sdlc-slide .card {
    width: 74%!important;
  }
}
@media (max-width: 398px){
  .empowerment-banner {
    margin-top: 2.3em!important;
  }
  .tree-section .tree {
    width: 81%!important;
    padding-left: 20px!important;
    padding-top: 23px!important;
  }
  #sdlc .sdlc-slide .card {
    width: 81%!important;
  }
}
@media (max-width: 375px){
  #share {
    gap: 0.2rem!important;
  }
  .child {
    margin-top: -164px!important;
  }
  #sdlc .sdlc-slide .card {
    width: 87%!important;
  }
}
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 3s;
  animation-name: fade;
  animation-duration: 3s;
}
@keyframes fade {
  from {
      opacity: 0.4;
  }
  to {
      opacity: 1;
  }
}
@keyframes toTopFromBottom {
  49% {
      transform: translateY(-100%);
  }
  50% {
      opacity: 0;
      transform: translateY(100%);
  }
  51% {
      opacity: 1;
  }
}
@keyframes cta-10 {
  0% {transform: rotate(0deg);transform: translateY(-2px);border-radius: 0 0 0 0;box-shadow: -5px 5px 2px red;}
 15% {border-top-width: 5px; border-radius: 0 15% 50% 50%;box-shadow: 15px 0px 2px orange;}
 25% {border-right-width: 5px;transform: translateY(5px);border-radius: 100% 50%;box-shadow: 0px 20px 2px yellow;}
 50% {border-radius: 100px 100px 400px 400px; width: 100px;
   height: 120px;transform: translateX(30px);height: 100px;box-shadow: -15px 0px 2px green; border-color: green}
 75% {border-bottom-width: 15px;transform: translateY(5px);border-radius: 300px 100px 300px 100px;}
 85% {border-left-width: 5px;box-shadow: 10px -10px 2px blue;border-radius: 20px 20px 10px 10px;border-left-color: blue;}
 100% {transform: rotate(360deg);border-width: 3px; border-radius: 0 0 0 0 ;box-shadow: 3px 3px 10px red;}
}
@keyframes slide-left {
  from {
    /* margin-left: 100%; */
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
    /* margin-left: 0%; */
  }
}
@keyframes mover {
  0% { transform: translateX(0); }
  100% { transform: translateX(-10px); }
}
@keyframes fadeinout {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(0.5, 0.5);
  }
  50% {
    transform: scale(1.5, 1.5);
  }
  100% {
    transform: scale(0.5, 0.5);
  }
}
@keyframes blastOut {
  from {
    transform: scale(0.5);
    opacity: .5;
  }
  to {
    transform: scale(1.3);
    opacity: 1;
  }
}
@keyframes pulse {
  from {
    transform: scale(0.8);
    opacity: 1;
  }
  to {
    transform: scale(1.2);
    opacity: 1;
  }
}



/* .swiper {
width: 100%;
height: 100%;
} */
.swiper-wrapper{
  -webkit-transition-timing-function:linear!important;
  transition-timing-function:linear!important; 
}
/* .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
} */
.swiper-slide {
  width: 150px!important;
  height: 150px!important;
  text-align: center;
  font-size: 33px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding: 0 50px;
}