:root {
  --color-tdf: #FEED01;
  --color-blue: #004A80;
  --color-pink: #ff0068;
  --color-yellow: #fcde01;
  --color-green: #00ff78;
  --color-white: #FFF;
  --color-black: #000;
}

body {
  counter-reset: myCounter;
}

.frame-has-backgroundimage {
  position: relative;
}

.frame-has-backgroundimage>div {
  position: relative;
}

.frame-has-backgroundimage .frame-backgroundimage {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-position: center;
  background-size: cover;
}

.frame-backgroundimage-grayscale {
  filter: grayscale(1);
}

.frame-backgroundimage-fade {
  opacity: 0.2;
}

.frame-backgroundimage-blur {
  filter: blur(5px);
  width: calc(100% + 40px);
  height: calc(100% + 40px);
  top: -20px;
  left: -20px;
}

.frame-backgroundimage-parallax {
  background-attachment: fixed;
  background-repeat: no-repeat;
}

#page-content {
  overflow: hidden;
}

/* Couleurs selon la section */
.site-section-services .entete-title h1::before {
  background-image: url('../img/title-styled-after-tertiary.svg');
}

.site-section-services .bloc-fichiers header::before {
  background-image: url('../img/attachment-black.svg');
  background-color: #fcde01;
}

.site-section-services .bloc-fichiers header .h5 {
  color: #000;
}

.site-section-services .bloc-fichiers .card {
  border-color: #fcde01;
}

.site-section-services .bloc-fichiers .card ul li::before {
  background-image: url('../img/bullet-tertiary.svg');
}

.site-section-loisirs .entete-title h1::before {
  background-image: url('../img/title-styled-after-success.svg');
}

.site-section-loisirs .bloc-fichiers header::before {
  background-image: url('../img/attachment-black.svg');
  background-color: #00ff78;
}

.site-section-loisirs .bloc-fichiers header .h5 {
  color: #000;
}

.site-section-loisirs .bloc-fichiers .card {
  border-color: #00ff78;
}

.site-section-loisirs .bloc-fichiers .card ul li::before {
  background-image: url('../img/bullet-success.svg');
}

/* Background tertiary */
.bg-tertiary {
  background-color: #fcde01;
}

.bg-tertiary .btn-ghost,
.bg-success .btn-ghost {
  border-color: #000;
  color: #000;
}

/* Page les élus */
.elu-chinon figure.image {
  margin-right: 15px;
  margin-bottom: 15px;
  position: relative;
  z-index: 2;
}

.elu-chinon figure.image img {
  position: relative;
  z-index: 2;
}

.elu-chinon figure.image::after {
  content: '';
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
  bottom: -15px;
  right: -15px;
  background-color: #efefef;
}

/* Liste des galeries */
.fs-media-gallery .thumb a {
  text-align: left;
}

.albums-list .thumb,
.fs-media-gallery .thumb-item {
  margin-bottom: 20px;
}

.fs-media-gallery .thumbs-assets {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 30px;
}

.fs-media-gallery .img-thumbnail {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
}

.albums-list .img-thumbnail>a {
  margin-right: 25px;
  margin-bottom: 15px;
  position: relative;
}

.albums-list .img-thumbnail .image img {
  position: relative;
  z-index: 2;
}

.albums-list .img-thumbnail>a::after {
  content: '';
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
  bottom: -15px;
  right: -15px;
  background-color: #EFEFEF;
}

.albums-list a {
  text-decoration: none;
}

.albums-list .description {
  width: 100%;
  margin: 2px 0;
}

.albums-list .name {
  margin-top: 15px;
}

.albums-list .img-responsive {
  position: relative;
  z-index: 4;
}

.thumbs.thumbs-assets {
  margin: 30px 0;
}

@media screen and (max-width: 575px) {
  .albums-list .img-thumbnail {
    flex-direction: column;
    align-items: center;
  }

  .albums-list .description {
    text-align: center;
  }

  .albums-list .name {
    margin-top: 10px;
  }

  .navbar-brand.navbar-brand-image {
    max-width: 240px;
  }
}

/* Bloc documents */
ul.ce-uploads.list-donwloads.file-name-miniature {
  display: flex;
  flex-wrap: wrap;
}

ul.ce-uploads.list-donwloads.file-name-miniature li {
  width: 49%;
  align-items: flex-end;
  padding-right: 1em;
}

ul.ce-uploads.list-donwloads.file-name-miniature li>a {
  flex-shrink: 0;
}

ul.ce-uploads.list-donwloads.file-name-miniature li div {
  flex-direction: column;
  align-items: flex-start;
}

ul.ce-uploads.list-donwloads.file-name-miniature li div::before {
  display: none;
}

ul.ce-uploads.list-donwloads.file-name-miniature li div .ce-uploads-description {
  line-height: 1.15;
}

@media screen and (max-width: 991px) {
  ul.ce-uploads.list-donwloads.file-name-miniature li {
    width: 100%;
  }
}

/* Page carte */
.txMaps2Form .form-group {
  position: relative;
  margin: 10px 0;
}

.txMaps2Form .checkbox {
  /*background-color: #144a8e;*/
  background-color: #FFF;
}

.txMaps2Form .checkbox.not-checked {
  background-color: #FFF;
}

.txMaps2Form .checkbox .map-category::before {
  content: '\f00c';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 1.5rem;
  color: #FFF;
  display: inline-block;
  position: absolute;
  left: -23px;
}

.txMaps2Form .checkbox input[type="checkbox"] {
  opacity: 0;
  top: 4px;
  position: absolute;
  left: -21px;
  z-index: 5
}

.txMaps2Form .checkbox input[type="checkbox"]:checked+.map-category::before {
  color: #144A8E;
}

.txMaps2Form .checkbox label {
  position: absolute;
  margin-left: 25px;
}

/* correction video-embed */
.ce-gallery figure.video {
  display: unset;
}

.ce-gallery figure {
  margin: auto;
}

.ce-gallery .ce-outer figure {
  margin: 0;
}

/* Cartes page portail */
.card-body {
  align-items: center;
}

card-body a {
  width: 100%;
}

.frame-type-tctheme_cardbox .card-body a {
  font-size: 2rem;
}

.frame-type-tctheme_cardbox .card-body {
  padding-left: 15px;
}

@media screen and (min-width: 992px) {
  .frame-type-tctheme_cardbox .card-body a {
    font-size: 2.2rem;
  }
}

/* Page d'accueil */
.card-event a {
  text-decoration: none;
  font-size: 1.8rem;
  font-weight: 700;
}

.hero-header {
  padding: 10px 0;
}

.hero-header_top.container {
  margin: 0 auto;
  padding: 12px;
}

.hero-header_top .form-wrapper input[type='submit'] {
  border: none;
}

.page-home .section-home-demarches-services .btn-ghost {
  min-height: 65px;
  text-transform: uppercase;
}

.publication-home figure {
  box-shadow: 20px 20px #efefef;
  margin-bottom: 20px;
}

.publication-home .ce-gallery {
  margin-bottom: 25px;
}

.publication-home .ce-bodytext a:not(.color-muted) {
  color: #000;
}

.page-home .mrs {
  box-shadow: 20px 20px #efefef;
}

.page-home .mrs .ce-gallery {
  margin: 0;
}

/* Galeries page d'accueil */
.page-home .thumbs.thumbs-assets {
  margin: 0;
}

.page-home .col-8-small-all .thumbs.thumbs-assets {
  justify-content: flex-start;
  margin-top: 15px;
}

@media screen and (min-width: 1200px) {
  .page-home .col-8-small-all .thumb-item {
    margin-right: 31px;
    margin-bottom: 0;
  }
}

/* Slides page d'accueil */
@media (min-width: 992px) {

  .slider-actus [class="1-part-grid"],
  .\31-part-grid {
    grid-template-areas:
      'a a';
  }

  .\32-part-grid .slide_text {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
    width: 290px;
    height: 360px;
    padding: 30px;
    background-color: #144a8e;
  }

  .\32-part-grid .slide-actu img {
    width: 100%;
    opacity: 1;
  }

  .slider-actus [class="2-part-grid"],
  .\32-part-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      'a b';
  }

  .slick-arrow.slick-prev,
  .slick-arrow.slick-next {
    height: 51px;
    background-size: 30px auto;
  }

  .slider-actus .slick-arrow.slick-prev {
    left: -80px;
  }

  .slider-actus .slick-arrow.slick-next {
    right: -80px;
  }

  .slick-dots li {
    width: 7px;
    height: 7px;
  }

  /*.slide-actu .slide_text {
    text-align: left;
  }*/
}

/* Titres  */
h2,
.h2 {
  margin: 28px 0;
}

.h3-styled {
  margin: 30px 0 22px 0
}

.title-styled,
.backendlayout-special h2 {
  margin-top: 30px;
}

/* titre page avec image*/
.entete-large.backgroundimage-container {
  padding: 125px 0px 75px 0px;
}

.entete-large.backgroundimage-container h1.page-title {
  background-color: rgba(241, 241, 241, 0.8);
  padding: 15px 25px;
  margin: 15px 0px;
  float: left;
  min-width: 50%;
}

.breadcrumb-block {
  z-index: 9;
}

@media screen and (max-width: 991px) {
  .entete-large.backgroundimage-container {
    padding: 70px 0;
  }
}

@media screen and (max-width: 767px) {
  .entete-large.backgroundimage-container {
    padding: 28px 0;
  }
}

/* Page Actualités/événement single */
#p168 .news-list-category {
  display: none;
}

.news-img-wrap {
  float: left;
  margin-right: 20px;
}

.news-img-wrap .outer {
  margin-bottom: 15px;
}

/* Agenda */
.agenda .calendar-months {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.agenda .calendar-months .btn:hover,
.agenda .calendar-months .btn:focus {
  background-color: #b4b4b4;
  color: #000;
}

.agenda .calendar-months .btn-precedent:before,
.news-backlink-wrap a::before {
  content: '\f053';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 1.5rem;
  margin-right: 5px;
}

.agenda .calendar-months .btn-suivant:after {
  content: '\f054';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 1.5rem;
  margin-left: 5px;
}

.agenda .event-list + .calendar-months {
  margin-top: 58px;
}

.agenda .badge {
  border-radius: 0;
  margin-right: 8px;
}

.agenda .badge .checkbox {
  box-shadow: none;
}

.agenda .calendar .badge {
  line-height: 0;
  margin-right: 3px;
}

.agenda .calendar {
  border: none;
}

.agenda .calendar th.pager {
  border: none;
}

.calendar-months {
  margin-bottom: 30px;
}

.agenda .checkbox:checked {
  background-color: inherit;
}

.agenda-filters .form-group {
  margin: 12px 0;
  background: #f1f1f1;
  padding: 10px 20px;
}

.agenda-filters .form-group input[type="date"] {
  padding-left: 2px;
}

.agenda-filters .form-group label {
  font-weight: 700;
}

.calendar-months h3 {
  text-transform: capitalize;
  color: #144a8e;
  font-weight: 700;
}

.event-list_card {
  background-color: #f1f1f1;
  box-shadow: 20px 20px #ddd;
}

.event-list_card::after {
  display: none;
}

.event-list_card .news-text a:hover,
.event-list_card .news-text a:focus {
  text-decoration: none;
}

.event-list_card .news-category,
.news.news-single .news-category {
  display: inline-block;
  margin-right: 5px;
  padding: 3px 7px;
  font-weight: 700;
  color: #FFF;
  background-color: #a1a1a1;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}

.news.news-single .news-category {
  margin: 0 5px;
}

.event-list_card .news-category.category-2,
.news.news-single .news-category.category-2 {
  display: none;
}

/*.event-list_card .news-category.category-3 {
  background-color: #fdd93d;
  color: #000;
}

.event-list_card .news-category.category-4 {
  background-color: #a23df8;
}

.event-list_card .news-category.category-5 {
  background-color: #00fdf9;
  color: #000;
}

.event-list_card .news-category.category-18 {
  background-color: #00fa83;
}

.event-list_card .news-category.category-7 {
  background-color: #fe5b30;
}

.event-list_card .news-category.category-9 {
  background-color: #004f8b;
}

.event-list_card .news-category.category-12 {
  background-color: #fe1c68;
}*/
.event-list_card .news-category.category-20,
.news.news-single .news-category.category-20 {
  color: #333300;
}

.event-list .categories {
  padding-top: 10px;
}

/* Agenda en page d'accueil */
.events-container .enventStart small,
.events-container .enventEnd small {
  font-size: 1.2rem;
}

@media screen and (max-width: 576px) {
  .agenda .calendar-months {
    flex-wrap: wrap;
  }

  .agenda .calendar-months .btn {
    font-size: 1.4rem;
    flex-basis: 49%;
  }

  .agenda .calendar-months .btn-precedent {
    order: 2;
  }

  .agenda .calendar-months .btn-suivant {
    order: 3;
  }

  .agenda .calendar-months h3 {
    order: 1;
    width: 100%;
    text-align: center;
  }

  .event-list_card .news-text {
    padding-left: 0;
  }
}

.position-ab-small {
  bottom: 0;
  right: 70px
}

.debit-boisson table td {
  border: 4px solid #d1d1d1;
}

.color-muted {
  color: #959595;
}

/*home galerie d'image*/
.page-home .fs-media-gallery .pagination {
  display: none;
}

/* container flex */
.frame-type-tctheme_containerflex .container-flex {
  justify-content: flex-start;
}

.frame-type-tctheme_containerflex .container-flex .frame-type-tctheme_cardbox {
  width: calc(33% - 20px);
  margin-left: 10px;
  margin-right: 10px;
}

@media screen and (max-width: 991px) {
  .frame-type-tctheme_containerflex .container-flex .frame-type-tctheme_cardbox {
    width: calc(50% - 20px);
  }
}

@media screen and (max-width: 767px) {
  .frame-type-tctheme_containerflex .container-flex .frame-type-tctheme_cardbox {
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
  }
}

/******
 retouche menu
TODO : finir=> defillement ecran petite hauteur + :before :after diagonal pour faciliter navigation + différenciation style :hover .hover et .active(item de menu ou on est sur le site => js a corriger) + 2ème ligne second nievau non aligné/ integrer au gulp
*******/
/*faciliter navigation attention ça pete les chevrons */
.mega-navigation a {
  line-height: 1.8;
}

.mega-navigation-link,
.sub-navigation-link {
  position: relative;
}

@keyframes subnavHoverHelp {
  0% {
    height: 100%;
  }

  99% {
    height: 100%;
  }

  100% {
    height: 0;
  }
}

.mega-navigation-link:hover::before,
.mega-navigation-link:hover::after,
.sub-navigation-link:hover::before,
.sub-navigation-link:hover::after {
  content: "";
  position: absolute;
  z-index: 1000;
  right: 0;
  width: 80%;
  animation: subnavHoverHelp 1.5s;
  /*background-color: #FFF*/
}

/* .mega-navigation-link:hover::before,
.sub-navigation-link:hover::before {
  top: -100%;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

.mega-navigation-link:hover::after,
.sub-navigation-link:hover::after {
  bottom: -100%;
  clip-path: polygon(0 0, 100% 0%, 100% 100%);
} */

/* différenciation style :hover et .active (attention js à corriger )*/
.navigation-wrapper .navigation-list .mega-navigation-link.active,
.navigation-wrapper .navigation-list .sub-navigation-link.active {
  border: none;
  background-color: rgba(0, 0, 0, 0.1)
}

/* li.site-section-mairie {
  color: white
} */

.navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link {
  color: white
}

.navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link:hover,
.navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link:focus,
.navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link.jshover,
.navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-link.jshover {
  color: black
}

.navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link.active:hover,
.navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link.active:focus {
  background-color: #FFF;
  color: #000;
}

.navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item a {
  color: white
}

.navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item a:hover,
.navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item a:focus {
  color: black
}

/* test à retirer à terme*/
.site-section-mairie header.header-wrapper.backgroundimage-container {
  height: auto
}

/*fin test à retirer */
.navigation-wrapper .navigation-list .mega-navigation-item.has-children::after,
.navigation-wrapper .navigation-list .sub-navigation-item.has-children::after {
  display: none;
}

@media (min-width: 992px) {
  .navigation-wrapper .navigation-list .mega-navigation .mega-navigation-inner {
    min-height: 370px;
  }

  .navigation-wrapper .navigation-list .mega-navigation {
    background-color: rgba(0, 0, 0, 0);
  }

  .navigation-wrapper .navigation-list .sub-navigation-list {
    min-height: 220px;
  }

  /* Chevron sur les items de menu avec des enfants */
  /*.navigation-wrapper .navigation-list .mega-navigation-item.has-children::after,
  .navigation-wrapper .navigation-list .sub-navigation-item.has-children::after {
    position: absolute;
    right: 9px;
    margin-top: -31px;
    font-family: 'Font Awesome 5 Free';
    font-size: 1.6rem;
    font-weight: 900;
    display: inline-block;
    content: '\f054';
    color: rgba(0, 0, 0, 1);
  }

  .navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-item.has-children::after,
  .navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item.has-children::after {
    color: #FFF;
  }
  .navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-item.has-children:hover::after,
  .navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item.has-children:hover::after {
    color: #000;
  }

  On retire les chevrons ne bg image car ils ont été ajoutés dans le template

  .navigation-wrapper .navigation-list .mega-navigation-item.has-children>a,
  .navigation-wrapper .navigation-list .sub-navigation-item.has-children>a {
    background-image: url('../img/chevron-right-black.svg');
    background-position: center right 10px;
    background-repeat: no-repeat;
    background-size: 10px auto;
  }

  .navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-item.has-children>a,
  .navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item.has-children>a {
    background-image: url('../img/chevron-right-white.svg');
  }

  .navigation-wrapper .navigation-list li .mega-navigation-item.has-children>.mega-navigation-link.hover,
  .navigation-wrapper .navigation-list li.site-section-mairie>.mega-navigation-link.hover {
    background-color: #FFF;
    color: #000;
    background-image: url('../img/chevron-right-black.svg');
  }

  .navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-item.has-children>a:hover,
  .navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item.has-children>a:hover,
  .navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-item.has-children>a.jshover,
  .navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item.has-children>a.jshover {
    background-image: url('../img/chevron-right-black.svg');
  } */

  header .site-header.is-fixed .navigation-wrapper .navigation.container {
    padding-right: 0;
  }

  .navigation-wrapper .navigation-list .mega-navigation-link::after {
    display: none;
  }
}

/* Menu mobile */
@media screen and (max-width: 991px) {

  .navigation-wrapper nav.navigation.is-opened>.navigation-list .mega-navigation-list .mega-navigation-item .mega-navigation-link,
  .navigation-wrapper nav.navigation.is-opened>.navigation-list .mega-navigation-list .sub-navigation-list a {
    text-align: left;
  }

  .hero-header .navigation-wrapper nav.navigation>.navigation-list .navigation-item>span.fa-chevron-right {
    display: none;
  }

  .navigation-wrapper nav.navigation.is-opened>.navigation-list .navigation-item>span.fa-chevron-right {
    background-color: rgba(255, 255, 255, 0.1);
    height: 38px;
    width: 38px;
  }

  .navigation-wrapper nav.navigation.is-opened>.navigation-list .site-section-mairie>span.fa-chevron-right {
    border-left: 2px solid #ff0068;
  }

  .navigation-wrapper nav.navigation.is-opened>.navigation-list .site-section-services>span.fa-chevron-right {
    border-left: 2px solid #fcde01;
  }

  .navigation-wrapper nav.navigation.is-opened>.navigation-list .site-section-loisirs>span.fa-chevron-right {
    border-left: 2px solid #00ff78;
  }

  .hero-header_top.container {
    position: absolute;
    top: 15px;
  }

  .hero-header_bottom {
    padding-top: 20px;
  }

  .right-header_languages, .hero-header_languages, .header_languages {
    margin-left: 0;
    border: none;
  }
}

/* Menu quand hauteur d'écran trop faible */
@media screen and (max-height: 702px) and (min-width: 992px) {
  .navigation-wrapper .navigation-list .sub-navigation-item a {
    line-height: 1.3;
  }

  .navigation-wrapper .navigation-list .mega-navigation-link {
    line-height: 1.5;
  }

  .navigation-wrapper .navigation-list .mega-navigation-item.has-children::after,
  .navigation-wrapper .navigation-list .sub-navigation-item.has-children::after {
    margin-top: -28px;
  }

  .navigation-wrapper .navigation-list .mega-navigation .mega-navigation-title {
    padding-top: 12px;
  }

  .navigation-wrapper .h1 {
    font-size: 3.8rem;
  }
}

/* 
Modification du menu au clic 
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (min-width: 992px) {
  .navigation-wrapper .navigation-list .mega-navigation .mega-navigation-list {
    height: 100%;
  }
  .navigation-wrapper .sub-navigation-wrapper {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;

    width: 200%;
    height: 100%;

    padding-right: 100%;

    overflow-y: scroll;
  }

  /* width */
  .navigation-wrapper .sub-navigation-wrapper::-webkit-scrollbar {
    width: 10px;
  }

  /* Track */
  .navigation-wrapper .sub-navigation-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1;
  }

  /* Handle */
  .navigation-wrapper .sub-navigation-wrapper::-webkit-scrollbar-thumb {
    background: #888;
  }

  /* Handle on hover */
  .navigation-wrapper .sub-navigation-wrapper::-webkit-scrollbar-thumb:hover {
    background: #555;
  }

  /* Scrollbar sous-menu "Mairie" (rose) */
  .navigation-wrapper .site-section-mairie .sub-navigation-wrapper::-webkit-scrollbar-track {
    background: #ff66a4;
  }

  /* Handle */
  .navigation-wrapper .site-section-mairie .sub-navigation-wrapper::-webkit-scrollbar-thumb {
    background: #e6005e;
  }

  /* Handle on hover */
  .navigation-wrapper .site-section-mairie .sub-navigation-wrapper::-webkit-scrollbar-thumb:hover {
    background: #cc0053;
  }

  /* Scrollbar sous-menu "Services" (jaune) */
  .navigation-wrapper .site-section-services .sub-navigation-wrapper::-webkit-scrollbar-track {
    background: #fdf199;
  }

  /* Handle */
  .navigation-wrapper .site-section-services .sub-navigation-wrapper::-webkit-scrollbar-thumb {
    background: #e3c801;
  }

  /* Handle on hover */
  .navigation-wrapper .site-section-services .sub-navigation-wrapper::-webkit-scrollbar-thumb:hover {
    background: #c9b101;
  }

  /* Scrollbar sous-menu "Loisirs" (vert) */
  .navigation-wrapper .site-section-loisirs .sub-navigation-wrapper::-webkit-scrollbar-track {
    background: #7fffbb;
  }

  /* Handle */
  .navigation-wrapper .site-section-loisirs .sub-navigation-wrapper::-webkit-scrollbar-thumb {
    background: #00e66c;
  }

  /* Handle on hover */
  .navigation-wrapper .site-section-loisirs .sub-navigation-wrapper::-webkit-scrollbar-thumb:hover {
    background: #00cc60;
  }

  .navigation-wrapper .sub-navigation-wrapper.sub-navigation-wrapper--active {
    display: block;
  }

  .navigation-wrapper .mega-navigation-item.has-children,
  .navigation-wrapper .sub-navigation-item.has-children {
    display: flex;
  }

  .navigation-wrapper .mega-navigation-item.has-children > a,
  .navigation-wrapper .sub-navigation-item.has-children > a {
    flex-grow: 1;
  }

  .navigation-wrapper .mega-navigation-toggler,
  .navigation-wrapper .sub-navigation-toggler {
    flex-shrink: 0;

    width: 38px;
    height: 38px;

    padding: 9px;

    background-color: rgba(0,0,0,0);
    color: var(--color-black);
    border: 1px solid var(--color-black);
  }
  .navigation-wrapper .mega-navigation-toggler:focus,
  .navigation-wrapper .sub-navigation-toggler:focus,
  .navigation-wrapper .mega-navigation-link.mega-navigation-link--opened + .mega-navigation-toggler:focus,
  .navigation-wrapper .sub-navigation-link.sub-navigation-link--opened + .sub-navigation-toggler:focus {
    background-color: var(--color-black);
    color: var(--color-white);
  }

  .navigation-wrapper .site-section-mairie .mega-navigation-toggler, 
  .navigation-wrapper .site-section-mairie .sub-navigation-toggler {
    color: var(--color-white);
    border: 1px solid var(--color-white);
  }

  .navigation-wrapper .mega-navigation-link:hover + .mega-navigation-toggler,
  .navigation-wrapper .mega-navigation-link.mega-navigation-link--opened + .mega-navigation-toggler,
  .navigation-wrapper .sub-navigation-link.sub-navigation-link--opened + .sub-navigation-toggler {
    background-color: var(--color-white);
    color: var(--color-black);
  }

  /* Etat des sous-menus par dafault (masqués) */
  .navigation-wrapper .sub-navigation-list {
    display: none;
  }

  /* 2ème niveau ouvert */
  .navigation-wrapper .mega-navigation-link.mega-navigation-link--opened,
  .navigation-wrapper .navigation-list li.site-section-mairie .mega-navigation-link.mega-navigation-link--opened {
    background-color: var(--color-white);
    color: var(--color-black);
  }
  /* 3ème / 4ème niveau ouvert */
  .navigation-wrapper .sub-navigation-link.sub-navigation-link--opened,
  .navigation-wrapper .navigation-list li.site-section-mairie .sub-navigation-item a.sub-navigation-link--opened {
    background-color: var(--color-white);
    color: var(--color-black);
  }

  .navigation-wrapper .sub-navigation-wrapper.sub-navigation-wrapper--active > .sub-navigation-list {
    display: block;
    position: static;

    height: 100%;
  }

  .navigation-wrapper .sub-navigation-list.sub-navigation-list--active {
    display: block;
    /* top: 0; */
  }

  .navigation-wrapper .navigation-list .sub-navigation-link--opened ~ .sub-navigation-list, 
  .navigation-wrapper .navigation-list .sub-navigation-link--opened ~ .sub-navigation-list {
    left: 100%;
    display: block;

    width: 100%;
    height: auto;
    /* min-height: 300%; */

    margin-left: 0;
  }
  /* 4ème niveau de menu */
  .navigation-wrapper .sub-navigation-item.has-children {
    position: relative;
  }
  .navigation-wrapper .sub-navigation-wrapper .sub-navigation-wrapper.sub-navigation-wrapper--active {

    left: 100%;
    width: 100%;
    height: auto;

    padding: 0;

    overflow: visible;
  }

}

/* .navigation-wrapper .navigation-list .sub-navigation-list:hover */

/* Recherche */
.tx-indexedsearch-res {
  margin: 37px 0;
  padding-bottom: 37px;
}

.tx-indexedsearch-title.test {
  margin: 30px 0;
}

.tx-indexedsearch-title.test a {
  text-decoration: none;
  color: #000;
}

.tx-indexedsearch-searchbox fieldset legend {
  display: none;
}

.tx-indexedsearch-sectionlinks table td {
  border: none;
}

.tx-indexedsearch-sectionlinks table a {
  display: inline-block;
  color: #000;
  background-color: #efefef;
  font-size: 1.5rem;
  text-decoration: none;
  padding: 10px 15px;
  margin: 0 10px;
}

.tx-indexedsearch-sectionlinks table a:hover,
.tx-indexedsearch-sectionlinks table a:focus {
  background-color: #ddd;
}

.tx-indexedsearch-sectionlinks {
  margin-bottom: 40px;
}

.tx-indexedsearch-sectionlinks table tr {
  display: inline-block;
}

.tx-indexedsearch-redMarkup {
  background-color: #FFE100;
}

.tx-indexedsearch-info {
  font-size: 1.5rem;
}

.tx-indexedsearch-searchbox input[type='text'] {
  margin-bottom: 0;
}

.tx-indexedsearch-searchbox fieldset {
  margin: 0;
}

.tx-indexedsearch-sectionlinks+.tx-indexedsearch-browsebox {
  display: none;
}

.tx-indexedsearch-searchbox {
  background-color: #f8f8f8;
  padding: 15px;
}

tx-indexedsearch-res .tx-indexedsearch-title a {
  text-decoration: none;
}

.tx-indexedsearch-browsebox ul li::after {
  content: '|';
  margin-left: 9px;
  color: #989898;
}

.tx-indexedsearch-browsebox ul li:last-of-type::after {
  display: none;
}

@media screen and (min-width: 768px) {

  /*#tx_indexedsearch .tx-indexedsearch-form {
    width: 50%;
  }*/
  .tx-indexedsearch-searchbox fieldset {
    margin: 0 auto;
    width: 750px;
  }
}

/* Encart contact */
.encart-contact h4 {
  margin: 30px 0;
}

.encart-contact h2 {
  font-size: 2.2rem;
}

.encart-contact .btn-ghost {
  padding: 15px;
}

/* Type de contenu : section index */
.frame-type-menu_section ul {
  list-style-type: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}

.frame-type-menu_section .frame-container>ul>li>a {
  display: none;
}

.frame-type-menu_section .frame-container a {
  display: inline-block;
  padding: 10px 14px;
  margin: 10px 8px;
  background-color: #144a8e;
  border: 2px solid #144a8e;
  color: #FFF;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 200ms ease-out;
}

.frame-type-menu_section .frame-container a:hover,
.frame-type-menu_section .frame-container a:focus {
  background-color: #FFF;
  color: #144a8e;
}

/* Blocs pièces à fournir */
.bloc-fichiers .card {
  min-width: 100%;
}

.bloc-fichiers {
  width: 100%;
}

@media screen and (min-width: 1200px) {
  .bloc-fichiers .card {
    min-width: 750px;
  }
}

/* Modifs header */
.entete p {
  line-height: 1.2;
  margin: 3px 0;
}

@media screen and (min-width: 992px) {
  .entete p {
    font-size: 2rem;
  }
}

/* Modifs footer*/
footer .half-container figure {
  width: 240px;
}

footer form textarea {
  font-size: 1.6rem;
  margin: 10px 0;
}

footer form [type="text"] {
  font-size: 1.6rem;
  padding-left: 2px;
}

footer form {
  margin-top: 7px;
}

footer .ce-bodytext p {
  margin: 2px 0;
  font-size: 1.6rem;
}

footer form input[type='text'] {
  margin-bottom: 5px;
}

footer h3 {
  margin-top: 0;
}

.footer-2 p {
  margin: 0;
}

footer form [type='submit'] {
  padding: 5px 25px;
  font-size: 1.5rem;
}

@media screen and (min-width: 768px) {
  footer form .btn-group {
    text-align: left;
  }
}

@media screen and (min-width: 992px) {
  footer .footer-2 .menu-bottom-footer {
    margin-top: 3px;
  }

  /*.half-container.right {
    padding: 4rem 8.5rem;
  }*/
}

/* Actualités et événement single */
.article .news-category.category-1 {
  display: inline-block;
  background: #e2e2e2;
  padding: 1px 8px;
  margin-left: 5px;
}

.news.news-single .news-list-date {
  font-weight: 700;
}

.news.news-single .footer {
  margin-bottom: 30px;
}

.news-backlink-wrap a {
  display: inline-block;
  padding: 10px 18px;
  background-color: #efefef;
  color: #000;
  text-decoration: none;
}

.news-backlink-wrap a:hover,
.news-backlink-wrap a:focus {
  background-color: #ddd;
}

.news.news-single .news-img-wrap {
  position: relative;
  top: -0;
  float: none;
}

.news.news-single .news-img-wrap .mediaelement-image {
  text-align: center;
}

@media screen and (min-width: 768px) {
  .news.news-single .news-img-wrap {
    top: -100px;
    float: right;
    margin-left: 50px;
  }

  .news.news-single .footer,
  .news.news-single .header {
    width: calc(100% - 350px);
  }
}

/* ::::::::::::::::::::::::::::::::::
A enlever après configuration des langues :::::::::::::::::::::*/
.header_languages span:not(.active),
.header_languages span::after {
  display: none;
}

/* Bannière information en haut de page */
#header.with-banner,
.enentete-container.with-banner {
  transition: transform 100ms ease-in;
}
.entete-container.with-banner .breadcrumb-block {
  position: relative;
}
.entete-container.with-banner .breadcrumb-block::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 0;

  width: 100%;
  height: 160px;

  background-color: rgba(241, 241, 241, .8);
}
.frame-type-tctheme_banner {
  position: fixed;
  z-index: 989;
  top: 0;
  left: 0;
  width: 100%;

  transform: translateY(0px);
  transition: transform 100ms ease-in;
}

.frame-type-tctheme_banner .frame-container {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
}

.frame-tctheme_banner--content {
  max-width: 87.5%;
  padding: 20px 0 3px 0;

  text-align: left;
  font-size: 1.4rem;
}
.frame-tctheme_banner--content .link-readmore{
  text-align: right;
  font-style: italic;
}

@media screen and (min-width: 1200px) {
  .frame-tctheme_banner--content {
    max-width: 800px;
    padding: 25px 5px 5px 30px;

    font-size: 1.6rem;
  }
}

@media screen and (min-width: 576px) {
  .frame-type-tctheme_banner .title-styled {
    margin-bottom: 55px;
  }
}

#page-content{
  .frame-type-form_formframework{
    form{
      display: flex;
      align-items: center;
      justify-content: center;
      *{
        margin-right: 1em;
      }
    }
  }
}

/* Accordéons */

.accordion-toggle {
  background-color: #eee;
  border: none;
  cursor: pointer;
  padding: 15px;
  width: 100%;
  text-align: left;
  outline: none;
  font-size: 16px;
  transition: background-color 0.3s;
}

.accordion-toggle:hover {
  background-color: #ccc;
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  background-color: #f9f9f9;
  padding: 0 15px;
}
.accordion-content.open {
  padding: 15px;
}

.thumbs-albums .card-body a {
  gap: 10px;
}

.thumbs-albums span.card-img-icon {
  flex-shrink: 0;
}

/* 
Tour de France 
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */


/* HEADER :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
.navigation .navigation-item.site-section-tourfrance .navigation-link {
  background-color: var(--color-tdf) !important;
  color: #000 !important;
  border: 2px solid #fff;
}
.site-section-tourfrance .entete-title h1::before {
  background-image: url('../img/title-styled-after-black.svg');
}

.site-section-tourfrance .bloc-fichiers header::before {
  background-image: url('../img/attachment-black.svg');
  background-color: #fcde01;
}

.site-section-tourfrance .bloc-fichiers header .h5 {
  color: #000;
}

.site-section-tourfrance .bloc-fichiers .card {
  border-color: #fcde01;
}

.site-section-tourfrance .bloc-fichiers .card ul li::before {
  background-image: url('../img/bullet-tertiary.svg');
}

.site-section-tourfrance .entete-large.backgroundimage-container h1.page-title {
  background-color: var(--color-tdf);
}

.site-section-tourfrance .entete-title h1 {
  color: #000;
}

/* CONTENUS PAGE TYPE :::::::::::::::::::::::::::::::::::::::::::: */
.site-section-tourfrance .bg-tertiary {
  background-color: var(--color-tdf);
}

.site-section-tourfrance .content-main .frame-type-menu_section ul {
  flex-direction: column;
}

/* .site-section-tourfrance .content-main .frame-type-menu_section ul ul {
  counter-increment: myCounter;
} */

.site-section-tourfrance .content-main .frame-type-menu_section ul ul li::before {
  counter-increment: myCounter;
  content: counter(myCounter) ". ";

  font-weight: 700;
  color: var(--color-blue);
}
.site-section-tourfrance .content-main .frame-type-menu_section ul li + li {
  margin-top: 16px;
}
.site-section-tourfrance .content-main .frame-type-menu_section ul a {
  background-color: rgba(0, 0, 0, 0);
  color: var(--color-blue);
  border: none;

  padding: 0;
  margin: 0;

  text-transform: none;
  font-weight: 700;
}

.site-section-tourfrance .content-main .frame-type-menu_section ul a:hover {
  text-decoration: underline;
}

.site-section-tourfrance .card-event_date::after {
  background-color: var(--color-tdf);
}

.site-section-tourfrance .frame-type-tctheme_cardbox .card.bg-gray-dark {
  background-color: #000;
}

.site-section-tourfrance .accordion .frame-container h3 {
  position: relative;

  font-size: 1.8rem;
  font-weight: 700;

  padding: 22px 55px 22px 22px;
  margin: 0;

  background-color: #000;
  color: var(--color-tdf);

  cursor: pointer;

  transition: background-color 150ms ease-in, color 150ms ease-in;
}

.site-section-tourfrance .accordion .frame-container h3::after {
  content: '';
  position: absolute;
  top: calc(50% - 14px);
  right: 22px;

  width: 16px;
  height: 28px;

  background-image: url('../img/chevron-left-tdf.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 32px auto;

  transition: transform 100ms ease-in;
}

.site-section-tourfrance .accordion .frame-container h3:hover::after {
  filter: invert(1) grayscale(1);
}

.site-section-tourfrance .accordion .frame-container h3.open::after {
  transform: rotate(90deg);
  filter: invert(1) grayscale(1);

  transition: transform 100ms ease-in;
}

.site-section-tourfrance .accordion .frame-container h3:hover,
.site-section-tourfrance .accordion .frame-container h3.open {
  background-color: var(--color-tdf);
  color: #000;

  transition: background-color 150ms ease-in, color 150ms ease-in;
}

.site-section-tourfrance .accordion .frame-container .container-frame {
  background-color: var(--color-tdf);
  color: #000;

  padding: 0 22px;

  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.site-section-tourfrance .accordion .frame-container .container-frame.open {
  padding: 6px 20px 20px 20px;
  height: auto;
}

@media screen and (min-width: 992px) {
  .site-section-tourfrance .accordion .frame-container .container-frame.open {
    padding: 6px 22px 32px 22px;
  }
  .site-section-tourfrance .accordion .frame-container h3 {
    padding: 30px 55px 30px 22px;
  }
}

.site-section-tourfrance .accordion .frame-type-tctheme_cardbox .card {
  display: flex;
  flex-direction: row;
}

.site-section-tourfrance .accordion .frame-type-tctheme_cardbox .card .card-header {
  width: 43%;
  flex-shrink: 0;
}

.site-section-tourfrance .accordion .frame-type-tctheme_cardbox .card .card-body a {
  gap: 10px;
}
/* MENU DESKTOP :::::::::::::::::::::::::::::::::::::::::::::::::: */

@media screen and (min-width: 768px) {
  header.header-wrapper.backgroundimage-container .hero-header .navigation-wrapper nav.navigation {
    width: 752px;
  }
}
@media screen and (min-width: 992px) {
  header.header-wrapper.backgroundimage-container .hero-header .navigation-wrapper nav.navigation {
    width: 792px;
  }
  .navigation-wrapper .navigation-list .site-section-tourfrance .navigation-link:hover + .mega-navigation,
  .page-home .hero-header .navigation-wrapper .navigation-list .site-section-tourfrance .navigation-link:hover + .mega-navigation, 
  .header-large .hero-header .navigation-wrapper .navigation-list .site-section-tourfrance .navigation-link:hover + .mega-navigation,
  .header-large .hero-header .navigation-wrapper .navigation-list .site-section-tourfrance .navigation-link::before,
  .navigation-wrapper .navigation-list .site-section-tourfrance .navigation-link.dropdown-toggle:hover::before {
    display: none;
  }
}

/* PAGE D'ACCUEIL :::::::::::::::::::::::::::::::::::::::::::::::::: */

.page-home .section-tourdefrance {
  padding: 46px 0;

  background-color: #fff;
}
.page-home .section-tourdefrance h2 {
  font-weight: 400;
  text-shadow: 1px 1px 3px rgba(255,255,255,0.5);

  color: #000;

  padding-top: 52px;
  margin-bottom: 38px;
}

.page-home .section-tourdefrance h2::before {
  display: none;
}

.page-home .section-tourdefrance h2::after {
  bottom: unset;
  top: -4px;
  right: calc(50% - 22px);

  background-image: url('../img/title-styled-after-tdf.svg');
}

.page-home .section-tourdefrance .btn-tertiary {
  background-color: var(--color-tdf);
  border-color: var(--color-tdf);
}

.page-home .section-tourdefrance .btn-tertiary:hover {
  background-color: rgba(0,0,0,0);
  border-color: var(--color-tdf);
  color: var(--color-tdf);
}

.page-home .section-tourdefrance .frame-backgroundimage {
  background-position: top center;

  opacity: 0.72;
}

@media screen and (min-width: 1460px) {
  .page-home .section-tourdefrance .frame-backgroundimage {
    opacity: 1;
  }
}

/* PAGE D'ACCUEIL - Section "Patrimoine" */
.section-home-patrimoine .frame-type-text {
  position: relative;
  text-align: left;
}

.section-home-patrimoine .frame-type-text::before {
  content: '';
  position: absolute;
  left: -40px;
  top: -35px;

  width: 70px;
  height: 70px;

  background-image: url('../img/title-styled-before-light-1.svg');
}

.section-home-patrimoine .frame-type-tctheme_cardbox .card {
  position: relative;

  margin-right: 20px;
  margin-bottom: 20px;

  overflow: visible;
}

.section-home-patrimoine .frame-type-tctheme_cardbox .card::after {
  content: '';
  position: absolute;
  bottom: -20px;
  right: -20px;
  z-index: 0;

  background-color: #efefef;

  width: 100%;
  height: 100%;
}

.section-home-patrimoine .frame-type-tctheme_cardbox .card-header {
  position: relative;
  z-index: 1;
}

.section-home-patrimoine .frame-type-tctheme_cardbox .card-body {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;

  justify-content: center;
  align-items: flex-end;

  width: 100%;
  height: 100%;

  padding: 0;

  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.38) 100%);
}

.section-home-patrimoine .frame-type-tctheme_cardbox .card-body a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;

  height: 100%;

  padding: 0 15px 32px 15px;

  font-size: 1.8rem;
}

.section-home-patrimoine .frame-type-tctheme_cardbox .card-body a::after {
  display: none;
}

.section-home-patrimoine .card-patrimoine-first,
.section-home-patrimoine .card-patrimoine-second {
  position: relative;
}
.section-home-patrimoine .card-patrimoine-first::before,
.section-home-patrimoine .card-patrimoine-second::before {
  content: '';
  position: absolute;
}

@media screen and (min-width: 768px) {
  .section-home-patrimoine .frame-type-text::before {
    left: -46px;
    top: -49px;

    width: 80px;
    height: 80px;
  }
  .section-home-patrimoine [class*='col-4'] {
    grid-column: auto/span 6;
  }
  .section-home-patrimoine [class*='col-4']:first-of-type {
    grid-column: auto/span 12;
  }
  .section-home-patrimoine .card-patrimoine-first::before {
    bottom: -51px;
    left: -24px;

    width: 145px;
    height: 145px;

    background-image: url('../img/title-styled-before-light-2.svg');
  }
  .section-home-patrimoine .card-patrimoine-second {
    margin-top: 60px;
    margin-bottom: 46px;
  }
  .section-home-patrimoine .card-patrimoine-second::before {
    top: -38px;
    right: -42px;

    width: 83px;
    height: 83px;

    background-image: url('../img/title-styled-before-light-3.svg');
  }
}

@media screen and (min-width: 992px) {
  .section-home-patrimoine [class*=' grid-'].has-gutter, 
  .section-home-patrimoine [class^='grid-'].has-gutter {
    grid-gap: 3rem;
  }
  .section-home-patrimoine [class*='col-4'],
  .section-home-patrimoine [class*='col-4']:first-of-type {
    grid-column: auto/span 4;
  }
}

@media screen and (min-width: 1200px) {
  .section-home-patrimoine .card-patrimoine-first::before {
    bottom: -98px;
    left: -114px;
  }
}
