@charset "UTF-8";

/* ----------------------------- */
/* RESET
/* ----------------------------- */

html {
  /* set base font-size to equiv "10px", which is adapted to rem unit */
  font-size: 62.5%;
  /* IE9-IE11 math fixing. See http://bit.ly/1g4X0bX */
  font-size: calc(1em * 0.625);
}
html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
img{
  max-width: 100%;
  height: auto;
}


/* ----------------------------- */
/* COMMUNS
/* ----------------------------- */

html{
  scroll-behavior: smooth;
}

hr{
  display: block;
  clear: both;
  height: 2px;
  margin: 0;
  padding: 0;
  border: 0;
  color: #000;
  background-color: #000;
}

hr.clear{
  height: 0;
  margin: 0;
}

sub,
sup{
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub{
  bottom: -.25em;
}

sup{
  top: -.5em;
}

h1, h2, h3, h4, h5, h6{
  font-size: inherit;
  font-weight: normal;
}

.logo,
*[role=button]{
  user-select: none;
}

*[role=button]:hover,
select:hover {
  cursor: pointer;
}

select{
  font-family: 'GroteskRemix', Helvetica, Arial, sans-serif;
  background: transparent;
  border-radius: 0.7em;
  -webkit-appearance: none;
  padding: 0.1em 2.4em 0.1em 0.6em;
  max-width: 100%;
}
.select-wrapper{
  white-space: nowrap;
}
.select-wrapper:after{
  content: url('images/icon-select.svg');
  display: inline-block;
  position: relative;
  top: -0.1em;
  margin-left: -1.7em;
  width: 1.5rem;
  height: 1rem;
  pointer-events: none;
}
select:focus{
  outline: 0;
}

b, strong{
  font-weight: normal;
}

ul.menu a{
  cursor: pointer;
}


/* ----------------------------- */
/* RENDU IMAGES
/* ----------------------------- */

/* Chrome */
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
  .actu-image img,
  .article-galerie img,
  .artiste-photo img,
  .item-image img{
    image-rendering: -webkit-optimize-contrast;
  }
}

/* Zoom JS */

.zoomable{
  position: relative;
  overflow: hidden;
  pointer-events: none;
}
.zoomableInPlace{
  position: absolute;
}
.zoomable > .zoomed{
  transition: opacity 0.15s ease;
  opacity: 0 !important;
  position: absolute !important;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
  margin: 0 !important;
  pointer-events: none !important;
  max-height: none !important;
  max-width: none !important;
  background: #f4f4f4 !important;
}
.zoomable.active > .zoomed{
  opacity: 1 !important;
  transition: opacity 0.15s ease;
}


/* ----------------------------- */
/* PRELOAD IMAGES
/* ----------------------------- */

#preload-01 { background: url(images/icon-menu1.svg) no-repeat -9999px -9999px; }
#preload-02 { background: url(images/icon-menu2.svg) no-repeat -9999px -9999px; }
#preload-03 { background: url(images/icon-menu3.svg) no-repeat -9999px -9999px; }
#preload-04 { background: url(images/icon-menu4.svg) no-repeat -9999px -9999px; }
#preload-05 { background: url(images/icon-menu5.svg) no-repeat -9999px -9999px; }
#preload-06 { background: url(images/icon-menu6.svg) no-repeat -9999px -9999px; }
#preload-07 { background: url(images/icon-newsletter1.svg) no-repeat -9999px -9999px; }


/* ----------------------------- */
/* TYPOGRAPHIE
/* ----------------------------- */

/* Fonts */

@font-face {
    font-family: 'GroteskRemix';
    src: url('fonts/GroteskRemix-RAPDL.woff2') format('woff2'),
         url('fonts/GroteskRemix-RAPDL.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/* Styles de texte */

body{
  font-family: 'GroteskRemix', Helvetica, Arial, sans-serif;
  font-weight: normal;
  line-height: 1.15;
  background-color: #f4f4f4;
  margin: 0;
  /*-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;*/
}

input,
button{
  font-family: inherit;
}

.overlay input{
  font-size: 9.6rem;
}

.overlay button{
  font-size: 5.2rem;
}

.default-menu,
.liste-artistes > li,
.noresults,
.artiste-header,
.artiste-textes .billet h3,
.artiste-cv h3,
.artiste-coordonnees,
.article-retour,
.article-titrage,
.article-chapo,
.projet-textes h1,
.article-texte h3,
.projet-details,
.texte-principal,
.chocolat-wrapper .chocolat-close,
.chocolat-wrapper .chocolat-left,
.chocolat-wrapper .chocolat-right,
.t30{
  font-size: 3rem;
  line-height: 1.1;
}

body,
select,
.liste-artistes > li > ul > li,
.artiste-galeries,
.t20{
  font-size: 2rem;
}

.article-publication,
.legende,
.artiste-cv ul,
.artiste-cv li,
p.notes,
.texte-secondaire,
.item-duree,
.t16{
  font-size: 1.6rem;
}

.breadcrumbs,
.legende-artistes-pictos,
.t14{
  font-size: 1.4rem;
}

.breadcrumbs,
.artistes-checkbox,
.t13{
  font-size: 1.3rem;
}

.tooltip,
.t11{
  font-size: 1.1rem;
}

.actu-details p,
.t8{
  font-size: 0.9rem;
}

.artiste-cv h3{
  line-height: 1.1;
}

.artiste-cv h4,
.artiste-cv ul{
  line-height: 1.15;
}

/* Mobile */
@media (max-width: 767px){

  .overlay input{
    font-size: 9vw;
  }
  .overlay button{
    font-size: 9vw;
  }
  .header-mobile,
  .t40{
    font-size: 4rem;
  }
  .noresults,
  .artiste-header,
  .artiste-coordonnees,
  .article-chapo,
  .article-texte h3,
  .projet-details,
  .texte-principal,
  .chocolat-wrapper .chocolat-close,
  .chocolat-wrapper .chocolat-left,
  .chocolat-wrapper .chocolat-right,
  .t20{
    font-size: 2rem;
  }
  .liste-artistes > li > ul > li,
  .t16{
    font-size: 1.6rem;
  }
  
}


/* ----------------------------- */
/* NIVEAUX DE ZOOM
/* ----------------------------- */


@media (min-width: 2200px){
  html {
    font-size: 85%;
    font-size: calc(1em * 0.85);
  }
}

@media (min-width: 1920px) and (max-width: 2199px){
  html {
    font-size: 80%;
    font-size: calc(1em * 0.80);
  }
}

@media (min-width: 1600px) and (max-width: 1919px){
  html {
    font-size: 75%;
    font-size: calc(1em * 0.75);
  }
}

@media (min-width: 1400px) and (max-width: 1599px){
  html {
    font-size: 68%;
    font-size: calc(1em * 0.68);
  }
}

@media (min-width: 1200px) and (max-width: 1399px){
  html {
    font-size: 62.5%;
    font-size: calc(1em * 0.625);
  }
}

@media (min-width: 1100px) and (max-width: 1199px){
  html {
    font-size: 58%;
    font-size: calc(1em * 0.58);
  }
}


@media (min-width: 1024px) and (max-width: 1099px){
  html {
    font-size: 55%;
    font-size: calc(1em * 0.55);
  }
}

@media (min-width: 768px) and (max-width: 1023px){
  html {
    font-size: 50%;
    font-size: calc(1em * 0.50);
  }
}

@media (min-width: 400px) and (max-width: 767px){
  html {
    font-size: 62.5%;
    font-size: calc(1em * 0.625);
  }
}

@media (max-width: 399px){
  html {
    font-size: 56%;
    font-size: calc(1em * 0.56);
  }
}


/* ----------------------------- */
/* COULEURS
/* ----------------------------- */

/* Theme 0 = par défaut */

body,
select,
a,
.actu a:hover,
.actu a:hover,
/*.artistes-checkbox a:hover,*/
.artiste-travaux a:hover,
.chocolat-wrapper,
.overlay input,
.overlay button{
  color: #000;
}
.overlay ::-webkit-input-placeholder {
  color: #000; 
}
.overlay input:-moz-placeholder{
  color: #000;
}

@media (min-width: 768px){
  @supports (-webkit-text-stroke: 0.2rem) {
    .overlay input{
      text-shadow: none;
      -webkit-text-stroke: 0.2rem #000;
      -webkit-text-fill-color: #f4f4f4;
    }
    .overlay ::-webkit-input-placeholder{
      text-shadow: none;
      -webkit-text-stroke: 0.2rem #000;
      -webkit-text-fill-color: #f4f4f4;
    }
    .overlay input:-moz-placeholder{
      text-shadow: none;
      -webkit-text-stroke: 0.2rem #000;
      -webkit-text-fill-color: #f4f4f4;
    }
  }
}

a:hover,
a:active,
.header-buttons div:hover,
.header-buttons div.is-active,
.wpml-ls-current-language a,
.actus-reset:hover,
.artistes-reset:hover,
.current-post-ancestor a,
.current-menu-parent a,
.current-post-parent a,
.current-menu-item a,
.artiste-menu li:hover span,
li.current-section span,
.single-travaux .menu-artistes a,
.author .menu-artistes a,
.article-retour a.jquery-hover,
.chocolat-wrapper *:hover,
.close-overlay:hover{
  color: #ff6864;
}

.overlay,
.tooltip{
  background-color: #f4f4f4;
}

.texte-principal h3{
  box-shadow: inset 0 -0.05em;
}

p.notes .titre-notes{
  box-shadow: inset 0 -0.08em #f4f4f4, inset 0 -0.12em;
}

::selection{
  background-color: #ff6864 !important;
  color: #000 !important;
}
::-moz-selection{
  background-color: #ff6864 !important;
  color: #000 !important;
}

.item-duree{
  color: #f4f4f4;
  background-color: #000;
}

.select-theme0,
.bg0{
  background-color: #000;
  color: #ff6864; /* utilisé pour hover */
}


/* Theme 1 (bleu) */
html.theme1 body,
html.theme1 select,
html.theme1 a,
html.theme1 .actu a:hover,
html.theme1 .actu a:hover,
/*html.theme1 .artistes-checkbox a:hover,*/
html.theme1 .artiste-travaux a:hover,
html.theme1 .chocolat-wrapper,
html.theme1 .overlay input,
html.theme1 .overlay button{
  color: #4662ff;
}
html.theme1 .overlay ::-webkit-input-placeholder {
  color: #4662ff; 
}
html.theme1 .overlay input:-moz-placeholder{
  color: #4662ff;
}
@media (min-width: 768px){
  @supports (-webkit-text-stroke: 0.2rem) {
    html.theme1 .overlay input{
      -webkit-text-stroke: 0.2rem #4662ff;
    }
    html.theme1 .overlay ::-webkit-input-placeholder{
      -webkit-text-stroke: 0.2rem #4662ff;
    }
    html.theme1 .overlay input:-moz-placeholder{
      -webkit-text-stroke: 0.2rem #4662ff;
    }
  }
}

html.theme1 a:hover,
html.theme1 a:active,
html.theme1 .header-buttons div:hover,
html.theme1 .header-buttons div.is-active,
html.theme1 .wpml-ls-current-language a,
html.theme1 .actus-reset:hover,
html.theme1 .artistes-reset:hover,
html.theme1 .current-post-ancestor a,
html.theme1 .current-menu-parent a,
html.theme1 .current-post-parent a,
html.theme1 .current-menu-item a,
html.theme1 .artiste-menu li:hover span,
html.theme1 li.current-section span,
html.theme1 .single-travaux .menu-artistes a,
html.theme1 .author .menu-artistes a,
html.theme1 .article-retour a.jquery-hover,
html.theme1 .chocolat-wrapper *:hover,
html.theme1 .close-overlay:hover{
  color: #ff6864;
}

.select-theme1,
.bg1{
  background-color: #4662ff;
  color: #ff6864; /* utilisé pour hover */
}

html.theme1 .select-wrapper:after{
  content: url('images/icon-select-1.svg');
}

html.theme1 ::selection{
  background-color: #4662ff !important;
  color: #000 !important;
}
html.theme1 ::-moz-selection{
  background-color: #4662ff !important;
  color: #000 !important;
}

/* Theme 2 (vert) */

html.theme2 body,
html.theme2 select,
html.theme2 a,
html.theme2 .actu a:hover,
html.theme2 .actu a:hover,
/*html.theme2 .artistes-checkbox a:hover,*/
html.theme2 .artiste-travaux a:hover,
html.theme2 .chocolat-wrapper,
html.theme2 .overlay input,
html.theme2 .overlay button{
  color: #12b860;
}
html.theme2 .overlay ::-webkit-input-placeholder {
  color: #12b860; 
}
html.theme2 .overlay input:-moz-placeholder{
  color: #12b860;
}
@media (min-width: 768px){
  @supports (-webkit-text-stroke: 0.2rem) {
    html.theme2 .overlay input{
      -webkit-text-stroke: 0.2rem #12b860;
    }
    html.theme2 .overlay ::-webkit-input-placeholder{
      -webkit-text-stroke: 0.2rem #12b860;
    }
    html.theme2 .overlay input:-moz-placeholder{
      -webkit-text-stroke: 0.2rem #12b860;
    }
  }
}

html.theme2 a:hover,
html.theme2 a:active,
html.theme2 .header-buttons div:hover,
html.theme2 .header-buttons div.is-active,
html.theme2 .wpml-ls-current-language a,
html.theme2 .actus-reset:hover,
html.theme2 .artistes-reset:hover,
html.theme2 .current-post-ancestor a,
html.theme2 .current-menu-parent a,
html.theme2 .current-post-parent a,
html.theme2 .current-menu-item a,
html.theme2 .artiste-menu li:hover span,
html.theme2 li.current-section span,
html.theme2 .single-travaux .menu-artistes a,
html.theme2 .author .menu-artistes a,
html.theme2 .article-retour a.jquery-hover,
html.theme2 .chocolat-wrapper *:hover,
html.theme2 .close-overlay:hover{
  color: #ff6864;
}

.select-theme2,
.bg2{
  background-color: #12b860;
  color: #ff6864; /* utilisé pour hover */
}

html.theme2 .select-wrapper:after{
  content: url('images/icon-select-2.svg');
}

html.theme2 ::selection{
  background-color: #12b860 !important;
  color: #000 !important;
}
html.theme2 ::-moz-selection{
  background-color: #12b860 !important;
  color: #000 !important;
}


/* Theme 3 (orange) */

html.theme3 body,
html.theme3 select,
html.theme3 a,
html.theme3 .actu a:hover,
html.theme3 .actu a:hover,
/*html.theme3 .artistes-checkbox a:hover,*/
html.theme3 .artiste-travaux a:hover,
html.theme3 .chocolat-wrapper,
html.theme3 .overlay input,
html.theme3 .overlay button{
  color: #ff6864;
}
html.theme3 .overlay ::-webkit-input-placeholder {
  color: #ff6864; 
}
html.theme3 .overlay input:-moz-placeholder{
  color: #ff6864;
}
@media (min-width: 768px){
  @supports (-webkit-text-stroke: 0.2rem) {
    html.theme3 .overlay input{
      -webkit-text-stroke: 0.2rem #ff6864;
    }
    html.theme3 .overlay ::-webkit-input-placeholder{
      -webkit-text-stroke: 0.2rem #ff6864;
    }
    html.theme3 .overlay input:-moz-placeholder{
      -webkit-text-stroke: 0.2rem #ff6864;
    }
  }
}

html.theme3 a:hover,
html.theme3 a:active,
html.theme3 .header-buttons div:hover,
html.theme3 .header-buttons div.is-active,
html.theme3 .wpml-ls-current-language a,
html.theme3 .actus-reset:hover,
html.theme3 .artistes-reset:hover,
html.theme3 .current-post-ancestor a,
html.theme3 .current-menu-parent a,
html.theme3 .current-post-parent a,
html.theme3 .current-menu-item a,
html.theme3 .artiste-menu li:hover span,
html.theme3 li.current-section span,
html.theme3 .single-travaux .menu-artistes a,
html.theme3 .author .menu-artistes a,
html.theme3 .article-retour a.jquery-hover,
html.theme3 .chocolat-wrapper *:hover,
html.theme3 .close-overlay:hover{
  color: #4662ff;
}

.select-theme3,
.bg3{
  background-color: #ff6864;
  color: #4662ff; /* utilisé pour hover */
}

html.theme3 .select-wrapper:after{
  content: url('images/icon-select-3.svg');
}

html.theme3 ::selection{
  background-color: #ff6864 !important;
  color: #4662ff !important;
}
html.theme3 ::-moz-selection{
  background-color: #ff6864 !important;
  color: #4662ff !important;
}


/* ----------------------------- */
/* TOOLTIPS
/* ----------------------------- */

.tooltip{
  position: absolute;
  width:auto;
  z-index: 999;
  left: -9999px;
  pointer-events: none;
  text-transform: uppercase;
  border: 1px solid;
  border-radius: 0.9rem;
  padding: 0.5em 0.6em 0.2em 0.6em;
}


/* ----------------------------- */
/* LIENS
/* ----------------------------- */

a{
  text-decoration: none;
}

.logo a{
  display: block;
}


/* Liens blocs */
.actu-texte,
.item-titre,
.linksvg,
.link-zone{
  position: relative;
}
.actu-titre a:before,
.item-titre a:before,
.linksvg:before{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom:0;
  background-color: rgba(0,0,0,0);
}


/* ----------------------------- */
/* PAGE FADE IN
/* ----------------------------- */

.js body{
  opacity: 0;
  transition: opacity 0.6s ease;
}
.js body.is-visible{
  opacity: 1;
}


/* ----------------------------- */
/* DESIGN GLOBAL
/* ----------------------------- */

/* Desktop */
@media (min-width: 768px){

  .header-mobile{
    display: none;
  }

  /* Sticky footer */
  html,
  body,
  .wrapper{
    height: 100%;
  }
  .wrapper{
    display: flex;
    flex-direction: column;
  }
  .main{
    flex: 1 0 auto;
  }
  .footer{
    flex-shrink: 0;
  }
}

/* Mobile */
@media (max-width: 767px){

  .header,
  .footer,
  .header-menu,
  .header-logo1,
  .header-logo2,
  .header-description,
  .select-lang,
  .header-buttons,
  .texte-defilant,
  .footer-menu1,
  .footer-menu2,
  .footer-logo1,
  .footer-logo2,
  .switch-theme,
  .footer-signature,
  .partenaires,
  .breadcrumbs{
    display: none;
  }
}


/* ----------------------------- */
/* MARGES
/* ----------------------------- */

.wrapper{
  padding: 2rem 2rem 0 2rem;
}

.footer{
  padding-bottom: 2rem;
}


/* ----------------------------- */
/* GRILLE
/* ----------------------------- */

/* Desktop */
@media (min-width: 768px){

  .artistes-filtres{
    grid-column: 1 / -1;
  }

  /* 24 colonnes */

  .header-row1,
  .footer-row1{
    display: grid;
    grid-template-columns: repeat(24, 1fr);
    grid-column-gap: 2rem;
  }
  .header-logo1,
  .footer-logo1{
    grid-column: span 8;
  }
  .header-logo2,
  .footer-logo2{
    grid-column: span 7;
  }
  .header-description,
  .footer-menu2{
    grid-column: span 5;
  }
  .header-menu,
  .footer-menu1{
    grid-column: span 4;
  }


  /* 12 colonnes */

  .header-row2,
  .footer-row2,
  .accueil,
  .liste-actus,
  .article,
  .artiste-header,
  section.travaux,
  section.artiste-focus,
  section.artiste-textes,
  section.artiste-contact,
  .artistes .artistes-filtres,
  .artistes .legende-artistes-pictos,
  .page-standard{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 2rem;
  }
  .texte-principal.wide{
    grid-column: 1 / -1;
  }
  .texte-defilant,
  .partenaires,
  .texte-principal,
  .texte-secondaire{
    grid-column: span 6;
  }
  .accueil-artistes{
    grid-column: 6 / span 7;
  }
  .header-buttons,
  .article-images,
  .artiste-infos{
    grid-column: span 5;
  }
  .artiste-textes .billet:nth-child(odd),
  .artiste-photo{
    grid-column: 2 / span 5;
  }
  .article-textes,
  .projet-textes,
  .artiste-menu,
  .artiste-textes .billet:nth-child(even),
  .artiste-coordonnees{
    grid-column: 8 / span 5;
  }
  .accueil-actualites,
  .liste-actus .actu,
  .artiste-focus .actu,
  .footer-signature,
  .travaux .item{
    grid-column: span 4;
  }

  .legende-artistes{
    grid-column: span 3;
  }

  .switch-theme,
  .artistes-select,
  .artistes-checkbox{
    grid-column: span 2;
  }

  .artistes-checkbox:nth-of-type(5){
    grid-column: 9 / span 2;
  }

  .liste-actus,
  section.travaux{
    grid-row-gap: 5.5rem;
    grid-auto-rows: 0;
  }


  /* 7 colonnes */

  .accueil-artistes,
  .accueil .artistes-filtres,
  .accueil .legende-artistes-pictos{
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-column-gap: 2rem;
    grid-auto-rows: min-content;
  }

  .accueil .liste-artistes,
  .accueil .noresults-artistes,
  .accueil .legende-artistes{
    grid-column: 2 / span 6;
  }


  /* 6 colonnes */

  .legende-artistes-pictos{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: 2rem;
  }
  .legende-artistes-pictos > div{
    grid-column: span 2;
  }

  .legende-artistes-pictos{
    grid-row-gap: 2rem;
  }

}

/* 4 colonnes */

.actus-filtres,
.actu-texte,
.author .masonry-content,
.actu-image{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 2rem;
}
.item-titre,
.item-details,
.actu-image > a{
  grid-column: -1 / 1;
}
.actu-titrage,
.item-image{
  grid-column: span 3;
}
.actus-select{
  grid-column: span 2;
}


/* Desktop */
@media (min-width: 768px){
  .accueil .actu-image.portrait > a,
  .liste-actus .actu-image > a{
    grid-column: span 3;
  }
}


/* Mobile */
@media (max-width: 767px){
  section.artiste-travaux{
    grid-row-gap: 5rem;
  }
  .item-image{
    grid-column: -1 / 1;
  }
}


/* ----------------------------- */
/* HEADER
/* ----------------------------- */

.default-menu{
  text-transform: lowercase;
  line-height: 0.9;
}

.logo a,
.logo object{
  height: 100%;
}

.header-logo2{
  margin-left: auto;
}

.wpml-ls-legacy-list-horizontal{
  border: none;
  padding: 0;
  clear: none;
}

.wpml-ls-legacy-list-horizontal .wpml-ls-item{
  display: inline;
}

.wpml-ls-legacy-list-horizontal a{
  display: inline;
  padding: 0;
}
.wpml-ls-legacy-list-horizontal a span{
  vertical-align: baseline;
}

.select-lang{
  white-space: nowrap;
}

.select-lang ul > li:first-child:after{
  content: '/';
}

.select-lang,
.toggle-newsletter,
.toggle-recherche,
.texte-defilant{
  text-transform: uppercase;
}

.texte-defilant{
  overflow: hidden;
  margin-top: -0.5rem;
}
.texte-defilant .js-marquee{
  margin-top: 0.5rem;
}


/* Desktop */
@media (min-width: 768px){

  .header{
    margin-bottom: 7rem;
  }

  .single .header,
  .author .header,
  .search .header{
    margin-bottom: 2.8rem;
  }
  .logo{
    height: 14.5rem;
    position: relative;
    top: -1.2rem;
  }

  .header-description{
    position: relative;
    width: 25.8rem;
    line-height: 1.15;
    transition: top 0.8s ease 7s;
  }
  html.js .header-description{
    top: -200%;
  }
  html.js .header-description.is-visible{
    top: 0;
    transition: top 0.8s ease 0s;
  }

  .header-row1{
    margin-bottom: 1.5rem;
  }

  .header-buttons{
    display: flex;
    justify-content: space-around;
  }

}

/* Small */
@media (max-width: 960px){
  .header-description{
    opacity: 0;
  }
}


/* Mobile */
@media (max-width: 767px){

}

/* ----------------------------- */
/* HEADER/MENU MOBILE
/* ----------------------------- */

/* Mobile */
@media (max-width: 767px){

  *.mobile-open{
    display: block;
  }

  .header{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 11;
  }

  .footer{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    background-color: #f4f4f4;
  }

  .header-mobile{
    width: 85%;
    padding-bottom: 0.8em;
  }
  .toggle-menu{
    position: fixed;
    top: 2rem;
    right: 2rem;
    width: 3rem;
    vertical-align: top;
    z-index: 9;
  }
  .toggle-menu .svg{
    vertical-align: top;
  }
  .header-mobile h2{
    position: relative;
    top: -0.2em;
  }

  *.mobile-open .header-logo1{
    display: block;
    position: fixed;
    top: 0.5rem;
    left: 2rem;
    height: calc(14vh + 4vw);
  }
  *.mobile-open .header-logo2{
    display: block;
    position: fixed;
    bottom: 7rem;
    right: 2rem;
    height: calc(14vh + 4vw);
  }
  *.mobile-open .switch-theme{
    display: block;
    position: fixed;
    top: 1.5rem;
    right: 2rem;
  }
  *.mobile-open .switch-theme span:first-child{
    display: none;
  }
  *.mobile-open .header-menu{
    display: block;
    position: fixed;
    top: 35%;
    left: 2rem;
  }
  *.mobile-open .footer-menu2{
    display: block;
    position: fixed;
    top: 35%;
    right: 2rem;
    text-align: right;
  }
  *.mobile-open .menu-item{
    height: 0.9em;
  }
  *.mobile-open .menu-item-20086 a,
  *.mobile-open .menu-item-20087 a{
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
  }
  *.mobile-open .menu-item-20086 a{ /* credits */
    width: 2.7em;
  }
  *.mobile-open .menu-item-20087 a{ /* mentions */
    width: 3.6em;
  }
  *.mobile-open .select-lang{
    display: block;
    position: fixed;
    bottom: 2rem;
    left: 2rem;
  }
  *.mobile-open .wpml-ls-legacy-list-horizontal{
    position: relative;
    top: 0.5rem;
  }
  .wpml-ls-legacy-list-horizontal .wpml-ls-item,
  .wpml-ls-legacy-list-horizontal .wpml-ls-item a{
    display: inline-block;
  }

  .select-lang ul > li:first-child:after{
    display: inline-block;
    margin-left: -0.3em;
  }

  *.mobile-open .partenaires{
    position: fixed;
    bottom: 2rem;
    right: 2rem;
  }
  *.mobile-open .logo-pdl{ 
    margin-left: 3.7vw;
  }
  *.mobile-open .logo-loire-atlantique{ 
    margin-left: 3.7vw;
  }
  *.mobile-open .logo-nantes{
    margin-left: 3.9vw;
  }
  *.mobile-open .logo-ministere-culture object{
    width: 11vw;
  }
  *.mobile-open .logo-pdl object{
    width: 10.4vw;
  }
  *.mobile-open .logo-loire-atlantique object{
    width: 12vw;
  }
  *.mobile-open .logo-nantes object{
    width: 15.4vw;
  }
  

}


/* ----------------------------- */
/* FOOTER
/* ----------------------------- */

.switch-theme span:first-child{
  display: inline-block;
  margin-right: 0.5rem;
}

.select-theme{
  display: inline-block;
  position: relative;
  top: 0.1rem;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
}

.select-theme0{
  display: none;
}

.partenaires > a{
  position: relative;
}

.logo-ministere-culture{
  top: 1.2rem;
}
.logo-pdl{
  top: 1.3rem;
  margin-left: 2.6rem;
}
.logo-loire-atlantique{
  top: 1.3rem;
  margin-left: 2.6rem;
}
.logo-nantes{
  top: 1.2rem;
  margin-left: 3.2rem;
}

.logo-ministere-culture object{
  width: 5.5rem;
}
.logo-pdl object{
  width: 5.2rem;
}
.logo-loire-atlantique object{
  width: 6.0rem;
}
.logo-nantes object{
  width: 7.7rem;
}


.partenaires{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}


/* Desktop */
@media (min-width: 768px){

  .footer{
    margin-top: 9rem;
  }

  .footer-logo2{
    margin-left: auto;
  }

  .footer-row2{
    margin-top: 0.5rem;
  }

  .footer-row2 > *{
    align-self: end;
  }

  .footer-signature span{
    display: inline-block;
  }
  .footer-signature span + span{
    margin-left: 1.5rem;
  }

}


/* ----------------------------- */
/* FIL D'ARIANE / BREADCRUMBS
/* ----------------------------- */

.breadcrumbs{
  margin-bottom: 2.8rem;
}

.breadcrumbs span:not(:first-of-type):before{
  content: ' → ';
}


/* ----------------------------- */
/* OVERLAY : RECHERCHE + NEWSLETTER
/* ----------------------------- */

.overlay{
  display: none;
  z-index: 15;
}
  
.overlay input{
  width: 100%;
  padding: 0;
  border: none;
  background: none;
}
.overlay input:focus{
  outline: 0;
}

.overlay button:focus{
  outline: 0;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.overlay button{
  position: relative;
  top: 0.3em;
  padding: 0 1em;
  line-height: 1.6;
  height: 1.6em;
  text-align: left;
  background: none;
  border-radius: 0;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
}

.close-overlay{
  position: fixed;
  bottom: 2rem;
  right: 2rem;
}

.sib_signup_form p.sib-alert-message{
  padding: 0 !important;
  margin-bottom: 1em !important;
  background-color: rgba(0,0,0,0) !important;
  border: none !important;
  border-radius: 0 !important;
  color: inherit !important;
}


/* Desktop */
@media (min-width: 768px){
  body.has-overlay{
    position: fixed; 
    overflow-y: scroll;
  }

  body.has-overlay .header{
    height: 100%;
    flex: 1 0 auto;
  }
  .overlay{
    padding-top: 7rem;
  }
  .overlay.is-visible{
    display: block;
  }

  .overlay .search-field,
  .overlay .sib_signup_box_inside_2{
    width: 100%;
    display: flex;
    justify-content: space-between;
  }
  .overlay button{
    border: 3px solid;
  }
}

/* Mobile */
@media (max-width: 767px){

  .overlay{
    position: fixed;
    height: 100%;
    width: 100%;
  }
  .overlay.is-visible{
    display: block;
  }

  .overlay form{
    margin-top: 2rem;
    padding: 0 2rem;
  }
  /*
  .overlay .search-field,
  .overlay .sib_signup_box_inside_2{
    text-align: center;
  }
  .overlay input{
    text-align: center;
  }
  */
  .overlay button{
    border: 2px solid;
  }
}


/* ----------------------------- */
/* CHOCOLAT LIGHTBOX
/* ----------------------------- */

.chocolat-loader,
.chocolat-wrapper .chocolat-fullscreen{
  background: none !important;
}

body.chocolat-open{
  overflow: auto;
}

a.chocolat-image{
  display: block;
}

.chocolat-overlay{
  background: #f4f4f4;
  opacity: 1;
}

.chocolat-wrapper .chocolat-top,
.chocolat-wrapper .chocolat-bottom{
  width: 0;
  height: 0;
  font-size: 0;
  margin-top: 0;
  margin-bottom: 0;
}

.chocolat-wrapper .chocolat-close{
  position: fixed;
  top: 2rem;
  right: 0;
  width: 6rem;
  height: 8rem;
  background: none;
  text-align: center;
}

.chocolat-wrapper .chocolat-close:after{
  content: 'X';
  width: 100%;
  height: 100%;
}

.chocolat-wrapper .chocolat-left,
.chocolat-wrapper .chocolat-right{
  width: 6rem;
  height: 10rem;
  margin-top: -5rem;
  background: none;
}

.chocolat-wrapper .chocolat-left.active,
.chocolat-wrapper .chocolat-right.active{
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.chocolat-wrapper .chocolat-left:after,
.chocolat-wrapper .chocolat-right:after{
  display: block;
  margin: auto;
}

.chocolat-wrapper .chocolat-left:after{
  content: '←';
}
.chocolat-wrapper .chocolat-right:after{
  content: '→';
}


/* ----------------------------- */
/* ACCUEIL
/* ----------------------------- */

.noresults{
  display: none;
}

.accueil .actu + .actu{
  margin-top: 4rem;
}

.actu.invisible{
  display: none;
}

.actu-image img{
  display: block;
  width: 100%;
}

.actu-texte{
  padding-top: 1.7rem;
}

select,
.artistes-checkbox:before{
  border: 2px solid;
}

.liste-artistes{
  position: relative;
  top: -0.2em;
  columns: 3;
  column-gap: 2rem;
}

.liste-artistes > li{
  -webkit-column-break-inside: avoid;
            page-break-inside: avoid;
                 break-inside: avoid;
}

.liste-artistes > li{
  margin-bottom: 3rem;
}

.liste-artistes > li img,
.resultats-recherche img{
  position: fixed;
  display: none;
  z-index: 10;
  width: 8rem;
}
.liste-artistes > li img.paysage,
.resultats-recherche img.paysage{
  width: 12rem;
}
.liste-artistes > li img.portrait,
.resultats-recherche img.portrait{
  width: 8rem;
}

.picto{
  display: inline-block;
  margin-top: -0.4rem;
  position: relative;
  top: 0.2rem;
  margin-left: 0.2rem;
}

.picto:first-of-type{
  margin-left: 0.5rem;
}

.picto-new object,
.picto-1pourcent object,
.picto-focus object{
  width: 1.5rem;
}
.picto-laureat{
  top: 0.2rem;
}
.picto-laureat object{
  width: 1.4rem;
}

.legende-artistes{
  margin-top: 4rem;
}

.legende-artistes h3{
  margin-bottom: 1.5rem;
}

.legende-artistes .picto{
  float: left;
  margin-left: 0;
  margin-right: 1.2rem;
  padding-top: 0.8rem;
  padding-bottom: 1.5rem;
}


/* Desktop */
@media (min-width: 768px){

  .actus-filtres,
  .artistes-filtres,
  .actus-tri{
    margin-bottom: 2.4rem;
  }

  .actus-reset,
  .artistes-reset{
    position: relative;
    top: 0.2em;
  }

}

/* Mobile */
@media (max-width: 767px){

  .accueil{
    display: none;
  }

  .actus-filtres,
  .accueil .artistes-filtres,
  .actus-tri{
    display: none;
  }

  .artistes-filtres{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 2rem;
    margin-bottom: 4rem;
  }
  .artistes-reset{
    display: none;
    padding-top: 0.2em;
  }
  .select-wrapper{
    margin-bottom: 0.5em;
  }
  .select-wrapper select{
    width: 100%;
  }
  .artistes-checkbox[data-id="has-1pourcent"]{
    grid-column: 1;
  }

  .liste-artistes{
    columns: 2;
  }

  .legende-artistes-pictos{
    columns: 2;
  }
}


/* ----------------------------- */
/* RESULTATS RECHERCHE
/* ----------------------------- */

.resultats-recherche{
  columns: 3;
}



/* ----------------------------- */
/* LISTE ARTICLES (ACTUS/FOCUS)
/* ----------------------------- */

/* Desktop */
@media (min-width: 768px){

}

/* Mobile */
@media (max-width: 767px){
  .liste-actus .actu{
    margin-bottom: 4rem;
  }
  .liste-actus .actu:last-child{
    margin-bottom: 2rem;
  }
}


/* ----------------------------- */
/* LISTE ARTISTES
/* ----------------------------- */

.artistes .liste-artistes{
  columns: 6;
}

.artistes-checkbox:before{
  float: left;
  width: 2rem;
  height: 2rem;
  position: relative;
  top: 0.4rem;
  content: '';
  margin-right: 1rem;
  border-radius: 0.3rem;
  text-align: center;
}

.artistes-checkbox.checked:before{
  content: 'x';
}

/* Mobile */
@media (max-width: 767px){

  .artistes .liste-artistes{
    columns: 2;
  }
}

/* Tiny */
@media (max-width: 319px){

  .artistes .liste-artistes{
    columns: 1;
  }
}


/* ----------------------------- */
/* PAGE ARTISTE
/* ----------------------------- */

.artiste-header{
  margin-bottom: 4rem;
}

.artiste-menu ul,
.artiste-menu li{
  display: inline;
}

.artiste-menu li:not(:last-child):after{
  content:', ';
}

.artiste section{
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.artiste section.is-visible{
  opacity: 1;
  transition: opacity 0.5s ease;
}

.artiste section.is-displayed{
  display: block;
}
.artiste section.travaux.is-displayed,
.artiste section.artiste-focus.is-displayed,
.artiste section.artiste-textes.is-displayed,
.artiste section.artiste-contact.is-displayed{
  display: grid;
}


/* Travaux */

.travaux .item img{
  display: block;
  width: 100%;
}

.item-image{
  position: relative;
}

.item-image > a{
  display: block;
}

.item-duree{
  position: absolute;
  bottom: 2rem;
  left: 2rem;
  padding: 0.2rem 0.4rem 0.1rem 0.4rem;
}

.item-titre{
  padding-top: 1.7rem;
}

.item-details{
  display: none;
}
.item:hover .item-details{
  display: grid;
}


/* CV */

.artiste-cv > div + div{
  margin-top: 5rem;
}
.artiste-cv h3{
  margin-bottom: 0.5em;
}

.artiste-cv * + h4,
.artiste-cv * + ul{
  margin-top: 1em;
}

.artiste-cv li{
  list-style: none;
}

.artiste-cv li:before{
  display: inline;
  content:'— ';
}

/* Textes */

.artiste-textes .billet{
  margin-bottom: 5rem;
}

.artiste-textes * + p{
  margin-top: 1em;
}
.artiste-textes p.auteur + p.lien-externe{
  margin-top: 0;
}

/* Contact */

.artiste-coordonnees{
  position: relative;
  top: -0.1em;
}

.artiste-coordonnees p + p{
  margin-top: 1em;
}

.artiste-galeries{
  margin-top: 3.4rem;
}



/* Desktop */
@media (min-width: 768px){

  .artiste-minibio{
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .artiste-minibio.is-visible{
    opacity: 1;
    transition: opacity 0.5s ease 0.3s;
  }

  .artiste-cv{
    columns: 4;
    column-gap: 2rem;
  }
  .artiste-cv > div{
    -webkit-column-break-inside: avoid;
            page-break-inside: avoid;
                 break-inside: avoid;
  }

}

/* Mobile */
@media (max-width: 767px){

  .artiste section{
    margin-bottom: 2rem;
  }

  .artiste-header{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 2rem;
  }

  .artiste-retour{
    display: none;
  }

  .artiste-textes .billet:last-child{
    margin-bottom: 0;
  }

  .artiste-photo{
    margin-bottom: 4rem;
  }


}


/* ----------------------------- */
/* PAGE ARTICLE (ACTU/FOCUS + TRAVAUX)
/* ----------------------------- */

.article-sticky{
  position: -webkit-sticky;
  position: sticky;
  top: 2rem;
}

.article-titrage{
  display: flex;
  margin-bottom: 3rem;
}

.article-galerie img,
.artiste-photo img{
  display: block;
  width: 100%;
  margin: auto;
}

.article-img .legende,
.artiste-photo .legende{
  margin-top: 1.7rem;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.article-img.paysage .legende,
.artiste-photo.paysage .legende{
  width: 80%;
}

.article-img.portrait img,
.article-img.portrait .legende,
.artiste-photo.portrait img,
.artiste-photo.portrait .legende{
  width: 60%;
}

.article-textes{
  margin-top: 0.5rem;
}

.article-publication{
  margin-bottom: 2rem;
}

.article-chapo{
  margin-bottom: 1em;
}

.article-texte * + p,
.article-texte * + h3{
  margin-top: 1em;
}

.video-wrapper{
  width: 100%;
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}

.video-wrapper iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.article-texte p.notes{
  margin-top: 2em;
}


/* Desktop */
@media (min-width: 768px){

  .article-titrage h1,
  .article-titrage h2{
    width: 80%;
  }
  .article-titrage .slider-counter{
    width: 20%;
    text-align: right;
  }

  .article-img + .article-img{
    margin-top: 7rem;
  }

}

/* Mobile */
@media (max-width: 767px){
  .article-retour,
  .article-titrage .slider-counter{
    display: none;
  }
  .article-galerie{
    margin-bottom: 4rem;
  }
  .article-img + .article-img{
    margin-top: 3rem;
  }
  .article-textes,
  .projet-textes{
    margin-bottom: 2rem;
  }
}


/* ----------------------------- */
/* OEUVRE
/* ----------------------------- */

.projet h1{
  margin-bottom: 2.5rem;
}

.projet-details{
  margin-bottom: 1em;
}

.projet-details span:after{
  content: ',';
}
.projet-details span:last-child:after{
  content: none;
}

.projet-details p + p{
  margin-top: 1em;
}

.projet .artiste-nom:hover{
  cursor: pointer;
}



/* ----------------------------- */
/* PAGE STANDARD
/* ----------------------------- */

.page-standard p + p,
.page-standard ul + p,
.page-standard * + h3{
  margin-top: 0.8em;
}

.texte-principal h3{
  display: inline-block;
}


.page-standard li:before,
.article-texte li:before{
  display: inline-block;
  content:'→';
  margin-right: 0.2em;
  position: relative;
  top: 0.1em;
}


/* Desktop */
@media (min-width: 768px){

  .texte-principal.wide,
  .texte-secondaire{
    columns: 2;
    column-gap: 2rem;
  }

  .texte-principal.wide > *,
  .texte-secondaire > *{
    -webkit-column-break-inside: avoid;
              page-break-inside: avoid;
                   break-inside: avoid;
  }

}

/* Mobile */
@media (max-width: 767px){
  .texte-principal{
    margin-bottom: 2.5rem;
  }
  .texte-secondaire{
    margin-bottom: 2rem;
  }
}