header{border-top:5px solid  #DDD231}
h1,h2,h3,a{ font-family:"Oswald", sans-serif}
html,p{font-family: "Roboto", sans-serif}
#onepage_header  a {color: #DDD231;}
#onepage_header {  background:transparent;}
#onepage_header_tel { background: rgb(0,0,0,0.8);width:300px;position: absolute;right:0;top:0;height:80px;text-align:right;font-family:"Oswald", sans-serif;flex-direction:
column;line-height:1.7rem;display: flex;justify-content: center;align-items:flex-start;padding:15px;border-radius:0 0 0 15px;border:2px solid #DDD231;border-right: none;border-top:none}
#onepage_header #onepage_header_tel span a { font-family:"Oswald", sans-serif;font-size:1.4rem;color:#DDD231}
#onepage_header #onepage_header_tel a { font-family:"Oswald", sans-serif;font-size:1.2rem;color:white}
.onepage_first_title p { max-width: 1200px;}
.onepage_first_bandeau h1{font-size:1.7rem;color: #20957C;display:flex;align-items: center;justify-content: center;font-weight:600}
.onepage_first_bandeau p{font-size:1.1rem;color: #001c3d;display:flex;align-items: center;justify-content: center;margin:20px auto;max-width: 600px;text-align: center;line-height:1.3rem}
.onepage_first_bandeau p.petit{font-size:1rem;color: #001c3d;display:flex;align-items: center;justify-content: center;margin:20px auto;max-width: 800px;text-align: justify;}
.custom-shape-divider-bottom-1653056415 svg { position: relative;  display: block;  width: calc(120% + 100.3px);  height: 80px;}


 .onepage_width_logo{background:transparent}
.onepage_width_logo img{background:transparent;height:100%;border-radius:0;margin-top:-2px;}
.bandeau_img{height:80vh;overflow:hidden;display:flex;position:relative;width:100%;object-fit: cover;object-position:top;}
.page .bandeau_img{height:40vh;overflow:hidden;display:flex;position:relative;width:100%;object-fit: cover;object-position:top;}
.bandeau_img img,.bandeau_img picture{width:100%;margin-top:0;object-fit: cover;object-position: top;height:100%}
.bandeau_img img{object-position:center -100px;object-fit: cover;}
.page  .bandeau_img img { object-position: center center; object-fit: cover;}
.onepage_width_logo { width: 170px;height:170px;position: relative;top:0;left:100px;border:0px solid white;border-top:none;border-radius: 0 0 10px 10px;box-shadow: 0 5px 10px none;overflow:hidden;}
#onepage_header  .onepage_width_logo a { width: 100%;height:100%  }
.onepage_centre_header{width:100%;display:flex;}
.logo { max-width: 100%;}
.onepage_first_title h1 {font-size:2.6rem;color: #DDD231; text-shadow: 0 3px 3px #001c3d;} /* text-shadow: rgb(255, 255, 255) 2px 0px 0px, rgb(255, 255, 255) 1.75517px 0.958851px 0px, rgb(255, 255, 255) 1.0806px 1.68294px 0px, rgb(255, 255, 255) 0.141474px 1.99499px 0px, rgb(255, 255, 255) -0.832294px 1.81859px 0px, rgb(255, 255, 255) -1.60229px 1.19694px 0px, rgb(255, 255, 255) -1.97998px 0.28224px 0px, rgb(255, 255, 255) -1.87291px -0.701566px 0px, rgb(255, 255, 255) -1.30729px -1.5136px 0px, rgb(255, 255, 255) -0.421592px -1.95506px 0px, rgb(255, 255, 255) 0.567324px -1.91785px 0px, rgb(255, 255, 255) 1.41734px -1.41108px 0px, rgb(255, 255, 255) 1.92034px -0.558831px 0px; */
hr {  background: #BF2222;}
.onepage_first_title p {color:white;font-family:"Oswald", sans-serif;font-weight:normal;font-size:1.5rem;text-shadow:0 2px 2px #001c3d}
.custom-shape-divider-bottom-1653056415 { bottom: 0;}

.mentions{white-space: pre-wrap;text-align:left;max-width:950px;margin:0 auto}
.mentions .petit{display:flex;flex-direction: row;margin-bottom:0}
.mentions h1{color:#20957C}

.presentation1{margin:0 auto 50px auto;max-width: 800px;padding:20px}

#nav {display: flex; text-align: left;}
a.home{font-size: 1rem;color:#001c3d}
a.precedent{  font-size: 1rem;color:#001c3d;margin-left: 10px;}
.onepage_first_bandeau p.al{text-align: left;align-items: flex-start;justify-content: flex-start;}

.presentation1{display: flex;align-items: center;justify-content:space-between;flex-direction:row;border:1px solid gray}
.presentation1 .col1{display: flex;align-items: center;justify-content: center;flex-direction: column;width:60%;border:1px solid gray}
.presentation1 .col2{display: flex;align-items: center;justify-content: center;flex-direction: column;width:30%;border:1px solid gray}

#zoombox iframe,#zoombox img{border:none}
#zoombox .zoombox_mask{background-color:#000;position:fixed;width:100%;z-index:1051;height:100%;top:0;left:0}
#zoombox .zoombox_container{position:absolute;z-index:1052}
#zoombox .relative{position:relative}
#zoombox .zoombox_prev{position:absolute;top:0;left:0;width:50%;height:100%;-moz-opacity:0;opacity:0}
#zoombox .zoombox_prev:hover{-moz-opacity:1;opacity:1}
#zoombox .zoombox_next{position:absolute;top:0;right:0;width:50%;height:100%;-moz-opacity:0;opacity:0}
#zoombox .zoombox_close,#zoombox .zoombox_next,#zoombox .zoombox_prev{cursor:pointer}
#zoombox .multimedia .zoombox_next,#zoombox .multimedia .zoombox_prev{display:none}
#zoombox .zoombox_next:hover{-moz-opacity:1;opacity:1}
#zoombox .zoombox_gallery{position:fixed;z-index:1054;bottom:-60px;left:0;right:0;text-align:center;-moz-opacity:.85;opacity:.85;cursor:pointer;width:auto;background-color:#050505;height:60px;overflow:hidden;display:none}
#zoombox .zoombox_gallery img{height:50px;padding:5px;-moz-opacity:.3;opacity:.3}
#zoombox .zoombox_gallery img.current,#zoombox .zoombox_gallery img:hover{-moz-opacity:1;opacity:1}
#zoombox_loader{background:url(img/loader.png) left top no-repeat;position:absolute;height:40px;width:40px;cursor:pointer;top:50%;left:50%;margin:-20px 0 0 -20px;z-index:1053}
.zoombox .zoombox_container{background:#fff;color:#666;-moz-box-shadow:0 0 10px #000;-webkit-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-webkit-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000}
.zoombox .content{background:#000}
.zoombox .zoombox_title{color:#fff;position:absolute;left:-1px;top:-22px;-moz-text-shadow:1px 1px #000;-webkit-text-shadow:1px 1px #000;-o-text-shadow:1px 1px #000;-moz-text-shadow:1px 1px #000;-webkit-text-shadow:1px 1px #000;-o-text-shadow:1px 1px #000;text-shadow:1px 1px #000}
.zoombox .zoombox_close{background:url(img/close.png) no-repeat;width:30px;height:30px;position:absolute;right:-15px;top:-15px}
#zoombox.zoombox .zoombox_next{background:url(img/next.png) right center no-repeat}
#zoombox.zoombox .zoombox_prev{background:url(img/prev.png) left center no-repeat}


#services{padding:50px 0}


.gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}
.gallery img {
    max-width: 200px;
    height: auto;
    border-radius: 8px;
    cursor: zoom-in;
    transition: transform 0.3s ease;
}
.gallery img:hover {
    transform: scale(1.05);
}
.lightbox-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.8);
    justify-content: center;
    align-items: center;
    z-index: 1000;
}
.lightbox-overlay img {
    max-width: 90%;
    max-height: 90%;
    border-radius: 8px;
    box-shadow: 0 0 20px #000;
}
img.lightbox{width:100%}



#presentation{margin-top:50px;padding:20px;background:#f4f4f4;border-top:1px solid #eaeaea;border-bottom:1px solid #eaeaea}
h2{color: #20957C;}


.menu{position:fixed;right:0;top:0;height:100%;padding:15px;background: rgb(0,0,0,0.6);display:flex;flex-direction: column;text-align: left;justify-content: flex-start;align-items: center;border-left:1px solid white}
.menu_logo{display:flex;flex-direction: column;text-align: left;justify-content: flex-start;align-items:flex-start;width:100%}
.menu img{height:150px;margin-bottom:20px}
.menu a{color:white;font-size:1.2rem;font-family:"Oswald", sans-serif}
.menu hr{border: none;background:transparent;border-top:1px solid #DDD231}

.categorie{display:flex;flex-direction: row;text-align: center;justify-content:space-around;align-items: center;max-width:1200px;margin:140px auto 20px auto}
.categorie_item{display:flex;flex-direction: column;text-align: center;justify-content:space-around;align-items: center;position:relative;width:22%;;border-top:5px solid #DDD231;border-radius:10px;overflow: hidden;}
.categorie_item h2{background: rgb(0,0,0,0.8);color:white;width:100%;position:absolute;bottom:0;left:0;height:50px;display:flex;align-items:center;justify-content: center;margin:0;font-weight:normal;text-shadow: none;font-size:1.15rem;border-top:2px solid #DC1117;border-radius:0 0 5px 5px}
.onepage_first_title{margin-top:-300px}


.bloc-container {display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;}
.bloc-container a{color:#001c3d}
.bloc-item {flex:1 1 calc(33.333% - 20px);box-sizing:border-box;border:1px solid #ddd;border-radius:8px;padding:15px;text-align:center;max-width:400px;min-width:300px}
.bloc-link {text-decoration:none;color:inherit;display:block;}
.bloc-item img {max-width:100%;height:auto;border-radius:6px;margin:0 auto;height:auto;width:100%;object-fit: cover;object-position: center;}
.bloc-item h2 {margin:10px 0 5px;font-size:1.1rem;line-height:1.5rem}
.bloc-item p {font-size:0.95em;color:#001c3d;margin:0 0 15px 0;text-align:center;}
.bloc-button {display:inline-block;margin-top:10px;padding:8px 15px;background:#007bff;color:#fff;border-radius:6px;text-decoration:none;transition:background 0.3s;}
.bloc-button:hover {background:#0056b3;}
@media (max-width:992px) {.bloc-item {flex:1 1 calc(50% - 20px);}}
@media (max-width:600px) {.bloc-item {flex:1 1 100%;}}

button.rouge, .bloc-container a button.rouge{margin-top:15px;background:#DC1117;color:white;border-radius:5px}




.gallery-container { width: 100%; margin: 0 auto; padding: 0; }
.grid { margin: 0 auto; }
.grid-item { width: 25%; float: left; position: relative; overflow: hidden; cursor: zoom-in; }
@media (max-width: 1024px) { .grid-item { width: 33.33%; } }
@media (max-width: 768px) { .grid-item { width: 50%; } }
@media (max-width: 480px) { .grid-item { width: 100%; } }
.grid-item picture, .grid-item img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; transition: transform 0.3s ease; }
.grid-item:hover img { transform: scale(1.05); }
.overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.4); display: grid; place-items: center; opacity: 0; transition: opacity 0.3s; }
.grid-item:hover .overlay { opacity: 1; }
.overlay i { font-size: 2rem; color: white; }
.lightbox { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 9999; align-items: center; justify-content: center; animation: fadeIn 0.3s ease; flex-direction: column; }
.lightbox.show { display: flex !important; }
.lightbox-content { max-width: 90%; max-height: 80vh; border-radius: 6px; margin-bottom: 10px; }
.lightbox-footer { display: flex; justify-content: center; gap: 20px; align-items: center; margin-bottom: 20px; flex-wrap: wrap; }
.caption, .counter { font-size: 1rem;color:white }
.download-btn { color: white; font-size: 1.5rem; text-decoration: none; }
.download-btn:hover { color: #ddd; }
.close { position: absolute; top: 20px; right: 30px; font-size: 40px; color: white; cursor: pointer; z-index: 1001; }
.lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); font-size: 4rem; color: white; background: rgba(0,0,0,0.4); padding: 0.2em 0.4em; border-radius: 5px; z-index: 1001; cursor: pointer; user-select: none; }
.lightbox-nav:hover { background: rgba(0,0,0,0.7); }
.lightbox-prev { left: 20px; }
.lightbox-next { right: 20px; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.mode-toggle { position: fixed; top: 10px; left: 10px; z-index: 99999; font-size: 1.2rem; padding: 6px 10px; background: #222; color: white; border: none; border-radius: 5px; cursor: pointer; }
body.light-mode .mode-toggle { background: #eee; color: #111; }


header nav{text-align: center;padding:10px 15px;background-color:rgba(0,0,0,0.8);color:white;font-size:1.1rem}
header nav a{color:white;font-size:1rem;font-weight:normal;text-shadow: none;font-family: "Oswald", sans-serif;margin:0 5px;text-transform: uppercase;}
header nav a:hover{color:white;}
.equipe-container { display: flex; flex-wrap: wrap; gap: 30px; justify-content: center; margin: 40px 0; }
.membre { width: 250px; text-align: center; font-family: "Arial", sans-serif; }
.membre2 { width: 450px; text-align: center; font-family: "Arial", sans-serif; }
.membre img { width: 200px; height: 200px; object-fit: cover; border-radius: 50%;margin-bottom: 15px; box-shadow:none; transition: transform 0.3s ease; }
.membre h2{margin-bottom:5px}
.membre img:hover { transform: scale(1.05); }
.membre h3 { font-size: 1.1em; margin-bottom: 10px; color: #007B5E; }
.membre p { font-size: 0.95em; color: #001c3d; line-height: 1.4em;text-align:justify;word-break: break-word; hyphens: auto;}
.membre p.nom{text-align: center;color:#001c3d;font-weight:bold;font-size:1.1rem}
@media (max-width: 768px) { .membre { width: 100%; max-width: 300px; } }



.bulletin-grid { display: flex; flex-direction: column; gap: 2rem; padding: 2rem; }
.row { display: flex; flex-wrap: wrap; gap: 2rem; justify-content: center; }
.bulletin-item { flex: 1 1 calc(20% - 2rem); max-width: 300px; text-align: center; border: 1px solid #ddd; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.05); transition: transform 0.3s, box-shadow 0.3s; background-color: #fff; }
.bulletin-item:hover { transform: translateY(-5px); box-shadow: 0 6px 18px rgba(0,0,0,0.1); }
.bulletin-item img { width: 100%; height: auto; display: block; }
.bulletin-item p { margin: 0; padding: 1rem; font-size: 1rem; font-weight: 600; background: #f8f8f8; color: #333; }

@media (max-width: 768px) { .bulletin-item { flex: 1 1 calc(50% - 2rem); } }
@media (max-width: 480px) { .bulletin-item { flex: 1 1 100%; } }


.comptes-rendus-container { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; margin: 40px auto;max-width:1200px;}
.compte-card { display: flex; flex-direction: column; align-items: center; width: 100%;max-width:200px; text-decoration: none; background: #fff; border-radius: 10px; padding: 15px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; }
.compte-card:hover { transform: translateY(-5px); box-shadow: 0 6px 15px rgba(0,0,0,0.15); }
.compte-card img { width: 100%; height: auto; margin-bottom: 10px; }
.compte-card p { color: #001c3d; font-weight: bold; text-align: center; margin: 0; }
@media (max-width: 768px) { .compte-card { width: 100%; max-width: 300px; } }



header { background: rgba(255,255,255,0.8); position: fixed; width: 100%; top: 0; z-index: 200; }
.slider { margin-top: 80px; height: 300px; background: url('images/mer.jpg') center/cover no-repeat; position: relative; }
.slider::after { content: '◀  ● ● ●  ▶'; position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); color: white; font-size: 20px; }
.presentation { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.presentation .texte { width: 50%; }
.presentation .texte .accroche { font-weight: bold; color: #c96; }
.presentation .media { width: 50%; }
.intro { text-align: center; background: #f0f0f0; }
.grid-blocs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 20px; }
.grid-blocs img { width: 100%; height: auto; }
.parallax { height: 200px; background: url('IMG/P1010345.jpg') center/cover fixed no-repeat; color: white; display: flex; align-items: center; justify-content: center; font-size: 24px; }
.galerie { display: flex; flex-wrap: wrap; gap: 10px; padding: 20px; }
.galerie img { width: calc(25% - 10px); height: auto; }
footer { background: #333; color: white; }
.newsletter, .footer-blocs { padding: 20px; }
.footer-blocs { display: flex; justify-content: space-between; }
.contact-container { display: flex; gap: 20px; }
.contact-form, .contact-map { width: 50%; }
.contact-form input, .contact-form textarea { width: 100%; margin-bottom: 10px; padding: 8px; font-size: 14px; }
button { padding: 10px 20px; font-weight: bold; background-color: #c96; color: white; border: none; cursor: pointer; }
button:hover { background-color: #a74; }
@media screen and (max-width: 768px) { .presentation, .contact-container { flex-direction: column; } .presentation .texte, .presentation .media, .contact-form, .contact-map { width: 100% !important; } .grid-blocs { grid-template-columns: 1fr; } .galerie img { width: 100% !important; } header nav { font-size: 14px; padding: 10px; } }
.contact {background:#1e1e1e;padding:15px 30px}
.contact .onepage_bandeau,.contact  .onepage_first_bandeau {display: none}
.contact input,.contact textarea{background: transparent;border:1px solid gray}
.contact h2{color:white}
.contact  button{background: #a50b0b;}
.contact-form{max-width:500px}
.contact-map{width:100%}
.contact img{max-height:100px}
@media only screen and (max-width:40em){
.categorie {  flex-direction: column; max-width: 100%;  margin: 140px auto 20px auto;}
.categorie_item { width: 100%;margin-bottom:20px}
#footer_mentions {text-align: center;display: flex;align-items: center;justify-content: center;flex-direction:column}
.onepage_width_logo img {max-height:100px}
header nav a{font-size:0.9rem}
#onepage_header { height: 200px;}
.page .bandeau_img { height: 50vh;}
.onepage_width_logo {height:100px}
.custom-shape-divider-bottom-1653056415 svg { height: 30px;}
.onepage_first_bandeau h1 { font-size: 1.4rem;}
#services { padding: 20px 0;}
.cadre_1200 {max-width: 100% !important;padding:10px 25px}
}