/* =========================
   Fonts
   ========================= */

@font-face {
  font-family: 'Marianne-Thin';
  src: url("./fonts/Marianne-Thin.woff2") format("woff2"),
       url("./fonts/Marianne-Thin.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Marianne-Light';
  src: url("./fonts/Marianne-Light.woff2") format("woff2"),
       url("./fonts/Marianne-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Marianne-Regular';
  src: url("./fonts/Marianne-Regular.woff2") format("woff2"),
       url("./fonts/Marianne-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Marianne-Medium';
  src: url("./fonts/Marianne-Medium.woff2") format("woff2"),
       url("./fonts/Marianne-Medium.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Marianne-Bold';
  src: url("./fonts/Marianne-Bold.woff2") format("woff2"),
       url("./fonts/Marianne-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Marianne-ExtraBold';
  src: url("./fonts/Marianne-ExtraBold.woff2") format("woff2"),
       url("./fonts/Marianne-ExtraBold.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Spectral";
  src: url("/fonts/Spectral-Regular.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: 'Century-Gothic';
  src: url('fonts/century-gothic.ttf');
  font-display: swap;
}

@font-face {
  font-family: 'Francaise';
  src: url('fonts/Francaise_Regular.ttf');
  font-display: swap;
}

@font-face {
  font-family: 'Railway';
  src: url('fonts/Railway.otf');
  font-display: swap;
}

@font-face {
  font-family: 'HannaMonica';
  src: url('fonts/Hanna_Monica.ttf');
  font-display: swap;
}

@font-face {
  font-family: 'Themis';
  src: url('fonts/Themis.otf');
  font-display: swap;
}


/* =========================
   Base / Reset
   ========================= */

/* Reset léger (attention : peut impacter Bootstrap si modifié) */
* {
  margin: 0;
  padding: 0;
}

html, body { height: 100%; }

h1 { font-family: 'Marianne-Regular'; }
h1, h2, h3 { font-family: 'Marianne-Regular', arial, sans-serif; }


/* =========================
   Layout / Blocks
   ========================= */

#main {
  background: #FFFFFF;
  max-width: 1280px;
  min-height: 100%;
  margin: 0 auto;
  position: relative;
}

header {
  position: relative;
  max-width: 1280px;
  background: #fff;
  margin: auto;
}

footer {
  min-height: 350px;
  background: #777;
  width: 100%;
  padding: 20px;
}

.bg_menu { width: 100%; background: #eee; }

.logo {
  position: relative;
  z-index: 123;
  padding: 10px;
  font: 18px verdana;
  color: #6DDB07;
  float: left;
  width: 15%;
}
.logo a { color: #6DDB07; }

.mention { max-width: 1140px; height: 30px; color: #000; text-align: center; padding: 20px; }

.menu { width: 100%; background: #000055; font-family: 'Marianne-Regular'; }

nav { position: relative; margin: auto; z-index: 10000; /* max-width:1280px; */ }

.page { padding: 40px; }

.wrap_mention { max-width: 100%; height: 30px; padding: 30px; }


/* =========================
   Dropdown / Navbar / Bootstrap overrides
   ========================= */

.dropdown-item { border-bottom: solid 1px #eee; }
.dropdown-item:hover { border-left: solid 7px #029d7b; }

/* Couleur/espacement/typo consolidés en un seul bloc */
.navbar-dark .navbar-nav .nav-link {
  color: #fff !important;
  margin-right: 50px;
  font-size: 1.2em;
}

/* Soulignement animé sur les liens de nav (corrigé) */
.navbar .nav-item .nav-link::after {
  content: '';
  position: absolute;
  bottom: 15px;
  left: 30%;
  right: 30%;
  height: 1px;
  background-color: #fff;
  transform: scaleX(0);
  transition: transform 0.1s ease-in;
}

/* Sticky animé (utilisé avec .fixed-top appliqué via JS) */
.fixed-top {
  top: -40px;
  transform: translateY(40px);
  transition: transform .3s;
}

/* Palette */
.bg-primary { background: #000055 !important; }

/* Desktop hover opening for dropdowns */
@media all and (min-width: 1020px) {
  .navbar .nav-item .dropdown-menu { display: none; }
  .navbar .nav-item:hover .dropdown-menu { display: block; }
  .navbar .nav-item .dropdown-menu { margin-top: 0; }
}


/* =========================
   Custom menu #cssmenu
   ========================= */

#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a, #cssmenu #head-mobile {
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu:after, #cssmenu > ul:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
#cssmenu #head-mobile { display: none; }

#cssmenu { font-family: Marianne, Arial, sans-serif; background: #000055; }

#cssmenu > ul > li { float: left; }
#cssmenu > ul > li > a {
  padding: 17px;
  font-size: 1.2em;
  letter-spacing: 1px;
  text-decoration: none;
  color: #ddd;
  font-weight: 700;
}
#cssmenu > ul > li:hover > a, #cssmenu ul li.active a { color: #fff; }
#cssmenu > ul > li:hover,
#cssmenu ul li.active:hover,
#cssmenu ul li.active,
#cssmenu ul li.has-sub.active:hover {
  background: #448D00 !important;
  -webkit-transition: background .3s ease;
  -ms-transition: background .3s ease;
  transition: background .3s ease;
}

#cssmenu ul ul li:hover::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  top: 0;
  width: 5px;
  background-color: #c0ca33;
}
#cssmenu > ul > li.has-sub > a { padding-right: 30px; }
#cssmenu > ul > li.has-sub > a:after {
  position: absolute; top: 22px; right: 11px; width: 8px; height: 2px; display: block; background: #ddd; content: '';
}
#cssmenu > ul > li.has-sub > a:before {
  position: absolute; top: 19px; right: 14px; display: block; width: 2px; height: 8px; background: #ddd; content: '';
  -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease;
}
#cssmenu > ul > li.has-sub:hover > a:before { top: 23px; height: 0; }
#cssmenu ul ul { position: absolute; left: -9999px; }
#cssmenu ul ul li {
  height: 0;
  -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease;
  background: #333;
}
#cssmenu li:hover > ul { left: auto; }
#cssmenu li:hover > ul > li { height: 35px; }
#cssmenu ul ul ul { margin-left: 100%; top: 0; }
#cssmenu ul ul li a {
  border-bottom: 1px solid rgba(150,150,150,0.15);
  padding: 10px 15px;
  width: 360px; font-size: 1em; text-decoration: none; color: #FFF; font-weight: 400;
}
#cssmenu ul ul li:last-child > a, #cssmenu ul ul li.last-item > a { border-bottom: 0; }
#cssmenu ul ul li:hover > a, #cssmenu ul ul li a:hover { color: #fff; }
#cssmenu ul ul li.has-sub > a:after {
  position: absolute; top: 16px; right: 11px; width: 8px; height: 2px; display: block; background: #ddd; content: '';
}
#cssmenu ul ul li.has-sub > a:before {
  position: absolute; top: 13px; right: 14px; display: block; width: 2px; height: 8px; background: #ddd; content: '';
  -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease;
}
#cssmenu ul ul > li.has-sub:hover > a:before { top: 17px; height: 0; }
#cssmenu ul ul li.has-sub:hover, #cssmenu ul li.has-sub ul li.has-sub ul li:hover { background: #363636; }
#cssmenu ul ul ul li.active a { border-left: 1px solid #000055; }
#cssmenu > ul > li.has-sub > ul > li.active > a,
#cssmenu > ul ul > li.has-sub > ul > li.active > a { border-top: 1px solid #aaa; }

@media screen and (max-width: 1000px) {
  .logo { position: absolute; top: 0; left: 0; width: 100%; height: 46px; text-align: center; padding: 10px 0 0 0; float: none; }
  .logo2 { display: none; }

  #cssmenu { width: 100%; }
  #cssmenu ul { width: 100%; display: none; }
  #cssmenu ul li { width: 100%; border-top: 1px solid #444; }
  #cssmenu ul li:hover { background: #363636; }
  #cssmenu ul ul li, #cssmenu li:hover > ul > li { height: auto; }
  #cssmenu ul li a, #cssmenu ul ul li a { width: 100%; border-bottom: 0; }
  #cssmenu > ul > li { float: none; }
  #cssmenu ul ul li a { padding-left: 25px; }
  #cssmenu ul ul li { background: #333 !important; }
  #cssmenu ul ul li:hover { background: #363636 !important; }
  #cssmenu ul ul ul li a { padding-left: 35px; }
  #cssmenu ul ul li a { color: #FFF; background: none; }
  #cssmenu ul ul li:hover > a, #cssmenu ul ul li.active > a { color: #fff; }
  #cssmenu ul ul, #cssmenu ul ul ul { position: relative; left: 0; width: 100%; margin: 0; text-align: left; }
  #cssmenu > ul > li.has-sub > a:after,
  #cssmenu > ul > li.has-sub > a:before,
  #cssmenu ul ul > li.has-sub > a:after,
  #cssmenu ul ul > li.has-sub > a:before { display: none; }
  #cssmenu #head-mobile { display: block; padding: 23px; color: #FFF; font-size: 1em; font-weight: 700; }
  .button { width: 55px; height: 46px; position: absolute; right: 0; top: 0; cursor: pointer; z-index: 12399994; }
  .button:after { position: absolute; top: 22px; right: 20px; display: block; height: 4px; width: 20px; border-top: 2px solid #dddddd; border-bottom: 2px solid #dddddd; content: ''; }
  .button:before { -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; position: absolute; top: 16px; right: 20px; display: block; height: 2px; width: 20px; background: #ddd; content: ''; }
  .button.menu-opened:after {
    -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease;
    top: 23px; border: 0; height: 2px; width: 19px; background: #fff;
    -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);
  }
  .button.menu-opened:before { top: 23px; background: #fff; width: 19px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
  #cssmenu .submenu-button { position: absolute; z-index: 99; right: 0; top: 0; display: block; border-left: 1px solid #444; height: 46px; width: 46px; cursor: pointer; }
  #cssmenu .submenu-button.submenu-opened { background: #262626; }
  #cssmenu ul ul .submenu-button { height: 34px; width: 34px; }
  #cssmenu .submenu-button:after { position: absolute; top: 22px; right: 19px; width: 8px; height: 2px; display: block; background: #ddd; content: ''; }
  #cssmenu ul ul .submenu-button:after { top: 15px; right: 13px; }
  #cssmenu .submenu-button.submenu-opened:after { background: #fff; }
  #cssmenu .submenu-button:before { position: absolute; top: 19px; right: 22px; display: block; width: 2px; height: 8px; background: #ddd; content: ''; }
  #cssmenu ul ul .submenu-button:before { top: 12px; right: 16px; }
  #cssmenu .submenu-button.submenu-opened:before { display: none; }
  #cssmenu ul ul ul li.active a { border-left: none; }
  #cssmenu > ul > li.has-sub > ul > li.active > a,
  #cssmenu > ul ul > li.has-sub > ul > li.active > a { border-top: none; }
}


/* =========================
   Widgets / Cards
   ========================= */

.widget_footer {
  border-right: solid 1px #eeeeee;
  padding: 10px;
  height: 230px;
}

.widget_footer_end {
  padding: 10px;
  height: 230px;
}

.widget_accueil {
  border: solid 1px #dddddd;
  padding: 10px;
  margin: 10px auto;
  width: 90%;
  border-radius: 10px;
  background: #FAFAFA;
}

.img_widget_accueil {
  width: 100%;
  -moz-box-shadow: 5px 5px 5px #aaa;
  -webkit-box-shadow: 5px 5px 5px #aaa;
  box-shadow: 5px 5px 5px #aaa;
}

.texte_zoom { font-size: 0.9em; text-align: justify; }

.soustitre  { font-style: normal; font-family: verdana, arial, helvetica; font-size: 20px; color: #666666; }
.soustitre2 { font-style: normal; font-family: verdana, arial, helvetica; font-size: 18px; color: #006699; }
.soustitre3 { font-weight: bold; font-family: verdana, arial, helvetica; font-size: 14px; color: #0066CC; text-decoration: underline; }

.titre_accueil { text-align: center; }

.blocimg_widget {
  width: 60px;
  height: 60px;
  margin: auto;
}

.bloc_widget {
  width: 110px;
  height: 110px;
  margin: 10px auto;
  padding: 10px;
  background: #FFFFFF;
  border-radius: 10px;
  border: solid 3px #4955a9;
  -moz-box-shadow: 1px 1px 6px #555;
  -webkit-box-shadow: 1px 1px 6px #555;
  box-shadow: 1px 1px 6px #555;
}

.widget {
  float: right;
  margin: 10px 5px 10px 10px;
  padding: 25px;
  background: #FAFAFA;
  width: 300px;
  font-family: Century-Gothic, arial, helvetica, sans-serif;
  font-size: 1em;
  text-decoration: none;
  color: #000044;
  -moz-box-shadow: 3px 3px 3px #555;
  -webkit-box-shadow: 3px 3px 3px #555;
  box-shadow: 3px 3px 3px #555;
  border-radius: 5px;
}
.widget hr {
  border: 0;
  border-top: solid 1px #0000AA;
  padding: 0;
  margin: 0;
}
.titre_widget {
  font-family: Century-Gothic, arial, helvetica, sans-serif;
  text-align: left;
  font-size: 1.2em;
  text-decoration: none;
  margin-bottom: 20px;
  color: #4C6C8C;
}


/* =========================
   Media / Images / Links
   ========================= */

img { max-width: 100%; height: auto; vertical-align: middle; }
a img { border: 0; }


/* =========================
   Components / Misc
   ========================= */

.nav-item /* container */ {}
.header /* unused */ {}

.sticky { position: fixed; top: 0; width: 100%; }

.navbar-dark .navbar-nav .nav-link { /* consolidé plus haut */ }

.zoom { transition: transform .1s; }
.zoom:hover {
  -ms-transform: scale(1.2);        /* IE 9 */
  -webkit-transform: scale(1.2);    /* Safari 3-8 */
  transform: scale(0.97);
}

/* Sélecteur corrigé : on stylise nav-link et dropdown-item séparément si besoin */
/* .nav-link .dropdown-item { ... }  <-- supprimé car incorrect */

/* Select/field style — version “plein largeur” */
.rubrique_slide {
  width: 100%;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: .25rem;
}

/* Marquee (fusion des définitions) */
.marquee {
  height: 50px;
  overflow: hidden;
  position: relative;
  background: #fefefe;
  color: #FF7000;
  font-size: 1.3em;
  font-weight: bold;
}
.marquee p {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
  line-height: 50px;
  text-align: center;
  -moz-transform: translateX(100%);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  -moz-animation: scroll-left 2s linear infinite;
  -webkit-animation: scroll-left 2s linear infinite;
  animation: scroll-left 20s linear infinite;
}
@-moz-keyframes scroll-left {
  0%   { -moz-transform: translateX(100%); }
  100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes scroll-left {
  0%   { -webkit-transform: translateX(100%); }
  100% { -webkit-transform: translateX(-100%); }
}
@keyframes scroll-left {
  0% {
    -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    -moz-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

/* Bouton scrollUp (commenté côté HTML dans ton exemple) */
#scrollUp {
  background: #000044;
  color: #FFFFFF;
  border-radius: 40px;
  width: 200px;
  font-size: 0.9em;
  padding: 10px;
  text-align: center;
  position: fixed;
  bottom: 50px;
  right: -200px; /* ne pas toucher */
  opacity: 0.5;
  z-index: 100000;
}


/* =========================
   Diaporama / JSSOR
   ========================= */

.item_diapo { background-color: rgba(255,255,255, 0.7); }
.item_diapo:hover { background: rgba(133, 193, 233, 0.7); }

.item_diapo01,
.item_diapo42,
.item_diapo69 { background-color: rgba(255,255,255, 0.7); }

.item_diapo01:hover { background-color: rgba(200,200,255, 0.7); }
.item_diapo42:hover { background-color: rgba(255,255,255, 0.7); }
.item_diapo69:hover { background-color: rgba(255,255,255, 0.7); }

/* jssor slider loading skin double-tail-spin css */
.jssorl-004-double-tail-spin img {
  animation-name: jssorl-004-double-tail-spin;
  animation-duration: 1.6s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes jssorl-004-double-tail-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* jssor slider bullet skin 031 css */
.jssorb031 { position: absolute; }
.jssorb031 .i { position: absolute; cursor: pointer; }
.jssorb031 .i .b { fill: #000; fill-opacity: 0.6; stroke: #fff; stroke-width: 1600; stroke-miterlimit: 10; stroke-opacity: 0.8; }
.jssorb031 .i:hover .b { fill: #fff; fill-opacity: 1; stroke: #000; stroke-opacity: 1; }
.jssorb031 .iav .b { fill: #fff; stroke: #000; stroke-width: 1600; fill-opacity: .6; }
.jssorb031 .i.idn { opacity: .3; }

/* jssor slider arrow skin 073 css */
.jssora073 { display: block; position: absolute; cursor: pointer; }
.jssora073 .a { fill: #ddd; fill-opacity: .7; stroke: #000; stroke-width: 160; stroke-miterlimit: 10; stroke-opacity: .3; }
.jssora073:hover { opacity: .8; }
.jssora073.jssora073dn { opacity: .4; }
.jssora073.jssora073ds { opacity: .3; pointer-events: none; }


/* =========================
   Responsive tweaks
   ========================= */

@media only screen and (max-width: 860px) {
  #wrap { overflow: hidden; }
  .page { padding: 5px; }
}