/*  FONTS IMPORTS */
@font-face {
    font-family: 'DIN Pro';
    src: url('../fonts/DINPro-Light.woff2') format('woff2'),
    url('../fonts/DINPro-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DIN Pro Cond';
    src: url('../fonts/DINPro-CondensedLight.woff2') format('woff2'),
    url('../fonts/DINPro-CondensedLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DIN Pro';
    src: url('../fonts/DINPro-Bold.woff2') format('woff2'),
    url('../fonts/DINPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DIN Pro Cond';
    src: url('../fonts/DINPro-CondensedRegular.woff2') format('woff2'),
    url('../fonts/DINPro-CondensedRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DIN Pro';
    src: url('../fonts/DINPro.woff2') format('woff2'),
    url('../fonts/DINPro.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'DIN Pro Cond';
    src: url('../fonts/DINPro-CondensedBold.woff2') format('woff2'),
    url('../fonts/DINPro-CondensedBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

*{ font-family: 'DIN Pro', sans-serif; margin: 0; padding: 0;}
a:hover { text-decoration: none; }



/* ---------- Global ----------- */
.container{ max-width: 1640px; }
#header__separate { height: 10px; width: 100%; border: 0; }
#search__button { border-radius: 50px; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center}
#block-subtheme-main-menu {flex-grow: 3;}
#footer__bar{ height: 10px; border: 0}
#footer__logo{ height:40px}
#footer__text{ margin: 10px 0; text-align: center}
.navbar-dark .navbar-toggler-icon{ background-image: url("../fonts/menu.svg") }
#container_navbar{ display: flex; flex-direction: column; align-items: start}
#block-logofacebook{margin: 13px 15px 0;}
#CollapsingNavbar{justify-content: space-between; width: 100%}
.breadcrumb-item a { text-transform: uppercase; font-family: 'DIN Pro Cond', sans-serif; opacity: .5; font-size: 1.25rem}
.breadcrumb-item .active { opacity: 1}
.breadcrumb { border-radius: 0 }
h1, h1 * { font-family: 'DIN Pro Cond', sans-serif; text-transform: uppercase; font-size: 4rem }
.page-title-separate { width: 100px; height: 1px; border: 0; }
.pagination { display: flex; justify-content: center}
.page-link { padding: 5px 30px }
.card-header * {font-family: 'DIN Pro Cond', sans-serif; font-size: 1.25rem}
table ul, .node__content ul, table ol, .node__content ol  {padding-left: 40px}
/* ---------- Barre de navigation ----------- */
.menu--main .nav-link { text-transform: uppercase; font-family: 'DIN Pro Cond', sans-serif; font-weight: 300; font-size: 1.5rem; transition: .4s; cursor: pointer;}
@media (max-width:575px) {
  .menu--main .nav-link {width: 80%;}
}
.menu--main .nav-item::after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 17px;
    margin-left: 15px;
}
.menu--main .nav-item::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 17px;
    margin-right: 15px;
}
.menu--main .nav-item { display: flex; align-items: center;flex-wrap: wrap;}
.menu--main .nav-link:hover { transition: .4s }
.menu--main .dropdown-menu { margin: 0; border: 0; border-radius: 0; top: 52px; left: 16px; }
.menu--main .dropdown-item a{ font-family: 'DIN Pro Cond', sans-serif ; font-size: 1.5rem;}
.menu--main .dropdown-item.active a { font-weight: bold; font-family: 'DIN Pro Cond', sans-serif; font-size: 1.5rem;}


/* ---------- Page d'accueil ----------- */
/* ------ Carousel Toute l'info ------ */
#carousel_toute_linfo img { width: 100%; height: 450px; object-fit: cover}
#carousel_toute_linfo  { position: relative}
#carousel_toute_linfo .block__title { position: absolute; left: 2rem; top: 2rem; display: flex; justify-content: center; align-items: center; padding: 5px 10px; z-index: 10; font-size: 1.25rem; text-transform: uppercase; font-weight: bold}
#carousel_toute_linfo h3 { font-size: 1.25rem; font-weight: bold}
#carousel_toute_linfo .pagination { margin-top: 18px; border-radius: 0; display: flex; justify-content: space-between; align-items: center }
#carousel_toute_linfo .pagination ol { display: flex; align-items: center; margin: 0; position: unset}
#carousel_toute_linfo .pagination li { text-indent:0; cursor: pointer; display: flex; justify-content: center; align-items: center; width: 30px; height:30px; border-radius: 30px; margin: 5px; font-weight: bold; transition: .4s}
#carousel_toute_linfo .pagination li:hover { transition: .4s }
#carousel_toute_linfo .pagination ol .active { transition: .4s }


/* ------ Carousel Actualités ------ */
#carousel_actualite  {  height: 508px }
#carousel_actualite-js {height: 450px }
 #carousel_actualite .block__title { position: absolute; left: 2rem; top: 2rem; display: flex; justify-content: center; align-items: center; padding: 5px 10px; z-index: 10; font-size: 1.25rem; text-transform: uppercase; font-weight: bold}
#carousel_actualite-js {padding-top: 3rem; box-sizing: border-box}
#carousel_actualite-js .swiper-wrapper { box-sizing: border-box; padding: 2rem}
#carousel_actualite h3 { font-size: 1.25rem; font-weight: bold}
#carousel_actualite .pagination { margin-top: 18px;  display: flex; justify-content: space-between; align-items: center; height: 40px }
#carousel_actualite i { font-size: 2rem;}

/* ------ Bloc Accueil ------ */
.bloc_accueil-item{ height: 240px; display: flex; justify-content: center; align-items: center; flex-direction: column }
.bloc_accueil-item span{ font-size: 5rem;  }
.bloc_accueil-item h3{ text-transform: uppercase; font-size: 1.25rem; font-weight: bold}

/* ------ Bloc Agenda ------ */
#home_calendar{ height: 240px; width: 100%; box-sizing: border-box }
#home_calendar .block__title{ font-size: 1.25rem;text-transform: uppercase;padding: 5px 0;text-align: center;font-weight: bold; }
#home_calendar-date{ display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%}
#home_calendar-date-day{font-size: 1.5rem; text-transform: uppercase; margin-bottom: 0}
#home_calendar-date-day-number{font-size: 3.5rem; text-transform: uppercase; margin-bottom: 0; font-weight: bold}
#home_calendar-date-month{font-size: 1.5rem; text-transform: uppercase; margin-bottom: 0}

/* ------ Bloc Actualites ------ */
.bloc_accueil_actualite-item{display: flex; justify-content: center; align-items: center}
.bloc_accueil_actualite-item h4{font-size: 1.25rem; text-align: center; font-weight: bold; margin-top: 20px}
.bloc_accueil_actualite-item img{width: 100%; object-fit: cover; height: 250px;}


/* ---------- Page Toute l'Info ----------- */
.page_toute_l_info-item{display: flex; justify-content: center; align-items: center; max-height: 100%}
.page_toute_l_info-item h4{font-size: 1.25rem; text-align: center; font-weight: bold; margin-top: 20px}
.page_toute_l_info-item img{ object-fit: cover; height: 250px;width: 100%;}
.page_toute_l_info-item p{ text-align: center;}
.page_toute_l_info-item .more__link{text-align: center}

/* ---------- Page Agenda ----------- */
#page_agenda-filters ul{display: flex; justify-content: start; align-items: center; list-style-type: none; font-weight: bold; }
#page_agenda-filters li a{padding: 10px 20px; margin-right: 10px; margin-top: 20px; text-transform: uppercase;  font-family: 'DIN Pro Cond', sans-serif ; font-size: 1.25rem;}
.page_agenda-item{display: flex; justify-content: center; align-items: center}
.page_agenda-item h4, .page_agenda-item p>*  {display: block; width: 100%; font-size: 1.25rem; text-align: center;  font-family: 'DIN Pro Cond', sans-serif ; padding: 6px 0; text-transform: uppercase}
.page_agenda-item img{ object-fit: cover; height: 480px; width: 100%;}

#page_agenda-currentDate { display: flex; justify-content: space-between; align-items: center; background-color: var(--light)}
#page_agenda-currentDate-prec {  color: var(--blue)}
#page_agenda-currentDate-next { color: var(--blue)}
#page_agenda-currentDate-text { font-family: 'DIN Pro Cond',sans-serif;font-size: 1.25rem;margin-bottom: 0;color: var(--blue);}


/* ---------- Page Agenda ----------- */
.gallery__item img{width: 100%;height: 150px;object-fit: cover;}
/* Paragraphe Service */
.service-block img {height: 350px;width: 500px;object-fit: cover;margin: 0;}
.info-block {text-align: center}
.info-block h3 {text-transform: uppercase;font-size: 1.5rem}
.info-block h4 {text-transform: uppercase;font-size: 1rem;letter-spacing: -0.5px}
.info-block-titre * {font-family: 'DIN Pro Cond',sans-serif;}
/* Comptes rendu */
#accordion .card-header, #accordion .card {border-radius: 0;}
#accordion .btn {width: 100%;display: flex;justify-content: space-between;text-transform: uppercase;}
/* Annuaire asso */
.association-card-body {max-width: 60%;}
.association-card-titre {max-width: 80%;font-family: 'DIN Pro Cond',sans-serif;}
.association-card-image img {margin: 0;width: 280px;height: 250px;object-fit: cover;}
.association-card-image {width: 50%;display: flex;justify-content: center;align-items: center;}
#annuaire-form input, #annuaire-form select {border-radius: 0;margin: 0;}
#annuaire-form button {border-radius: 0;}
#annuaire-form label {display: none;}
/* Publication */
.bulletin-card-titre {font-family: 'DIN Pro Cond',sans-serif;}
.bulletin-card-image img {height: 174px; max-width: 124px;}
/* Contact */
#contact-info #edit-actions {padding: 0;}
#contact-info button {width: 100%;}
/* ---------- Media Queries ----------- */
/* ------ SM ------ */
@media (max-width: 575px) {
    #carousel_toute_linfo h3 {margin-top: 25px}
    #carousel_toute_linfo .carousel-item { height: 100%;}
    #home_calendar{ height: 420px; width: 100%; box-sizing: border-box }
    #carousel_toute_linfo .carousel-item img { height: 200px;}
    #container_navbar{ display: flex; flex-direction: row; align-items: center}
}

#annuaire-form .js-form-item {
    padding-right: 5px;
    padding-left: 5px;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
}