#page-association .association-hero {margin-top:140px} .association-hero {
text-align: center;
padding: 20px 20px 70px 20px;
background-color: #f9f9f9;
margin-bottom:30px;
}
.association-hero img {
width: 200px; height:auto;
margin-bottom:20px; margin-top:10px;
}
.association-hero .chapo {
font-size: 1.2rem;
margin-bottom: 1.5rem;
}
.association-hero .btn {
border:0;
display: inline-block;
padding: 15px 20px;
background-color: #796EF9;
color: #fff;
text-decoration: none;
border-radius: 8px;
font-size:16px;font-weight:700;
max-width:280px;
}
.association-hero .btn:hover {    background-color: #FF9031;}
.association-hero .asso-header-2cols {display:flex;justify-content:space-between;flex-wrap:wrap}
.asso-header-col1 {max-width:624px;padding:0px 20px;}
.asso-header-col2 {min-width:240px;display:flex;flex-direction:column;align-items:center}
.asso-header-col2 img {display:block}
.asso-header-col1 h1 {font-size:60px;line-height:normal;font-weight:700;margin-bottom:30px;text-align:left}
.asso-header-col1 p.chapo {text-align:left;font-size:19px;margin-bottom:40px}
@media (max-width:980px) {
.asso-header-2cols {flex-direction:column;}
.asso-header-col1 {min-width:100%;max-width:100%;padding:0}
.asso-header-col2 {align-items:center;min-width:100%;max-width:100%}
}
.asso-header-2cols {display:flex}
.asso-colonnes {display:flex} .asso-cols-1 {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2rem;
gap: 2rem;
margin-top: 2rem;
}
.asso-cols-1 .asso-colx3 {
flex: 1 1 calc(33.333% - 1.33rem);
min-width: 280px;
}
.asso-cols-2 {
display: flex;
flex-wrap:wrap;
gap: 40px;
margin-top: 40px;
}
.asso-cols-2-as {
display: grid;
grid-template-columns: calc(50% + 20px) calc(50% - 20px);
gap: 40px;
gap: 40px;
margin-top: 40px;
}
.asso-cols-2-as h2 {font-size: 36px;width:340px;max-width:100%;line-height:normal;margin-bottom:38px}
.asso-cols-2 .asso-colx2 {
flex: 1 1 calc(50% - 20px);
min-width: 380px;
} .asso-cols-3-4 {
display: flex;
flex-wrap: wrap;
gap: 2rem;
margin-top: 2rem;
}
.asso-cols-3-4 .col {
flex: 1 1 45%;
min-width: 280px;
}
.asso-cols-3-4 .col img {
max-width: 100%;
border-radius: 8px;
margin-bottom: 1rem;
}
.asso-main {}
.asso-section-2 {margin-bottom:84px}
#asso-section-2 h2 {text-align:center;font-size:36px;margin-bottom:21px}
#asso-section-2 .container > p {text-align:center;font-size:19px;max-width:610px;margin-left:auto;margin-right:auto;}
.asso-cols-1 {display:flex;gap:20px;flex-wrap:wrap;}
.asso-col-orange {min-width:288px;background-color:#FF9031;padding:17px 14px;color:white;font-weight:400 }
.asso-col-orange h4 {text-transform:uppercase;font-weight:bold;margin-bottom:9px;font-size:20px}
@media (max-width:999px) {
.asso-cols-1 {flex-direction:column}
.asso-col-orange {min-width:100%}
}
.asso-col-2-admin {display:flex;flex-wrap:wrap}
.asso-col-2-admin .asso-col-img {min-width:520px;padding-left:40px;margin-top:40px;display:flex;align-items:flex-end;}
.asso-col-2-admin .asso-col-txt h2 {font-size:36px;line-height:normal;margin-bottom:38px;max-width:100%;width:320px}
.asso-trois .container {margin-top:37px;background-color:#F9FAFB;padding-top:27px;padding-bottom:30px;padding-left:70px;padding-right:70px;margin-bottom:38px}
.asso-trois h2 {font-size:36px;text-align:center;margin-bottom:34px;}
.asso-trois h3 {font-weight:bold;font-size:20px;text-align:left;margin-bottom:30px;}
.asso-trois .asso-trois-img {margin-bottom:19px;display:flex;justify-content:center} .asso-video {padding-top:47px;padding-bottom:47px;}
.asso-video h2 {color:white;text-align:center;font-size:36px;margin-bottom:24px;}
.asso-video h3 {color:white;text-align:center;font-size:20px;margin-bottom:36px;}
.video-wrapper {
position: relative;
width: 100%;
width: 970px;max-width:90%;
max-height:540px;
margin: 2rem auto;
cursor: pointer;
}
.video-wrapper img {
display: block;
width: 100%;
border-radius: 0px;
}
.video-wrapper .play-button {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80px;
height: 80px;
transition: transform 0.2s ease;
}
.video-wrapper:hover .play-button {
transform: translate(-50%, -50%) scale(1.1);
}
.asso-galerie h2 {text-align:center;font-size: 36px;;margin-bottom:47px;margin-top:32px;}
.asso-galerie .galerie {
max-width: 840px;
display: flex;justify-content:center;margin-left:auto;margin-right:auto;
gap: 40px;flex-wrap:wrap;
}
.asso-galerie .galerie-item {
display:flex;flex-grow:1;
position: relative;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
min-height:240px;max-width:180px;min-width:180px;
}
.asso-galerie .galerie-item:before {
position:absolute;bottom:4px;left:4px;opacity:1;z-index:9;
content:"";background-image:url(https://www.eig.fr/wp-content/uploads/2026/02/minifleche.svg);width:9px;height:9px;background-size:9px;background-repeat:no-repeat;
}
.asso-galerie .galerie-item:hover:before {opacity:0}
.asso-galerie .galerie-item p  {font-size:13px}
.asso-galerie .galerie-item h4  {font-size:13px;font-weight:bold}
.asso-galerie .galerie-image {
min-height:240px;
display:flex;flex-grow:1;
position: relative;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
} .asso-galerie .galerie-info {
position: absolute;
inset: 0;
background: rgba(121, 110, 249, 0.95);
color: #fff;
padding: 10px;
display: flex;
flex-direction: column;
justify-content: flex-start;
opacity: 0;
transition: opacity 0.3s ease;
padding-top:40px;
}
.asso-galerie .galerie-item:hover .galerie-info {
opacity: 1;
}
@media (max-width:980px) {
.asso-galerie .galerie-item {flex-direction:column;}
.asso-galerie .galerie-info  {
position:relative;opacity:1;flex-grow:1;
padding-top:10px;
}
}