.elementor-2456 .elementor-element.elementor-element-186a330d{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--justify-content:flex-start;--align-items:center;--background-transition:0.3s;--padding-block-start:2em;--padding-block-end:0em;--padding-inline-start:3em;--padding-inline-end:3em;}.elementor-2456 .elementor-element.elementor-element-186a330d:not(.elementor-motion-effects-element-type-background), .elementor-2456 .elementor-element.elementor-element-186a330d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#8DB6C3;}.elementor-2456 .elementor-element.elementor-element-186a330d, .elementor-2456 .elementor-element.elementor-element-186a330d::before{--border-transition:0.3s;}.elementor-2456 .elementor-element.elementor-element-2802d772{--display:flex;--background-transition:0.3s;}.elementor-2456 .elementor-element.elementor-element-2802d772, .elementor-2456 .elementor-element.elementor-element-2802d772::before{--border-transition:0.3s;}.elementor-2456 .elementor-element.elementor-element-6f9c8ddd{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--justify-content:flex-start;--background-transition:0.3s;--margin-block-start:0em;--margin-block-end:0em;--margin-inline-start:0em;--margin-inline-end:0em;--padding-block-start:0em;--padding-block-end:0em;--padding-inline-start:0em;--padding-inline-end:0em;}.elementor-2456 .elementor-element.elementor-element-5ce50ca2 .elementor-button .elementor-align-icon-right{margin-left:15px;}.elementor-2456 .elementor-element.elementor-element-5ce50ca2 .elementor-button .elementor-align-icon-left{margin-right:15px;}.elementor-2456 .elementor-element.elementor-element-5ce50ca2 .elementor-button{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:500;fill:var( --e-global-color-accent );color:var( --e-global-color-accent );background-color:#C4DAE099;border-style:none;border-radius:8px 8px 8px 8px;padding:10px 10px 10px 10px;}.elementor-2456 .elementor-element.elementor-element-20bdd1a3 .elementor-button .elementor-align-icon-right{margin-left:0px;}.elementor-2456 .elementor-element.elementor-element-20bdd1a3 .elementor-button .elementor-align-icon-left{margin-right:0px;}.elementor-2456 .elementor-element.elementor-element-20bdd1a3 .elementor-button{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );fill:var( --e-global-color-accent );color:var( --e-global-color-accent );background-color:#C4DAE099;border-style:none;border-radius:8px 8px 8px 8px;padding:10px 10px 10px 10px;}.elementor-2456 .elementor-element.elementor-element-5791d5bc{--display:flex;--background-transition:0.3s;--border-radius:18px 18px 18px 18px;--padding-block-start:2em;--padding-block-end:10em;--padding-inline-start:0em;--padding-inline-end:0em;}.elementor-2456 .elementor-element.elementor-element-5791d5bc:not(.elementor-motion-effects-element-type-background), .elementor-2456 .elementor-element.elementor-element-5791d5bc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#C4DAE04D;}.elementor-2456 .elementor-element.elementor-element-5791d5bc, .elementor-2456 .elementor-element.elementor-element-5791d5bc::before{--border-transition:0.3s;}.elementor-2456 .elementor-element.elementor-element-37e09356{text-align:center;}.elementor-2456 .elementor-element.elementor-element-37e09356 .elementor-heading-title{color:var( --e-global-color-accent );font-family:"Montserrat", Sans-serif;font-size:32px;font-weight:400;}.elementor-2456 .elementor-element.elementor-element-7488532a > .elementor-widget-container{margin:0em 0em 0em 0em;}.elementor-2456 .elementor-element.elementor-element-d1800df > .elementor-widget-container{margin:0em 0em 0em 0em;}.elementor-2456 .elementor-element.elementor-element-d1800df.elementor-element{--align-self:center;}.elementor-2456 .elementor-element.elementor-element-21a161 .elementor-button{font-family:"Montserrat", Sans-serif;font-size:32px;font-weight:700;background-color:var( --e-global-color-secondary );border-radius:10px 10px 10px 10px;padding:12px 12px 12px 12px;}.elementor-2456 .elementor-element.elementor-element-21a161 > .elementor-widget-container{margin:0em 0em 0em 0em;padding:0em 0em 0em 0em;}:root{--page-title-display:none;}/* Start custom CSS for button, class: .elementor-element-5ce50ca2 */.elementor-2456 .elementor-element.elementor-element-5ce50ca2 .elementor-button {
   display: flex;
height: 30px;
padding: 10px;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10px;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-20bdd1a3 */.elementor-2456 .elementor-element.elementor-element-20bdd1a3 .elementor-button {
   display: flex;
height: 30px;
padding: 10px;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10px;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7488532a */svg#map-commerciaux {
      width: 580px;
      cursor: pointer;
      padding-left: 20px
    }

    .svg-card-container {
      position: relative;
      width: 894px;
    }

    .hidden {
      display: none !important;
    }
    
      .region-active {
    cursor: pointer;
    filter: drop-shadow(5px 30px 10px rgba(3, 98, 128, 1));
    transform: translate(0px, -10px) ;
    transition: transform 0.3s ease-in-out, filter 0.3s ease-in-out;
}

#centre path {
  fill: #4f8fa5;
}

#est path, #sud-ouest path { 
  fill: #81afbf;
}

#nord path, #sud-est-top path {
  fill: #bfd53c;
}

#sud-est-bottom path, #ouest path {
  fill: #e7efb6;
}



    .map-card {
      position: absolute;
      z-index: 10;
      top: 50px;
      right: -70px;
      transition: all 0.5s ease-in-out;
      background-color: #036280;
      width: 300px;
      height: 335px;
      border-radius: 17.6px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      cursor: pointer;
      overflow: hidden;
      padding: 1em;
    }

    .map-card-text {
      position: absolute;
      left: 15px;
      bottom: 15px;
      color: white;
      font-size: 22px;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      transition: all 0.3s linear;
    }
    
    .map-card-text h4 {
        margin: 0
    }

    .map-card-text p {
      font-size: 16px;
      font-style: normal;
      font-weight: 500;
      line-height: normal;
      margin: 0;
     
    }

    .map-card span {
      text-transform: uppercase;
      font-weight: 800;
    }

    .map-card-img-wrapper {
      position: relative;
    }

    .map-card-img-wrapper img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: all 0.3s linear;
      border-radius: 13px;
      opacity: 0.8;
    }

    .map-card-active {
      height: auto;
      max-height: 350px;
      transition: max-height 0.3s linear;
    }

    .map-card-active .map-card-img-wrapper img {
      transform: scale(0.68);
      transform-origin: 5% 10%;
      transition: all 0.3s linear;

    }

    .map-card-active .map-card-text {
      transition: transform 0.3s linear;
      display: block;
    }

    .map-card-active .hidden-content {
      display: block;
      font-size: 12px;
      height: 55px;
      transition: height 0.3s linear;
    }

    .hidden-content,
    .map-card-active .card-icons {
      display: none;
      transition: height 0.3s linear;
    }

    .hidden-content p {
      font-size: 12px;
      font-style: normal;
      font-weight: 500;
      line-height: normal;
      color: #036280;
      background-color: #DAE69A;
      border-radius: 5px;
      display: inline-block;
      padding: 0 5px;
    }

    .hidden-content p:first-child {
      margin-bottom: 5px;
    }
    
    div#ressicaud .map-card-active .map-card-text, #roubiau .map-card-active .map-card-text, #danoun .map-card-active .map-card-text, #marzo .map-card-active .map-card-text, #decarite .map-card-active .map-card-text {
transform: translate(-13px, -6px) !important;

}

.map-card-active #grosse-lopez  .map-card-text, .map-card-active #rey-condello  .map-card-text {
transform: translate(-13px, -4px);

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d1800df */.card-container {
            width: 749px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 400px
        }

        .card {
            width: 230px;
            max-height: 253px;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
            border-radius: 13px;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 10px;
            cursor: pointer;
            position: relative;
            overflow: hidden;
            transition: max-height 0.3s linear;
            background: white
        }


        .card-img-wrapper {
            width: 205px;
            height: 205px;
            border-radius: 13px;
            position: relative;
        }

        .card-img-wrapper img {
            width: 205px;
            height: 205px;
            border-radius: 13px;
            transition: all 0.3s linear;
            object-fit: scale-down;
            filter: brightness(80%)

        }

        .card-text {
            position: absolute;
            bottom: 10px;
            left: 10px;
            color: white;
            font-size: 16px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            transition: transform 0.3s linear;
            
        }

        .card-icons {
            padding-top: 5px;
        }

        .card-text p {
            font-size: 16px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
        }

        .card span {
            text-transform: uppercase;
            font-weight: 800;
        }

        .card-active {
            height: auto;
            max-height: 270px;
            transition: max-height 0.3s linear;
        }

        .card-active .card-content img {
            transform: scale(0.72);
            transform-origin: 5% 10%;
            transition: all 0.3s linear;
        }

        .card-active .card-text {
            color: #036280;
            transform: translate(-8px, 5px);
            transition: transform 0.3s linear;
            display: block;
        }

        .card-active .hidden-content {
            display: block;
            font-size: 12px;
            height: 55px;
            transition: height 0.3s linear;
        }

      .hidden-content, .card-active .card-icons {
            display: none;
            transition: height 0.3s linear;
        }

       .hidden-content p {
            font-size: 12px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            color: #036280;
            background-color: #DAE69A;
            border-radius: 5px;
            display: inline-block;
            padding: 0 5px;
        }

      .hidden-content p:first-child {
            margin-bottom: 5px;
        }
        
        .card-text h4, .card-text p {
            margin: 0;
            font-size: 16px !important
        }/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-21a161 */.elementor-2456 .elementor-element.elementor-element-21a161 .elementor-button {
    width: 620px 
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-186a330d */.elementor-2456 .elementor-element.elementor-element-186a330d {
    height: 1470px;
}/* End custom CSS */