/* Custom CSS styling matching your custom class name */
.marker-cluster-custom-orange {
    background-color: rgba(241, 128, 23, 0.6);
}
.marker-cluster-custom-orange div {
    background-color: rgba(240, 114, 0, 0.6);
    color: white;
    text-align: center;
    border-radius: 50%;
}

/* Custom CSS styling matching your custom class name */
.marker-cluster-custom-ccc {
    background-color: rgba(0,198,230, 0.6);
}
.marker-cluster-custom-ccc div {
    background-color: rgba(0,102,255, 0.6);
    color: white;
    text-align: center;
    border-radius: 25%;
}

.c0 {
  width:70% ;
  float:left;
}
.c1 {
  width:30% ;
  float:right;
  padding-left: 10px;
  padding-top: 10px;
}

/* Styles applied when the viewport width is 768px or less */
@media (max-width: 768px) {
    .c0 {
        width: 100%; /* Example: Make element full width on smaller screens */
        float:none ;
    }
    .c1 {
        width: 100%; 
        float:none;
    }
}

.search-exp {width:230px !important;}
.search-input {width:190px !important;}
.dt-search {display:none ;}

#map {
width: 100%;
height: 680px;
background-color: grey;
}

.nav-link
{
    width:50% !important ;
}

.nav-link li
{
    width:50% !important ;
}
.nav-link ul
{
    width:100% !important ;
}

.nav-link
{
    width:100% !important;
}
.nav, tab-content
{
    border:none !important;
}

.st
{
    border:none !important;
}


.gauche
{
    float:left;
    width:230px;
}
.droite
{
    float:left; 
    width:calc(100% - 240px); 
    margin-left:10px;
}
/* Styles applied when the viewport width is 620px or less */
@media (max-width: 620px) {
    .gauche {
        width: 100%; /* Example: Make element full width on smaller screens */
        float:none ;
    }
    .droite {
        width: 100%; 
        float:none;
        margin-left:0px;
    }
}

.contenant-filtre
{
    float:left;
    width:300px;
    margin-left:10px;
}


.dotsccc {
   width: 40px;
   height: 19.2px;
   background: radial-gradient(circle closest-side,#0066ff 90%,#0000) 0%   50%,
          radial-gradient(circle closest-side,#0066ff 90%,#0000) 50%  50%,
          radial-gradient(circle closest-side,#0066ff 90%,#0000) 100% 50%;
   background-size: calc(100%/3) 9.6px;
   background-repeat: no-repeat;
   animation: dots-7ar3yq 1s infinite linear;
}

@keyframes dots-7ar3yq {
   20% {
      background-position: 0%   0%, 50%  50%,100%  50%;
   }

   40% {
      background-position: 0% 100%, 50%   0%,100%  50%;
   }

   60% {
      background-position: 0%  50%, 50% 100%,100%   0%;
   }

   80% {
      background-position: 0%  50%, 50%  50%,100% 100%;
   }
}




.bars {
   width: 36px;
   height: 48px;
   --c: linear-gradient(#0066ff  0 0);
   background: var(--c) 0%   50%,
          var(--c) 50%  50%,
          var(--c) 100% 50%;
   background-size: 7.2px 50%;
   background-repeat: no-repeat;
   animation: bars-7s9ul0sm 1s infinite linear alternate;
}

@keyframes bars-7s9ul0sm {
   20% {
      background-size: 7.2px 20% ,7.2px 50% ,7.2px 50%;
   }

   40% {
      background-size: 7.2px 100%,7.2px 20% ,7.2px 50%;
   }

   60% {
      background-size: 7.2px 50% ,7.2px 100%,7.2px 20%;
   }

   80% {
      background-size: 7.2px 50% ,7.2px 50% ,7.2px 100%;
   }
}

.ccc-button {
  /* Layout & Spacing */
  display: inline-block;        /* Allows padding and block margins */
  padding: 12px 24px;           /* Top/Bottom and Left/Right internal spacing */
  margin: 10px;                 /* External spacing around the button */
  
  /* Appearance */
  background-color: #0066ff;    /* Modern blue background */
  color: #ffffff;               /* Clean white text */
  border: none;                 /* Removes default ugly browser borders */
  border-radius: 6px;           /* Gives modern, slightly rounded corners */
  
  /* Typography */
  
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;        /* Removes default underline if using an <a> tag */
  text-align: center;
  
  /* UX & Animation */
  cursor: pointer;              /* Changes mouse to a clicking hand pointer */
  transition: background 0.2s ease, transform 0.1s ease; /* Smooth hover transition */
}
.ccc-button:hover {
    color: #ccc;
}
