@import url('font.css');
@import url('color.css');
@import url('trame.css');


main#accueil {
  grid-column: 4/15;
  grid-row: 2/42;
}

main#accueil header {
  display: grid;
}

header .marquee {
  height: calc(var(--unit)*2.5);
  overflow: hidden;
  position: relative;
}

header .marquee h2 {
  margin: 0;
  text-align: center;
  animation: scroll-left 30s linear infinite;
  white-space: nowrap;
  display: inline-block;
}

header .marquee h2 p{
  display: none;
}

header h2.head {
  font-size: calc(var(--unit)*1.3);
  font-variant:normal;
  font-family: "LM-romanboldlItalic10";
  font-weight: normal;
}

@-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%);
  }
}

main#accueil section#recupedia {
  height: 70vh;
  overflow-y: scroll;
}

main#accueil section#recupedia .introRecupedia {
  width: 100%;
  padding: 10px;
  padding-right: 20px;
  padding-left: 20px;
}

main#accueil section#recupedia .introRecupedia .imgRecupedia {
  max-width: 40%;
  height: auto;
  float: right;
  margin-top: 20px;
  margin-left: 20px;
}

main#accueil section#recupedia .introRecupedia ul li {
  display: list-item;
  font-family: "LM-roman10";
  font-size: calc(var(--unit)*1.2);
  padding-top: var(--unit);
  list-style-type: circle;
  margin-left: 30px;
}

main#accueil section#recupedia .introRecupedia .footer .breadCrumb ul li {
  font-family: "LM-mono10";
  font-size: var(--unit);
  list-style-type: none;
  margin-left: 0;
  display: flex;
}


main#accueil .introRecupedia p {
  font-family: "LM-roman10";
  text-indent: 30px;
  font-family: "LM-roman10";
  font-size: calc(var(--unit)*1.3);
  text-indent: 30px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-right: 20px;
  margin-left: 20px;
}

main#accueil .introRecupedia .imgRecupedia + p:empty + p {
  text-indent: 0;
}


main#accueil section#agenda {
  display: none;
  grid-column: 6/11;
  grid-row: 2/15;
  padding-right: 1px;
  overflow-y: scroll;
}

main#accueil section ul li .event {
  width: 100%;
  z-index: 2;
  display: flex;
  height: auto;
}

main#accueil section ul li .event span {
  padding: 2%;
  height: auto;
}

main#accueil section ul li .event a {
  text-decoration: none;
}

main#accueil section ul li .event .dateEvent {
  padding-right: 3%;
  padding-left: 3%;
  vertical-align: baseline;
  font-weight: normal;
  font-family: "LM-monoBold10";
}

main#accueil section ul li .event .nameEvent {
  padding-right: 3%;
  padding-left: 3%;
}

main#accueil section ul li .event .nameEvent h1, main#accueil section ul li .event .dateEvent {
  font-size: calc(var(--unit)*1.2);

}

main#accueil section ul li .event .nameEvent h1 {
font-family: "LM-roman10";
font-weight: normal;}


section#faq {
  grid-column: 1/11;
  grid-row: 15/35;
}


section#faq ul.listFaq {
  height: auto;
}

section#agenda details,
section#agenda details summary,
section#faq  details,
section#faq  details summary {
  list-style: none;
}

section#faq  details .backGif {
  width: 15vw;
  height: auto;
  margin: auto;
  border-radius: 200px;
}

section#faq  details .backGif img {
  border-radius: 200px;
  background: var(--violet);
  mix-blend-mode: screen;
  filter: grayscale(1);
  max-width: 15vw;
  max-height: 18vw;
  margin-top: 3vh !important;
  margin-bottom: 3vh !important;
  display: flex;
  margin: auto;
  margin-bottom: 1px solid var(--violet);
}

section#agenda details summary:-webkit-details-marker,
section#faq  details summary:-webkit-details-marker {
  display: none;
}

main#accueil details summary {
  width: 100%;
  font-size: calc(var(--unit) * 1.2);
  display: flex;
}

section#agenda details summary ul li,
section#faq details summary ul li {
  padding: 0px;
  display: flex;
}


section#faq .imgPreFaq {
display: flex;
}

section#faq .imgPreFaq img {
  max-height: 48vh;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2vh;
  margin-bottom: 2vh;
}

section#agenda .gradientLeft,
section#faq .gradientLeft {
  left: 0px;
  width: 15px;
  height: auto;
  z-index: 1;
}

section#agenda details summary.title .describe span,
section#faq details summary.title .describe span {
  font-family: "LM-romandemil10";
  font-size: calc(var(--unit)*1.8);
  margin-left: 15px;
  padding-right: 0px;
  padding: 10px;
  display: flex;
  margin-right: 20px;
}

section#agenda details summary.part ul li .describe,
section#faq details summary.part ul li .describe{
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 40px;
}

section#agenda details[open] summary.part span::before,
section#faq details[open] summary.part span::before{
  content: '└ ';
  font-size: calc(var(--unit)*0.8);
}

section#agenda details summary.part .describe span,
section#faq details summary.part .describe span {
  padding-left: 10px;
  padding-right: 10px;
  margin-left: 12px;
  font-family: "LM-romandemil10";
  font-size: calc(var(--unit)*1.2);
}

main#accueil section.texte {
  padding-right: 1%;
  width: 100%;
  overflow-y: scroll;
}

section#agenda section.texte .content,
section#faq section.texte .content,
main#accueil section.texte .content {
  padding-right: 11vw;
  padding-left: 5vw;
  width: 100%;
  overflow-y: scroll;
  padding-top: 50px;
  padding-bottom: 50px;
}

section#agenda section.texte .content p,
section#agenda section.texte .content ul,
section#faq section.texte .content p,
section#faq section.texte .content ul,
main#accueil section.texte .content p,
main#accueil section.texte .content ul {
  font-family: "LM-roman10";
  font-size: calc(var(--unit)*1.3);
  padding-left: 80px;
  padding-right: 80px;
  margin-top: 0px;
  margin-bottom: 0px;
}
main#accueil section.texte .content h4 + p,
main#accueil section.texte .content h3 + p,
main#accueil section.texte .content h2 + p,
main#accueil section.texte .content h1 + p,
main#accueil section.texte .content > p:nth-child(1),
main#accueil section.texte .content ul li + p,
main#accueil section.texte .content ul li,
main#accueil section.texte .content ol li + p,
main#accueil section.texte .content ol li + p,
main#accueil section#recupedia .introRecupedia h4 + p,
main#accueil section#recupedia .introRecupedia h3 + p,
main#accueil section#recupedia .introRecupedia h2 + p,
main#accueil section#recupedia .introRecupedia h1 + p,
main#accueil section#recupedia .introRecupedia > p:nth-child(1),
main#accueil section#recupedia .introRecupedia ul li + p,
main#accueil section#recupedia .introRecupedia ul li,
main#accueil section#recupedia .introRecupedia ol li + p {
  text-indent: 0;
}

section#recupedia section.texte .content ul li,
section#faq section.texte .content ul li,
section#agenda section.texte .content ul li,
main#accueil section.texte .content ul li {
  display: list-item;
  font-family: "LM-roman10";
  font-size: calc(var(--unit)*1.3);
  margin-left: 10%;
  list-style: circle;
  text-indent: 0;
}

/* main#accueil section.texte .content p:nth-of-type(1) {
  padding-top: 50px;
} */
section#agenda section.texte .content p a,
section#faq section.texte .content p a,
main#accueil section.texte .content p a {
  text-decoration: underline;
  text-decoration-color: currentcolor;
}

section#agenda details.open section.texte > ul > li,
section#faq details.open section.texte > ul > li,
main#accueil details.open section.texte > ul > li {
  display: flex;
}

main#accueil section#recupedia .introRecupedia .imgRecupedia img {
  filter: grayscale(1);
  mix-blend-mode: screen;
  display: flex;
}

main#accueil section.texte .content .footer, main#accueil section#recupedia .introRecupedia .footer {
  left: 0;
  margin-top: 30px;
  width: 100%;
}

main#accueil section.texte .content .footer h3, main#accueil section#recupedia .introRecupedia .footer h3 {
  display: flex;
  width: 85px;
  z-index: 1;
}

main#accueil section.texte .content .footer h3:after, main#accueil section#recupedia .introRecupedia .footer h3:after {
  content: "→";
  position: relative;
  transform: rotate(45deg);
  padding-left: 5px;
  padding-right: 5px;
}
main#accueil section#recupedia .introRecupedia .footer h3,
main#accueil section#recupedia .introRecupedia h3
main#accueil section.texte .content .footer h3 {
  font-size: calc(var(--unit)*1.2);
  font-family: "LM-mono10";
  position: relative;
  max-width: 24%;
}

main#accueil section.texte .footer .breadCrumb ul li, main#accueil section#recupedia .introRecupedia .footer .breadCrumb ul li {
  padding: 1%;
}

section#recupedia .introRecupedia .footer .breadCrumb ul li {
  margin-left: 0;
}

main#accueil section#recupedia .introRecupedia .footer .breadCrumb ul li img {
  max-width: 3%;

}

main#accueil section.texte .footer img {
  max-width: 2%;
}