/* normalize */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type="button"],[type="reset"],[type="submit"],button{-webkit-appearance:button}[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
:root {
  --basefamily: 'Antique Olive', sans-serif;
  --altfamily: 'TroisMille', sans-serif;
  --troimillebold: "wdth" 250, "wght" 750; 
  --basesize: 0.9375em;
  --menuwidth: 280px; 
  --spacer: 40px;
  --extraspacer: 80px;
  --hover: #000; 
  --magenta: #d8117d;
  --basecolor: rgba(0,0,0,.8);
}
@media (max-width:1000px) {
  :root{
    --menuwidth: 200px; 
  }
}
@media (max-width:770px) {
  :root{
    --menuwidth: 0px; 
    --extraspacer: 40px;
  }
}
@media (max-width:650px) {
  :root{
    --basesize: 0.8125em;
    --spacer: 20px;
    --extraspacer: 20px;
  }
}
/* ------------------------------------------------------- common */
*, *::before, *::after { box-sizing: border-box; }
html, body {
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html, body {
    scroll-behavior: auto;
  }
}
/* ------------------------------------------------------- common */

body {
  font-family: var(--basefamily); 
  font-size: var(--basesize);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.4;  
  letter-spacing: .01em;
  color: var(--basecolor);
  margin: 0;
}
a {
  color: currentColor;
  text-decoration: none;
}
h1 {
  font-size: 1em; 
  margin: 0 0 .3em;
  font-weight:400;
  text-wrap: balance;
}
h2 {
  font-size: 1em; 
  font-weight: 400; 
  line-height: 1.85;         
  margin: 0 0 calc(80px - 1.85em);
}
@media (max-width:1100px){
  h2 {margin: 0 0 calc(40px - 1.85em);}
}
h3 {
  display: block;
  margin: 0 0 .5em 0; 
  font-weight: 400;
  font-size: 1em; 
}
h4 {
  font-weight:700; 
  font-size:1em; 
  display:inline-block; 
  margin:.5em 0 0;
}    

a { color: inherit; text-decoration: none; }
a:focus { color: var(--hover); }
a:hover, a:active, a:focus { outline: 0; }
a img { border:none; }
p, blockquote { margin: 0 0 .5em; padding: 0; }
ul, ol { list-style-type: none; margin: 0 0 .5em; padding: 0; }
.bref-title,
.big-title {
  font-weight: 400;
  font-size: 4.5em;
  font-size: calc(2rem + 3vw);
  margin-bottom: .35em;
  line-height: 1.1;
  line-height: .9;
  font-family: var(--altfamily);
  font-variation-settings: var(--troimillebold);
  text-wrap: balance;
}  
.bref-title.is-long,
.big-title.is-long { hyphens: auto;}  
@media (max-width:770px) {
  .bref-title,
  .big-title {
    font-size: calc(2rem + 2vw);
    }
}
.small, small {
  font-size: .8125rem;
}
.edit {
  position: fixed;
  bottom:20px;
  right:20px;
  width: 30px;
  height: 30px;
  z-index: 1000;
  padding: 6px;
  background: black;
  opacity: .2;
  border-radius: 9px;
  transition: 150ms;
  &:hover { opacity: 1;}
  svg{ width: 100%; height: auto;}
  path { fill:white}
}
/* 
.%%..%%..%%%%%%..%%%%%%..%%.......%%%%..
.%%..%%....%%......%%....%%......%%.....
.%%..%%....%%......%%....%%.......%%%%..
.%%..%%....%%......%%....%%..........%%.
..%%%%.....%%....%%%%%%..%%%%%%...%%%%..
........................................
*/
h4,
.menu .active, .menu a:hover,
.pagination .current,
#pages-menu li.active,
.text a,
aside p a,
.artistbio button,
#network-box > :first-child a,
.extramention a,
.focus .readmore a,
.underlined { 
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .15em;
}    
.menulink strong,
.close button span,
.scroll span,
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap; /* added line */
  border: 0;
}
                                                                       
.main:before, .main:after,
.grid-container:before, .grid-container:after,
#page main > section:before, #page main > section:after,
.clearfix:before, .clearfix:after { content: " "; display: table; }
.main:after,
.grid-container:after,
#page main > section:after,
.clearfix:after { clear: both; }

.fiesta {
  width: 60px;
  height: 60px;
}
h3:has(>.fiesta){
  display: flex;
  flex-direction: column;
  gap: 1em;
}
/*
..%%%%....%%%%...%%.......%%%%...%%%%%....%%%%..
.%%..%%..%%..%%..%%......%%..%%..%%..%%..%%.....
.%%......%%..%%..%%......%%..%%..%%%%%....%%%%..
.%%..%%..%%..%%..%%......%%..%%..%%..%%......%%.
..%%%%....%%%%...%%%%%%...%%%%...%%..%%...%%%%..
................................................
 */

.accent-color { color: var(--accent, #ee3300) } /*jaune */
.accent-background { background-color: var(--accent, #ee3300) } /*jaune */

.background-f4db1a { background-color: #f4db1a !important; background-color: #FFBF4D !important} /*jaune */
.background-FFBF4D { background-color: #FFBF4D !important} /*orange */
.background-FF7B52 { background-color: #FF7B52 !important; background-color: #FF6E2D} /*rouge orangé */
.background-ee3300 { background-color: #ee3300 !important} /*vermillon */
.background-df1800 { background-color: #df1800 !important} /*rouge  */
.background-EE79AD { background-color: #EE79AD !important} /*rose */
.background-4BBFE3 { background-color: #4BBFE3 !important} /*bleu pâle */
.background-009FE3 { background-color: #009FE3 !important} /*bleu cyan */
.background-1785B3 { background-color: #1785B3 !important} /*bleu roi */
.background-93C01F { background-color: #93C01F !important} /*vert anis */
.background-82DB24 { background-color: #82DB24 !important} /*vert vif */
.background-D2D2D4 { background-color: #D2D2D4 !important} /*gris clair */
.background-A8A8A9 { background-color: #A8A8A9 !important} /*gris moyen */
.background-E6E6E8 { background-color: #E6E6E8 !important} /*gris très clair */
.background-000000 { background-color: #000000 !important} /*k */

.page-f4db1a .text h3,  .page-f4db1a #site-header, .page-f4db1a #site-header ul a { color: #f4db1a; color: #FFBF4D !important}
.page-FFBF4D .text h3,  .page-FFBF4D #site-header, .page-FFBF4D #site-header ul a { color: #FFBF4D}
.page-FF7B52 .text h3,  .page-FF7B52 #site-header, .page-FF7B52 #site-header ul a { color: #FF7B52; color: #FF6E2D;}
.page-ee3300 .text h3,  .page-ee3300 #site-header, .page-ee3300 #site-header ul a { color: #ee3300}
.page-df1800 .text h3,  .page-df1800 #site-header, .page-df1800 #site-header ul a { color: #df1800}
.page-EE79AD .text h3,  .page-EE79AD #site-header, .page-EE79AD #site-header ul a { color: #EE79AD}
.page-4BBFE3 .text h3,  .page-4BBFE3 #site-header, .page-4BBFE3 #site-header ul a { color: #4BBFE3}
.page-009FE3 .text h3,  .page-009FE3 #site-header, .page-009FE3 #site-header ul a { color: #009FE3}
.page-1785B3 .text h3,  .page-1785B3 #site-header, .page-1785B3 #site-header ul a { color: #1785B3}
.page-93C01F .text h3,  .page-93C01F #site-header, .page-93C01F #site-header ul a { color: #93C01F}
.page-82DB24 .text h3,  .page-82DB24 #site-header, .page-82DB24 #site-header ul a { color: #82DB24}
.page-D2D2D4 .text h3,  .page-D2D2D4 #site-header, .page-D2D2D4 #site-header ul a { color: #D2D2D4}
.page-A8A8A9 .text h3,  .page-A8A8A9 #site-header, .page-A8A8A9 #site-header ul a { color: #A8A8A9}
.page-E6E6E8 .text h3,  .page-E6E6E8 #site-header, .page-E6E6E8 #site-header ul a { color: #E6E6E8}
.page-f4db1a #site-header a:hover, .color-f4db1a a:hover, a.color-f4db1a:hover { color: color-mix(in srgb, #f4db1a 60%, black)} /*jaune */
.page-FFBF4D #site-header a:hover, .color-FFBF4D a:hover, a.color-FFBF4D:hover { color: color-mix(in srgb, #FFBF4D 60%, black)} /*orange */
.page-FF7B52 #site-header a:hover, .color-FF7B52 a:hover, a.color-FF7B52:hover { color: color-mix(in srgb, #FF7B52 60%, black)} /*rouge orangé */
.page-ee3300 #site-header a:hover, .color-ee3300 a:hover, a.color-ee3300:hover { color: color-mix(in srgb, #ee3300 60%, black)} /*vermillon */
.page-df1800 #site-header a:hover, .color-df1800 a:hover, a.color-df1800:hover { color: color-mix(in srgb, #df1800 60%, black)} /*rouge  */
.page-EE79AD #site-header a:hover, .color-EE79AD a:hover, a.color-EE79AD:hover { color: color-mix(in srgb, #EE79AD 60%, black)} /*rose */
.page-4BBFE3 #site-header a:hover, .color-4BBFE3 a:hover, a.color-4BBFE3:hover { color: color-mix(in srgb, #4BBFE3 60%, black)} /*bleu pâle */
.page-009FE3 #site-header a:hover, .color-009FE3 a:hover, a.color-009FE3:hover { color: color-mix(in srgb, #009FE3 60%, black)} /*bleu cyan */
.page-1785B3 #site-header a:hover, .color-1785B3 a:hover, a.color-1785B3:hover { color: color-mix(in srgb, #1785B3 60%, black)} /*bleu roi */
.page-93C01F #site-header a:hover, .color-93C01F a:hover, a.color-93C01F:hover { color: color-mix(in srgb, #93C01F 60%, black)} /*vert anis */
.page-82DB24 #site-header a:hover, .color-82DB24 a:hover, a.color-82DB24:hover { color: color-mix(in srgb, #82DB24 60%, black)} /*vert vif */
.page-D2D2D4 #site-header a:hover, .color-D2D2D4 a:hover, a.color-D2D2D4:hover { color: color-mix(in srgb, #D2D2D4 60%, black)} /*gris clair */
.page-A8A8A9 #site-header a:hover, .color-A8A8A9 a:hover, a.color-A8A8A9:hover { color: color-mix(in srgb, #A8A8A9 60%, black)} /*gris moyen */
.page-E6E6E8 #site-header a:hover, .color-E6E6E8 a:hover, a.color-E6E6E8:hover { color: color-mix(in srgb, #E6E6E8 60%, black)} /*gris très clair */

.background-dark-f4db1a { background-color: color-mix(in srgb, #f4db1a 90%, black)} /*jaune */
.background-dark-FFBF4D { background-color: color-mix(in srgb, #FFBF4D 90%, black)} /*orange */
.background-dark-FF7B52 { background-color: color-mix(in srgb, #FF7B52 90%, black)} /*rouge orangé */
.background-dark-ee3300 { background-color: color-mix(in srgb, #ee3300 90%, black)} /*vermillon */
.background-dark-df1800 { background-color: color-mix(in srgb, #df1800 90%, black)} /*rouge  */
.background-dark-EE79AD { background-color: color-mix(in srgb, #EE79AD 90%, black)} /*rose */
.background-dark-4BBFE3 { background-color: color-mix(in srgb, #4BBFE3 90%, black)} /*bleu pâle */
.background-dark-009FE3 { background-color: color-mix(in srgb, #009FE3 90%, black)} /*bleu cyan */
.background-dark-1785B3 { background-color: color-mix(in srgb, #1785B3 90%, black)} /*bleu roi */
.background-dark-93C01F { background-color: color-mix(in srgb, #93C01F 90%, black)} /*vert anis */
.background-dark-82DB24 { background-color: color-mix(in srgb, #82DB24 90%, black)} /*vert vif */
.background-dark-D2D2D4 { background-color: color-mix(in srgb, #D2D2D4 90%, black)} /*gris clair */
.background-dark-A8A8A9 { background-color: color-mix(in srgb, #A8A8A9 90%, black)} /*gris moyen */
.background-dark-E6E6E8 { background-color: color-mix(in srgb, #E6E6E8 90%, black)} /*gris très clair */


.color-f4db1a, .color-f4db1a a { color: #f4db1a; color: #FFBF4D !important} /*jaune */
.color-FFBF4D, .color-FFBF4D a { color: #FFBF4D} /*orange */
.color-FF7B52, .color-FF7B52 a { color: #FF7B52; color: #FF6E2D} /*rouge orangé */
.color-ee3300, .color-ee3300 a { color: #ee3300} /*vermillon */
.color-df1800, .color-df1800 a { color: #df1800} /*rouge  */
.color-EE79AD, .color-EE79AD a { color: #EE79AD} /*rose */
.color-4BBFE3, .color-4BBFE3 a { color: #4BBFE3} /*bleu pâle */
.color-009FE3, .color-009FE3 a { color: #009FE3} /*bleu cyan */
.color-1785B3, .color-1785B3 a { color: #1785B3} /*bleu roi */
.color-93C01F, .color-93C01F a { color: #93C01F} /*vert anis */
.color-82DB24, .color-82DB24 a { color: #82DB24} /*vert vif */
.color-D2D2D4, .color-D2D2D4 a { color: #D2D2D4} /*gris clair */
.color-A8A8A9, .color-A8A8A9 a { color: #A8A8A9} /*gris moyen */
.color-E6E6E8, .color-E6E6E8 a { color: #E6E6E8} /*gris très clair */
.color-000000, .color-000000 a { color: #000000} /*K */

.color-f4db1a #search_path { fill: #f4db1a; fill: #FFBF4D !important} /*jaune */
.color-FFBF4D #search_path { fill: #FFBF4D} /*orange */
.color-FF7B52 #search_path { fill: #FF7B52; fill: #FF6E2D} /*rouge orangé */
.color-ee3300 #search_path { fill: #ee3300} /*vermillon */
.color-df1800 #search_path { fill: #df1800} /*rouge  */
.color-EE79AD #search_path { fill: #EE79AD} /*rose */
.color-4BBFE3 #search_path { fill: #4BBFE3} /*bleu pâle */
.color-009FE3 #search_path { fill: #009FE3} /*bleu cyan */
.color-1785B3 #search_path { fill: #1785B3} /*bleu roi */
.color-93C01F #search_path { fill: #93C01F} /*vert anis */
.color-82DB24 #search_path { fill: #82DB24} /*vert vif */
.color-D2D2D4 #search_path { fill: #D2D2D4} /*gris clair */
.color-A8A8A9 #search_path { fill: #A8A8A9} /*gris moyen */
.color-E6E6E8 #search_path { fill: #E6E6E8} /*gris très clair */

/* 
.%%..%%..%%%%%%...%%%%...%%%%%...%%%%%%..%%%%%..
.%%..%%..%%......%%..%%..%%..%%..%%......%%..%%.
.%%%%%%..%%%%....%%%%%%..%%..%%..%%%%....%%%%%..
.%%..%%..%%......%%..%%..%%..%%..%%......%%..%%.
.%%..%%..%%%%%%..%%..%%..%%%%%...%%%%%%..%%..%%.
................................................
*/

.site-header {
  z-index: 1000;
  width: var(--menuwidth);
  padding-left: 80px;
  top: 0;
  padding-top: 40px;
  position: sticky;
  top: 0;
}
.site-header h1 {
    font-family: var(--altfamily);
    font-weight: 400;
    margin: 0;
    line-height: 1.35;
    position: relative;
    font-size: 100%;
}
.site-header h1 a {
  color: rgba(0, 0, 0, 0);
  display: block;
  padding-top: 0.5em;
}
.site-header img {
  width: 170px;
  height: 54px;
  
}
 @media (max-width:850px) {
  .site-header img {width: 128px;}
}
@media (max-width:1000px) {
  .site-header {
      padding-left: 40px;
  }
}
.menu {
  margin-top: 80px;
}
.menu li {
  font-size: 1em;
  margin: 0 0 1em;
  padding: 0;
  line-height: 1;
  font-weight: 400;
}
.menu a:hover { color: black;}
.menulink {
  cursor: pointer;
  background: none;
  border: none;
  display: block;
  width: 100px;
  height: 100px;
  position: fixed;
  right: 0;
  top: 0;
  overflow: hidden;
  z-index: 3;
  display: none;
}
.menulink div {
  padding: 35px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.menulink span.trait {
  height: 3px;
  width: 25px;
  background: black;
  display: block;
  position: absolute;
  transform: translateX(0px);
}
.menulink .trait:nth-child(1) { top: 40px; transition: all 150ms; }
.menulink .trait:nth-child(2) { top: 49px; transition: all 150ms; }
.menulink .trait:nth-child(3) { top: 58px; transition: all 150ms; }
.menulink .trait:nth-child(4) { top: 49px; visibility: hidden; transition: all 150ms;}
  
#fullheader .menulink:not(.opened) span.trait { background: white;}
.page-residences .menulink span.trait { background: white; }
.page-venez .menulink span.trait { background: white; }
#fullheader-page .menulink span.trait { background: white; }
.page-residences .menulink.opened span.trait { background: black; }
.page-venez .menulink.opened span.trait { background: black; }
#fullheader-page .menulink.opened span.trait { background: black; }
.menulink.opened {
  z-index: 1800;
}
.menulink.opened .trait:nth-child(1) {
  opacity: 0;
  transform: rotate(45deg);
  transform-origin: 5px 8px;
}
.menulink.opened .trait:nth-child(2) {
  transform: rotate(-45deg);
  transform-origin: center center;
}
.menulink.opened .trait:nth-child(3) {
  opacity: 0;
}
.menulink.opened  .trait:nth-child(4) {
  visibility: visible;
  transform: rotate(45deg);
  transform-origin: center center;
}
.logo-anim {
  display: block;
  height: 70px;
  width: 70px;
  position: absolute;
  left: -76px;
  top: -16px;
}
.logo-anim div {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 70px;
    width: 70px;
    overflow-y: hidden;
    background-repeat: no-repeat;
  }
.logo-anim .b {
    background-image: url("../images/_logo_anim_bo.svg");
    background-position: -70px 0;
    animation: play_b 0.6s steps(30) 2 0.4s;
  }
.logo-anim .o {
    background-image: url("../images/_logo_anim_bo.svg");
    background-position: 0 0;
    animation: play_o 0.6s steps(30) 2 0.6s;
  }
.logo-anim.logo-anim-w .b { background-image: url("../images/_logo_anim_bo_w.svg"); }
.logo-anim.logo-anim-w .o { background-image: url("../images/_logo_anim_bo_w.svg"); }
.logo-anim .b.animated {
  animation-play-state: running;
  animation-iteration-count: infinite;
}
.logo-anim .o.animated {
  animation-play-state: running;
  animation-iteration-count: infinite;
  animation-delay: 0.2s;
}
.logo-anim .b.endanim,
.logo-anim .o.endanim {
  animation-iteration-count: 1;
  animation-fill-mode: backwards;
}
.logo-anim .o.endanim {
  animation-delay: 0.2s;
}
@media (min-width:770px) and (max-width:1000px) {
  .logo-anim {
    position: relative;
    top: 0;
    left: 0;
  }
  .logo-anim .b { 
    background-image: url("../images/_logo_anim_bo_left.svg"); 
    background-size: 140px auto;
  }
  .logo-anim .o { 
    background-image: url("../images/_logo_anim_bo_left.svg"); 
    background-size: 140px auto;
  }
  .logo-anim.logo-anim-w .b { background-image: url("../images/_logo_anim_bo_w_left.svg"); }
  .logo-anim.logo-anim-w .o { background-image: url("../images/_logo_anim_bo_w_left.svg"); }
}
@keyframes play_b {
  0% { background-position: -70px 0; }
  100% { background-position: -70px -2100px; }
}
@keyframes play_o {
  0% { background-position: 0 0; }
  100% { background-position: 0 -2100px; }
}
.search-form{
  display: flex;  
}
.search-button{
  padding: 0;
  border:none;
  width: 1.15em;
  height: 1.15em;
  display: block;
  overflow: hidden;
  background: transparent;
}
.search-button svg{
  width: 100%;
  height: 100%;
  object-fit: contain;
  
}
#go-search{display: none;}
.search-input {
  font-family: inherit;
  font-size: inherit;
  text-transform: inherit;
  color: inherit;
  border: none;
  padding: 0;
  line-height: 1;
  background: transparent;
  display: none;
  flex: 1;
}
.search-input:focus{
  outline: none;
}
#go-search svg {
  transform: scale(.8);
  position: relative;
  top: -.15em;
}
.search-visible .search-form {
  border-bottom: 1px solid;
}
.search-visible #show-search { display: none;}
.search-visible #go-search { display: block;}
.search-visible .search-input { display: block; }
@media (max-width:650px){
.search-visible li:not(:last-child)  {
    display: none;
  }
}
.search-query {
  max-width: 580px;
}
.search_results {
  margin: 40px 0 0;
  max-width: 580px;
}
.search_results ul { list-style-type: none; margin: 0;}
.search_results li { margin-bottom: 1em; }
.search_results h1 { 
  font-family: var(--altfamily);
  font-variation-settings: var(--troimillebold);
  font-size: 2em;
  line-height: 1.1;
}
.search_results p {
  margin: 0;
}

@media (max-width: 770px ) {
  .site-header { width: 100%; position: static;}
  #fullheader + #page #menu-header h1,
  #fullheader + #page #menu-header .menulink {display: none;}
  
  .site-header {
    display: block;
    padding-top: 40px;
    padding-left: 76px;
    margin-bottom: 40px;
  }
  #fullheader + #page .site-header { margin: 0; padding: 0;}
  
  
  .menulink {
      display: block;
      position: absolute; 
      z-index: 800;
      right: 25px;
      top:25px;
      
      }
  #nav {
      position: fixed;
      z-index: 800;
      width: 50%;
      width: 50vw;
      height: 100%;
      top:0;
      right:0;
      background: white;
      padding: 2em;
      transition: transform 150ms;
      transform: translateX(100%);
      }
  #nav.opened{
      transform: translateX(0);
    }
  
}
@media (max-width: 650px ) {
  #nav {
    width: 100%;
    width: 100vw;
  }
  .site-header { padding-left: 56px;}
}
@media (max-width: 410px ) {
  .menulink { right: 0; top:0; width: 90px; div{ padding-right: 25px; } }
  .site-header {
      margin-bottom: 21px;
      display: block;
      padding-top: 20px;
      padding-left: 56px;
      margin-bottom: 16px;
      h1 { margin: 0;}
      h1 a img { width: 128px; height: auto; }
      h1 .logo-anim { top: 0; transform: scale(.85)}
      h1 .logo-anim div{ animation:none !important}
  }
        
}
/* 
.%%...%%...%%%%...%%%%%%..%%..%%.
.%%%.%%%..%%..%%....%%....%%%.%%.
.%%.%.%%..%%%%%%....%%....%%.%%%.
.%%...%%..%%..%%....%%....%%..%%.
.%%...%%..%%..%%..%%%%%%..%%..%%.
.................................
*/

body.locked {
  overflow: hidden;
}
#page {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
#page main {
  padding: 0 var(--spacer);
  flex: 1;
  align-self: stretch;
}
#page main > section {
  padding: 40px 0 40px 0;     
}
#page main > section + section { padding-top: 0;}
@media (max-width: 770px ) {
  #page {flex-direction: column;}
}
/* 
.%%%%%%..%%..%%..%%......%%.....
.%%......%%..%%..%%......%%.....
.%%%%....%%..%%..%%......%%.....
.%%......%%..%%..%%......%%.....
.%%.......%%%%...%%%%%%..%%%%%%.
................................
*/
/* Trois types de pages : - noheader - fullheader - semiheader */
#fullheader {
  height: 100%;
  height: 100vh;
  width: 100%;
  top: 0;
  left: 0;
  position: fixed;
  padding: 40px var(--spacer);
  color: white;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#fullheader header {
  width: 50%;
  max-width: min(680px, 75vw);
  position: relative;
  margin-left: 50%;
  transition: opacity 250ms;
}
#fullheader a {
  color: white;
}
#fullheader h1 a {
  color: rgba(0, 0, 0, 0);
}
#fullheader svg path, #fullheader polygon {
  fill: white !important;
}
#fullheader .site-header {
  position: absolute;
  left: 0;
}
#fullheader .site-header {
  transform: translateY(calc(var(--y, 0) * -1));
}
#fullheader .big-header {
  transform: translateY(calc(var(--y, 0) * -1 / 2));
}
#fullheader .image-container {
  transform: translateY(calc(var(--y, 0) * -1 / 4));
}
#fullheader .fullheader-infos {
  max-width: 60ch;
}
body.locked #fullheader {
  position: absolute;
}
.scroll {
  z-index: 1;
  position: absolute;
  top: 100%;
  left: 50%;
  height: 100px;
  width: 100px;
  margin-left: -50px;
  border-radius: 100px;
  background: url(../images/scroll.svg) no-repeat 50% 100%;
  animation: slideup 600ms ease-out 1500ms forwards, pulsate 800ms ease-out infinite;
  transition: all 250ms ease-out;
  --scale: 1;
}
.scroll:hover {
	background-position: 50% 40%;
	animation: slideup 400ms ease-out forwards;
}
 @media (max-width: 770px) {
	.scroll { display: none; }
}
 @media (min-height: 680px) {
	.scroll { display: block; }
}
@keyframes pulsate {
  0%{opacity:1}
  35%{opacity:1}
  60%{opacity:.5}
  80%{opacity:1}
  100%{opacity:1}
}
@keyframes slideup {
  from{transform:scale(var(--scale)) translateY(0)}
  50%{transform:scale(var(--scale)) translateY(-100px)}
  to{transform:scale(var(--scale)) translateY(-100px)}
}
.focus-gridimg, .image-container {
  height: 100%;
  width: calc(50% + 20px);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 80px;
  top: 0;
  will-change: transform;
}
.focus-gridimg a, .image-container a {
  position: relative;
  display: block;
}
.focus-gridimg a:after, .image-container a:after {
  content: '+';
  display: block;
  position: absolute;
  bottom: calc(20px - .5em);
  left: 20px;
  opacity: 0.5;
  transition: opacity 250ms;
  color: var(--accent);
}
.focus-gridimg a:hover:after, .image-container a:hover:after {
  opacity: 1;
  color: white;
}
.focus-gridimg img, .image-container img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: multiply;
  max-width: 100%;
}
.js .big-header {
  opacity: 0;
}
.js .loaded .big-header {
  opacity: 1;
}
#fullheader + #page, #page {
  position: relative;
  z-index: 2;
  background-color: white;
  position: sticky;
  top: var(--offset);
}
#fullheader + #page {
  margin-top: 100vh;
}
@media (max-width: 770px) {
  #fullheader, #fullheader + #page, #page {
    position: static;
	}
  #fullheader + #page {
    margin-top: 0;
	}
  #fullheader {
    height: auto;
    min-height: 100vh;
    position: static;
    padding-bottom: 2em !important;
    display: block;
	}
  #fullheader header {
    width: 100%;
    max-width: none;
    position: static;
    margin: 6px 0 40px 0;
	}
  #fullheader .site-header {
    width: 100%;
    position: static;
    padding-top: 0;
    padding-left: 34px;
    margin-bottom: 40px;
	}
  #fullheader .site-header, #fullheader .big-header, #fullheader .image-container {
    transform: none;
	}
  .image-container {
    height: auto;
    display: block;
    position: static;
    margin: 0 calc(-1 * var(--spacer));
    width: auto;
	}
  .image-container a:after {
    display: none;
	}
}
@media (max-width: 410px) {
  #fullheader {
    padding: var(--spacer);
  }
  #fullheader .site-header {
    margin-bottom: var(--spacer);
	}
}
 
/* 
..%%%%...%%%%%...%%%%%%..%%%%%..
.%%......%%..%%....%%....%%..%%.
.%%.%%%..%%%%%.....%%....%%..%%.
.%%..%%..%%..%%....%%....%%..%%.
..%%%%...%%..%%..%%%%%%..%%%%%..
................................
*/
.grid-container {
  padding-right: 0 !important;
  margin-right: -40px;
}
.item {
  float: left;
  margin: 0 0 40px 0;
  position: relative;
}
.item img {
  width: 100%;
  height: auto;
  display: block;
}
.item h1 {
  margin-top: 0.5em;
}
.item p {
  font-size: 0.85em;
}
.asuivre .grid-sizer,
.images .grid-sizer,
.residences .grid-sizer,
.publications .grid-sizer,
.asuivre .item,
.images .item,
.residences .item,
.publications .item {
  width: calc((100% - 120px) / 4);
}
.asuivre .item.gros,
.images .item.gros,
.residences .item.gros,
.publications .item.gros {
  width: calc((100% - 40px) / 2);
}
.residences .item-residence span+span {
  display: block;
  margin-top: 0.5em;
}
.item-asuivre.title-big h1 {
  font-family: var(--altfamily);
  font-variation-settings: "wdth" 100, "wght" 150;
  line-height: 0.9;
  margin: -0.25em 0 0.2em;
  font-size: 60px;
  font-weight: 300;
}
.item-asuivre.title-medium h1 {
  margin-bottom: 0.2em;
  font-size: 30px;
  font-family: var(--altfamily);
  font-variation-settings: var(--troimillebold);
  line-height: 1.1;
}
.item-asuivre h2 {
  font-size: 1.25em;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  border: none;
}
.item-asuivre.extract .description {
  font-size: 1.25em;
  line-height: 1.25;
  letter-spacing: 0;
  font-weight: bold;
}
.js .grid .item {
  opacity: 0;
}
.js .grid.layoutComplete .item {
  opacity: 1;
}
@media (max-width: 1100px) {

  .asuivre .grid-sizer,
  .images .grid-sizer,
  .publications .grid-sizer,
  .residences .grid-sizer,
  .asuivre .item,
  .images .item,
  .publications .item,
  .residences .item {
    width: calc((100% - 80px) / 3);
  }
  .asuivre .item.gros,
  .images .item.gros,
  .publications .item.gros,
  .residences .item.gros {
    width: calc((100% - 40px) / 2);
  }
}
@media (max-width: 770px) {

  .asuivre .grid-sizer,
  .images .grid-sizer,
  .publications .grid-sizer,
  .residences .grid-sizer,
  .asuivre .item,
  .images .item,
  .publications .item,
  .residences .item {
    width: calc((100% - 40px) / 2);
  }
  .asuivre .item.gros,
  .images .item.gros,
  .publications .item.gros,
  .residences .item.gros {
    width: 100%;
  }
}
@media (max-width: 580px) {
  .js .grid .item {
    opacity: 1;
  }
  .asuivre .grid-sizer,
  .images .grid-sizer,
  .publications .grid-sizer,
  .residences .grid-sizer,
  .asuivre .item,
  .images .item,
  .publications .item,
  .residences .item {
    width: 100%;
  }
}
/* 
.%%%%%%..%%..%%..%%%%%%..%%%%%....%%%%..
.%%.......%%%%.....%%....%%..%%..%%..%%.
.%%%%......%%......%%....%%%%%...%%%%%%.
.%%.......%%%%.....%%....%%..%%..%%..%%.
.%%%%%%..%%..%%....%%....%%..%%..%%..%%.
........................................
*/

#extra {
  position: relative;
  z-index: 3
}
@media (max-width: 770px) {
  #extra {
    margin-top: -40px
  }
}
#extraloaded {
  background: #222;
  color: #fff;
  padding: 80px
}
@media (max-width: 770px) {
  #extraloaded {
    padding: 40px
  }
}
@media (max-width: 650px) {
  #extraloaded {
    padding: 20px
  }
}
.close {
  position: sticky;
  top: 40px;
  text-align: right;
  z-index: 4;
  margin: -60px -60px 60px 0;
  cursor: pointer
}
.close button {
  width: 40px;
  height: 40px;
  background: url(../images/close.svg);
  border: none;
  position: absolute;
  right: 0;
  cursor: pointer;
}

@media (max-width: 770px) {
  .close {
    margin: -20px -20px 60px 0;
    float: none
  }
}
@media (max-width: 650px) {
  .close {
    margin: 0 0 60px;
    top: 20px;
    float: none
  }
}
.extralist-item:nth-of-type(1) {
  background-color: #292929
}
.extralist-item:nth-of-type(2) {
  background-color: #0f0f0f
}
.extralist-item:nth-of-type(3) {
  background-color: #262626
}
.extralist-item:nth-of-type(4) {
  background-color: #141414
}
.extralist-item:nth-of-type(5) {
  background-color: #2e2e2e
}
.extralist-item:nth-of-type(6) {
  background-color: #171717
}
.extralist-item:nth-of-type(7) {
  background-color: #292929
}
.extralist-item:nth-of-type(8) {
  background-color: #242424
}
.extralist-item:nth-of-type(9) {
  background-color: #0f0f0f
}
.extralist-item:nth-of-type(10) {
  background-color: #1f1f1f
}
[data-template="extrapage"] #extra {
  background: #222;
  color: #fff;
  padding: var(--extraspacer)
}
.font-family-antique-olive-std {
  font-family: var(--basefamily)
}
.font-family-troismille250750 {
  font-family: var(--altfamily);
  font-variation-settings: wdth 250, wght 750
}
.font-family-troismille500000 {
  font-family: var(--altfamily);
  font-variation-settings: wdth 500, wght 0
}
.font-family-troismille500500 {
  font-family: var(--altfamily);
  font-variation-settings: wdth 500, wght 500
}
.default-item,
.gallery-item {
  text-align: left
}
.default-item img,
.gallery-item img {
  max-width: 100%;
  height: auto
}
.text-max-width {
  max-width: 40em;
  text-align: left
}
.text-max-width li {
  margin-bottom: .5em;
  text-indent: -3em;
  padding-left: 3em
}
.text-max-width h3,
.text-max-width h4 {
  font-family: var(--altfamily);
  font-variation-settings: wdth 500, wght 750;
  font-size: 1.5rem;
  margin-bottom: .25em
}
.media-title {
  font-family: var(--altfamily);
  font-variation-settings: wdth 500, wght 500;
  font-size: 2em;
  margin-bottom: .5em;
  line-height: 1.2
}
.media-text {
  line-height: 1.5
}
.media-text a {
  border-bottom: 1px solid
}
.media-quote {
  font-size: 1.5em;
  line-height: 1.3
}
.media-quote em {
  font-family: var(--basefamily)
}
.media-quote a {
  border-bottom: 1px solid
}
.template-default {
  margin: 0 var(--extraspacer) var(--spacerextra)
}
.default-item {
  margin: 0 160px var(--spacerextra)
}
.default-item.huge {
  margin: 0 0 var(--spacerextra)
}
.gutter-sizer,
.grid-sizer {
  display: block
}
#extra .gutter-sizer {
  width: var(--extraspacer)
}
#extra .gallery-item,
#extra .grid-sizer {
  width: calc((100% - 160px) / 3)
}
#extra .gallery-item.gros {
  width: calc((100% - 160px) / 1.5 + 80px)
}
#extra .gallery-item.huge {
  width: 100%
}
#extra .gallery-item:first-of-type {
  padding-top: 0 !important
}
@media (max-width: 770px) {

  #extra .gallery-item,
  #extra .grid-sizer,
  #extra .gallery-item.gros {
    width: 100%
  }
  #extra .extra-gridimg .grid-sizer,
  .extra-gridimg-item {
    width: calc((100% - 240px) / 4)
  }
}
.media-caption {
  font-family: var(--basefamily);
  margin-top: 1em;
  font-size: .85rem;
  color: #ffffff80;
  max-width: 40em
}
.media-caption a {
  border-bottom: 1px solid
}
.media-heading h3 {
  font-family: var(--altfamily);
  font-variation-settings: wdth 500, wght 500;
  font-size: 2em;
  margin-bottom: .5em;
  line-height: 1.2
}
.gros.media-quote {
  font-size: 2em
}
.huge.media-quote {
  font-size: 2.5em
}
.huge.media-quote .media-author {
  margin-left: 160px;
  max-width: 40em
}
.template-gallery .huge.media-quote .media-author {
  margin-left: 240px
}
.media-author {
  font-size: .85rem;
  letter-spacing: .05em;
  font-weight: 400;
  font-family: var(--basefamily)
}
.caption {
  text-align: left !important
}
.caption p {
  line-height: 1.3
}
.media-audio-player {
  font-family: var(--altfamily);
  font-variation-settings: wdth 500, wght 500;
  font-size: 1.2em;
  line-height: 1.3;
  background: #fff;
  color: #000
}
.media-audio-player .plyr {
  font-family: inherit;
  font-size: inherit
}
.media-audio-player .audio-title {
  padding: 0 20px 20px;
  display: block
}
.media-audio-player .audio-title+.media-description {
  margin-top: -20px;
  padding: 0 20px 20px
}
.media-audio-player .media-description {
  font-size: .85rem;
  letter-spacing: .05em;
  max-width: 40em;
  font-weight: 400;
  font-family: var(--basefamily)
}
.media-player {
  padding: 20px 20px 0
}
.media-player:after {
  content: "";
  display: block;
  width: 15px;
  border-bottom: 3px solid;
  margin: .75em 0 .5em
}
.playpause {
  border: none;
  text-indent: 80px;
  white-space: nowrap;
  width: 40px;
  height: 40px;
  overflow: hidden;
  background: url(../images/playpause.svg) no-repeat;
  display: block;
  margin-bottom: 1em
}
.playpause.playing {
  background-position: 0 -40px
}


/* 
.%%..%%...%%%%...%%...%%..%%%%%%.
.%%..%%..%%..%%..%%%.%%%..%%.....
.%%%%%%..%%..%%..%%.%.%%..%%%%...
.%%..%%..%%..%%..%%...%%..%%.....
.%%..%%...%%%%...%%...%%..%%%%%%.
.................................
*/

.focuses-container {
	background: #eee;
	position: relative;
	height: 100vh;
	width: calc(100% + 40px + var(--menuwidth) + 40px);
	margin-left: calc(-40px - var(--menuwidth));
}

.focuses {
	width: 100%;
	height: 100%;
	height: 100vh;
}
.no-js .focuses > * {display: none;}
.no-js .focuses > :first-child {display: flex;}
.focus {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	height: 100vh;
	padding-left: var(--menuwidth);
	background: var(--accent);
	position: relative;
	color: white;
	--gridspacer: 80px;
}
.focus .focus-gridimg {
	left: calc(var(--menuwidth));
	width: calc((100% - var(--menuwidth) - 80px));
	display: block;
	top: 50%;
	transform: translateY(-50%);
}
.focus .grid-sizer, .focus .extra-gridimg-item {
	width: calc((100% - 80px) / 3);
}
.focus .extra-gridimg-item {
	opacity: 0;
	margin-bottom: 40px;
	padding-top: calc(var(--paddingTop) * var(--gridspacer));
	padding-bottom: calc(var(--paddingBottom) * var(--gridspacer));
}
.focus .extra-gridimg-item span {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: var(--align, start);
}
.focus .extra-gridimg-item img {
	display: block;
	height: auto;
	width: auto;
}
.focus.is_extra img {
	filter: grayscale(1);
}
.focus .layoutComplete .extra-gridimg-item {
	opacity: 1;
}
.focus .image-container {
	left: calc(var(--menuwidth) + 80px);
	left: auto;
	right: 40px;
	width: calc((100% - var(--menuwidth)) / 1.5 + 20px);
}
.focus .image-container span {
	display: block;
}
.focus .focus-gridimg {
	position: absolute !important;
}
.focus .readmore {
	margin: 1em 0 0;
}
.focus .big-header {
	width: 50%;
	position: relative;
	margin-left: 40px;
  max-width: min(680px, 75vw);
	transition: opacity 250ms;
}
.focus .big-header .focus-text {
	display: -webkit-box;
	-webkit-line-clamp: 8;
	-webkit-box-orient: vertical;
	overflow: hidden;
  text-wrap: balance;
}
.focus .big-header .focus-text p {
	margin: 0;
}
 @media (max-width: 770px) {
	.focuses-container {
		width: calc(100% + var(--spacer) * 2);
		margin-left: calc(-1 * var(--spacer));
		height: calc(100vh - 100px);
		/* magick number… */
	}
	.focus {
		flex-direction: column;
		height: calc(100vh - 100px);
		/* magick number… */
	}
	.focus .focus-gridimg + .big-header {
		padding-top: calc(56% + var(--spacer));
	}
	.focus .grid-sizer, .focus .extra-gridimg-item {
		width: calc((100% - 40px) / 2);
	}
	.focus .image-container {
		width: 100%;
	}
	.focus .big-header {
		align-self: flex-start;
		width: auto;
		margin: 0;
		max-width: 100%;
		padding: 6px var(--spacer) var(--spacer) var(--spacer);
		flex: 1;
		overflow: hidden;
	}
	.focus .focus-gridimg {
		width: 100%;
	}
}
.flickity-prev-next-button.previous {
	left: calc(var(--menuwidth) + 10px);
	left: auto;
	right: 80px;
	top: 80px;
}
.flickity-prev-next-button.next {
	right: auto;
	right: 40px;
	top: 80px;
}
.flickity-prev-next-button, .flickity-prev-next-button:hover {
	color: white;
	left: auto;
	right: au;
	background: none;
}
.focusdots {
	position: absolute;
	top: 80px;
	right: var(--spacer);
	z-index: 2;
	display: flex;
}
 @media (max-width: 770px) {
	.focusdots {
		display: none;
	}
}
.focusdot {
	border: none;
	background: none;
	color: white;
	font-family: var(--altfamily);
	font-variation-settings: "wdth" 0, "wght" 200;
	font-size: 2.5em;
	padding: 0 0.2em;
	opacity: 0.5;
	transition: opacity 150ms;
	cursor: pointer;
}
.focusdot:hover, .focusdot.is-selected {
	opacity: 1;
}
 #calendar-content {
	display: grid;
	grid-template-columns: 4em 3em 1fr;
	grid-gap: 0.25em 0;
}
.calendar-month {
	grid-column: 1;
	text-transform: uppercase;
}
.calendar-day {
	grid-column: 2;
}
.calendar-event {
	grid-column: 3;
}
.calendar-event a:hover {
	color: var(--fluo);
}
 #calendar h2 {
	margin-bottom: 1em;
	grid-column: 1 / span 3;
	color: #4bbfe3;
}
 
/* 
.%%%%%%...%%%%....%%%%...%%%%%%..%%%%%%..%%%%%..
.%%......%%..%%..%%..%%....%%....%%......%%..%%.
.%%%%....%%..%%..%%..%%....%%....%%%%....%%%%%..
.%%......%%..%%..%%..%%....%%....%%......%%..%%.
.%%.......%%%%....%%%%.....%%....%%%%%%..%%..%%.
................................................
*/

#footer {
  padding: 120px 0 80px calc(var(--menuwidth) + var(--spacer));
  position: relative;
  background: white;
  z-index: 4;
  display: flex;
}
#footer #ppp {
  float: left;
  margin: -70px 0 1em -2px;
}
#footer #ppp+p {
  clear: both;
}
#footer #ppp img {
  width: 200px;
  display: block;
}
#footer div {
  max-width: 270px;
  margin-right: 40px;
}
@media (max-width: 850px) {
  #footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px 0;
  }
  #footer div:first-of-type {
    grid-column: span 2;
  }
}
@media (max-width: 770px) {
  #footer {
    padding-left: var(--spacer);
  }
}
@media (max-width: 550px) {
  #footer {
    grid-template-columns: 1fr;
  }
  #footer div:first-of-type {
    grid-column: span 1;
  }
}


/* 
.%%..%%..%%%%%%..%%...%%...%%%%..
.%%%.%%..%%......%%...%%..%%.....
.%%.%%%..%%%%....%%.%.%%...%%%%..
.%%..%%..%%......%%%%%%%......%%.
.%%..%%..%%%%%%...%%.%%....%%%%..
.................................
*/
#newsletters h2 { color:#ee3300; margin: 42px 0 20px;}
#newsletters a:hover { color:#ee3300;}
/* 
.....%%...%%%%.......%%.
.%%..%%..%%..%%..%%..%%.
.%%%%%%..%%%%%%..%%%%%%.
.....%%..%%..%%......%%.
.....%%...%%%%.......%%.
........................
*/

#quatrecentquatre h1 {
  color: #f4db1a;
  -moz-animation: fluo 20s linear infinite;
  -webkit-animation: fluo 20s linear infinite;
  animation: fluo 20s linear infinite;
  max-width: 18em;
  font-size: calc(6vw + 2em);
  margin-top: 0px;
}
/* 
..%%%%...%%%%%....%%%%...%%..%%..%%%%%%..%%..%%..%%%%%%...%%%%..
.%%..%%..%%..%%..%%..%%..%%..%%....%%....%%..%%..%%......%%.....
.%%%%%%..%%%%%...%%......%%%%%%....%%....%%..%%..%%%%.....%%%%..
.%%..%%..%%..%%..%%..%%..%%..%%....%%.....%%%%...%%..........%%.
.%%..%%..%%..%%...%%%%...%%..%%..%%%%%%....%%....%%%%%%...%%%%..
................................................................
*/
.publication-image {
  max-width: 600px;
  margin: 40px 0;
}
.publication-image img {
  max-width: 100%;
}
.bref-title {
  margin-top: -0.3em;
  max-width: 18em;
  font-size: calc(6vw + 2em);
}
.archiveyear:first-child {
  text-align: left;
  margin-top: 0;
  font-size: 100px;
  font-weight: 900;
  font-family: var(--altfamily);
  font-variation-settings: var(--troimillebold);
  font-weight: normal;
  color: black;
}
.item-images img {
  display: block;
  position: relative;
}
.item-images .details {
  text-align: left;
  position: absolute;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  inset: 0;
  padding: 20px;
  opacity: 0;
  color: white;
}
.item-images .details::before {
  content: " ";
  mix-blend-mode: multiply;
  display: block;
  inset: 0;
  position: absolute;
  z-index: 0;
  background: var(--bofluo);
}
.item-images .details::after {
  content: " ";
  display: block;
  inset: 0;
  position: absolute;
  z-index: 0;
  opacity: 0.8;
  background: var(--bofluo);
}
.item-images .details>* {
  position: relative;
  z-index: 1;
}
.item-images :hover .details {
  opacity: 1;
}
/* 
.%%......%%%%%%...%%%%...%%%%%%...%%%%..
.%%........%%....%%........%%....%%.....
.%%........%%.....%%%%.....%%.....%%%%..
.%%........%%........%%....%%........%%.
.%%%%%%..%%%%%%...%%%%.....%%.....%%%%..
........................................
*/
.grid-modules {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--spacer);
}
.grid-module .details{
  margin-top: 1em;
}
.alternate-module {
  float: left;
  width: 100%;
  position: relative;
  margin-bottom: 20px;
}
.alternate-module .summary {
  line-height: 1;
  letter-spacing: 0;
}
.alternate-module> :first-child {
  position: relative;
  display: block;
  width: calc(50% - 40px);
  margin: -80px 0 0 0px;
}
.alternate-module a:hover img {
  filter: contrast(1.2);
  opacity: 0.8;
}
.alternate-module .details {
  margin: 40px 0 120px;
  width: 50%;
  float: left;
}
.alternate-module:nth-child(odd)> :first-child {
  float: left;
}
.alternate-module:nth-child(odd) .details {
  margin-left: 40px;
}
.alternate-module:nth-child(even)> :first-child {
  float: right;
}
.alternate-module:nth-child(even) .details>div {
  float: right;
}
.alternate-module:nth-child(even) .fiesta{ float: right;}
.alternate-module:first-child {
  margin-top: 80px;
}
.alternate-module .rendezvous {
  margin: 0.5em 0 0;
}
.alternate-module:last-child {
  margin-bottom: 0;
}
.alternate-module:last-child .details {
  margin-bottom: 0 !important;
}
@media screen and (max-width: 1280px) {
  .alternate-module {
    margin: 0 0 40px;
  }
  .alternate-module:first-child {
    margin-top: 0;
  }
  .alternate-module> :first-child {
    width: calc(75% - 40px);
    margin: 0;
  }
  .alternate-module .details {
    width: 25%;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 850px) {
  .alternate-module {
    float: none;
  }
  .alternate-module .details {
    margin: 20px 0 40px 0px !important;
    width: 100%;
    float: none;
  }
  .alternate-module div {
    float: none !important;
  }
  .alternate-module> :first-child {
    width: 100%;
    margin: 0;
  }
  .alternate-module:nth-child(odd)> :first-child,
  .alternate-module:nth-child(even)> :first-child {
    float: none !important;
  }
}
.rdv-list {
  display: grid;
  grid-template-columns: max-content max-content;
  grid-gap: 0 2em;
}
.rdv-list li {
  width: 100%;
  grid-column: span 2;
  max-width: 30ch;
}
.rdv-list li:nth-last-child(n+6),
.rdv-list li:nth-last-child(n+6)~li {
  grid-column: span 1;
}
@media (max-width: 1280px) {
  .rdv-list {
    display: block;
  }
}
.blend-image {
  position: relative;
  display: block;
}
.blend-image img {
  display: block;
  border: none;
  border-width: 0;
  width: 100%;
  height: auto !important;
  mix-blend-mode: multiply;
  transition: all 150ms;
}
.blend-image+.eventType {
  position: absolute;
  top: 35px;
  left: 40px;
  padding-right: 40px;
  color: #fff;
  letter-spacing: 0.01em;
  text-align: left;
}
.blend-image+.eventType a {
  color: #fff;
}
@media (max-width: 850px) {
  .blend-image+.eventType {
    top: 25px;
    left: 30px;
  }
}
/* 
..%%%%...%%..%%..%%%%%...%%...%%..%%%%%%..%%..%%..%%..%%...%%%%..
.%%......%%..%%..%%..%%..%%%.%%%..%%......%%%.%%..%%..%%..%%.....
..%%%%...%%..%%..%%%%%...%%.%.%%..%%%%....%%.%%%..%%..%%...%%%%..
.....%%..%%..%%..%%..%%..%%...%%..%%......%%..%%..%%..%%......%%.
..%%%%....%%%%...%%%%%...%%...%%..%%%%%%..%%..%%...%%%%....%%%%..
.................................................................
*/
#pages-menu {
  padding: 44px 0 20px;
  position: sticky;
  top: 0;
  margin: 0;
  z-index: 200;
  background-color: white;
}
#pages-menu li {
  display: inline-block;
  margin: 0 10px 10px 0;
}
#pages-menu .more-up {
  display: none;
}
#pages-menu+.main {
  padding-top: 100px;
}
#pages-menu+#current_residences {
  padding-top: 40px;
}
@media (max-width: 770px) {
  #pages-menu {
    position: static;
    padding: 20px 0;
  }
}
#fullheader+#page #pages-menu {
  padding-top: 40px;
}
#residences {
  scroll-margin-top: 90px;
}
/* 
.%%%%%%..%%%%%%..%%..%%..%%%%%%...%%%%..
...%%....%%.......%%%%.....%%....%%.....
...%%....%%%%......%%......%%.....%%%%..
...%%....%%.......%%%%.....%%........%%.
...%%....%%%%%%..%%..%%....%%.....%%%%..
........................................
*/
.text-intro {
  margin-bottom: 40px;
}
.text-intro p,
.text-intro ul,
.text-intro ol,
.text-intro blockquote {
  line-height: 1.75;
  max-width: 580px;
}
.text-content {
  display: flex;
  margin-bottom: 40px;
  --textgutter: 80px;
}
@media (max-width: 1100px) {
  .text-content {
    --textgutter: 40px;
  }
}
.text-col {
  max-width: calc(580px + var(--textgutter));
  flex: 1 1 calc(580px + var(--textgutter));
  padding-right: var(--textgutter);
}
aside {
  flex: 0 2 240px;
}
.text> :first-child {
  margin-top: 0;
}
.text p,
.text ul,
.text ol,
.text blockquote,
.text h2,
.text h3 {
  line-height: 1.75;
  margin-bottom: 1.75em;
}
.text h3 {
  margin: 1.5em 0 1em 0;
}
.text h3:before {
  content: "—";
  display: block;
  margin: 1em 0;
}
.text h2 {
  font-size: 1.75em;
  font-family: var(--altfamily);
  font-variation-settings: var(--troimillebold);
  line-height: 1.25;
  margin: 1.5em 0 1em 0;
}
.text h3 {
  font-weight: bold;
}
.text h3:first-child:before {
  display: none;
}
.text h4 {
  margin: 1em 0 1em 0;
}
.text cite {
  font-style: normal;
}
.text h3+h4 {
  margin-top: 0;
}
.text ul,
.text ol {
  counter-reset: my-counter;
}
.text li {
  position: relative;
  text-indent: 20px;
}
.text li:before {
  content: '–';
  counter-increment: my-counter;
  position: absolute;
  left: -20px;
}
.text hr {
  background: none;
  border: none;
  margin: 0.5em 0 1.25em;
}
.text hr::before {
  content: "—";
  display: block;
  color: var(--bofluo, #000);
}
.text ol>li {
  text-indent: 0;
}
.text ol>li:before {
  font-size: 1em;
  position: static;
  content: counter(my-counter) " — ";
}
.text embed,
.text iframe,
.text object {
  max-width: 100% !important;
  min-width: 100% !important;
}
.text .img_right {
  float: right;
}
.text .img_block {
  display: block;
  clear: both;
}
.text .p_exergue {
  font-size: 16px;
  font-style: italic;
}
.text .p_small {
  font-size: 12px;
  color: #666;
}
.text .p_caption {
  font-size: 12px;
  color: #666;
}
.text .p_caption:before {
  content: '↑ ';
  position: relative;
  top: -2px;
}
.text .p_download {
  position: relative;
}
.text .p_download:before {
  content: '\2794';
  counter-increment: my-counter;
  position: absolute;
  left: -20px;
  top: 1px;
  font: normal 17px;
}
.text blockquote {
  position: relative;
  font-style: italic;
  border-left: 5px solid black;
  margin-left: 0;
  padding-left: 1em;
  font-style: normal;
  font-weight: bold;
}
.text blockquote * {
  font-weight: bold;
}
.text blockquote p {
  margin: 0;
}
.partners {
  font-size: 0.8125em;
  color: rgba(0, 0, 0, 0.6);
}
figure.video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  margin: 1em 0;
  border: none;
}
figure.video iframe,
figure.video object,
figure.video embed {
  border: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
aside * {
  line-height: 1.75;
}
aside h1 {
  margin-bottom: 0;
}
aside>div {
  margin-bottom: 1.5em;
}
aside :first-child {
  margin-top: 0;
}
aside h3 {
  margin: 1.75em 0 0;
}
aside h2 {
  margin: 0 0 calc(80px - 1.75em);
}
aside h2+.event-date {
  margin: calc(-1 * 80px + 1.75em) 0 calc(1.75em);
}
aside .submenu {
  margin-bottom: 2em;
}
aside .rendezvous {
  margin: 0 0 0.5em;
}
aside .rendezvous p {
  margin: 0 0 0.5em;
  font-size: 0.85em;
  line-height: 1.5;
}
aside .documents p {
  margin: 0 0 1em;
  font-size: 0.85em;
  line-height: 1.5;
}
aside .rendezvous p *,
aside .documents p * {
  line-height: inherit;
}
aside .rendezvous .rendezvous-details {
  display: none;
}
aside .rendezvous.highlight .rendezvous-details {
  display: block;
  color: var(--basecolor);
}
aside .rendezvous-details a {
  color: currentColor;
}
aside .past-registration {
  display: none;
}
aside .rdv-is-past {
  display: none;
}
@media (max-width: 770px) {
  aside {
    background: var(--bofluo);
    margin: 0 calc(var(--spacer) * -1);
    padding: var(--spacer);
  }
  aside a,
  aside [class^=color-] {
    color: white !important;
  }
}
@media (max-width: 900px) {
  .text-content {
    flex-direction: column;
    --textgutter: 0px;
    margin-bottom: 0;
    padding-bottom: 60px;
  }
  .text-col,
  aside {
    flex: 1;
  }
  aside {
    margin-top: 40px;
  }
  .is-past .not-if-is-past {
    display: none;
  }
}


.rendezvous strong {
  font-weight: 400;
  line-height: 1.5;
  display: block;
}
.rendezvous strong+span {
  font-size: 0.85em;
  display: block;
  color: rgba(0, 0, 0, 0.8);
  line-height: 1.4;
  margin-bottom: 0.35em;
}
.artistbio button {
  border: none;
  padding: 0;
  background: none;
  cursor: pointer;
}
.artistbio>* {
  display: none;
}
.artistbio>*:first-child {
  display: block;
}
.artistbio.visible>* {
  display: block;
}
.artistbio>*:not(:first-child) {
  font-size: 0.875em;
}
.residence-artist h3 {
  display: none;
}
/* 
..%%%%....%%%%...%%......%%......%%%%%%..%%%%%...%%%%%%..%%%%%%...%%%%..
.%%......%%..%%..%%......%%......%%......%%..%%....%%....%%......%%.....
.%%.%%%..%%%%%%..%%......%%......%%%%....%%%%%.....%%....%%%%.....%%%%..
.%%..%%..%%..%%..%%......%%......%%......%%..%%....%%....%%..........%%.
..%%%%...%%..%%..%%%%%%..%%%%%%..%%%%%%..%%..%%..%%%%%%..%%%%%%...%%%%..
........................................................................
*/

.gutter-sizer {
	width: 40px;
}
.grid-sizer, .gallery-item {
	width: calc((100% - 80px) / 3);
}
.gallery-item {
	transition: opacity 250ms;
	padding: 0;
	display: block;
	margin-bottom: var(--galleryspacer);
}
.gallery-item span {
	display: block;
	overflow: hidden;
}
.gallery-item img, .gallery-item video, .gallery-item audio {
	display: block;
	margin: 0 auto;
	width: 100%;
	height: auto;
}
.double, .gros {
	width: calc((100% - 80px) / 1.5 + 40px);
}
.huge {
	width: 100%;
}
.js .gallery {
	--galleryspacer: 80px;
}
.js .gallery .gallery-item {
	position: relative;
	padding-top: calc(var(--paddingTop) * var(--galleryspacer));
	padding-bottom: calc(var(--paddingBottom) * var(--galleryspacer));
}
.js .gallery .gallery-item:first-of-type {
	padding-top: var(--galleryspacer);
}
.js .gallery .gallery-item img {
	opacity: 0;
	display: block;
}
.js .gallery .gallery-item span::before {
	top: 50%;
	content: "";
	display: block;
	position: absolute;
	left: calc(50% - 1em);
	transform: translate(0, -50%);
	width: 2em;
	border-top: 2px solid #999;
	z-index: -1;
	animation: galleryloading 1s infinite cubic-bezier(0.83, 0, 0.17, 1) alternate;
}
.js .gallery.layoutComplete .gallery-item span::before {
	display: none;
}
.js .gallery.layoutComplete .gallery-item img {
	opacity: 1;
}
 @media (max-width: 1100px) {
	.js .gallery {
		--galleryspacer: 40px;
	}
}
 @media (max-width: 770px) {
	.js .gallery {
		--galleryspacer: 20px;
	}
	.grid-sizer, .gallery-item {
		width: calc((100% - 40px) / 2);
	}
	.double, .gros {
		width: 100%;
		margin-left: calc(-1 * var(--galleryspacer));
		margin-right: calc(-1 * var(--galleryspacer));
		width: calc(100% + var(--galleryspacer) * 2) !important;
	}
	.double .media-caption, .gros .media-caption {
		padding: 0 var(--galleryspacer);
	}
}
 @media (max-width: 550px) {
	.js .gallery .gallery-item img {
		opacity: 1;
	}
	.grid-sizer, .gallery-item {
		width: 100%;
	}
}
 @keyframes galleryloading {
	0% {
		width: 0;
	}
	50% {
		width: 2em;
		transform: translate(0, -50%);
	}
	100% {
		width: 0;
		transform: translate(2em, -50%);
	}
}
/* 
.%%...%%...%%%%...%%%%%..
.%%%.%%%..%%..%%..%%..%%.
.%%.%.%%..%%%%%%..%%%%%..
.%%...%%..%%..%%..%%.....
.%%...%%..%%..%%..%%.....
.........................
*/
#map_canvas {
  margin-top: 40px;
  height: 400px;
  width: 100%;
  z-index: 0;
}
#map_canvas a {
  text-decoration: none;
}
#map_canvas+#network-box {
  margin-top: 40px;
}
.leaflet-tile-container {
  filter: contrast(0.8);
}
.leaflet-tile-container {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 400px;
  width: 100%;
}
/* 
.%%..%%..%%%%%%..%%%%%%..%%...%%...%%%%...%%%%%...%%..%%.
.%%%.%%..%%........%%....%%...%%..%%..%%..%%..%%..%%.%%..
.%%.%%%..%%%%......%%....%%.%.%%..%%..%%..%%%%%...%%%%...
.%%..%%..%%........%%....%%%%%%%..%%..%%..%%..%%..%%.%%..
.%%..%%..%%%%%%....%%.....%%.%%....%%%%...%%..%%..%%..%%.
.........................................................
*/

@keyframes fluo {
  7.15% { color: #f4db1a} 
  14.3% { color: #FFBF4D} 
  21.45% { color: #FF6E2D}
  28.6% { color: #ee3300} 
  35.75% { color: #df1800} 
  42.9% { color: #EE79AD} 
  50.5% { color: #4BBFE3} 
  57.2% { color: #009FE3} 
  64.35% { color: #1785B3} 
  71.5% { color: #93C01F} 
  78.65% { color: #82DB24} 
}
#network-box> :first-child {
  margin-bottom: 40px;
  background: #eee;
  padding: 32px 30px 35px;
}
#network-box> :first-child h2 {
  line-height: 1.2;
  font-family: var(--basefamily);
  font-size: 1em;
  margin: 0 0 0.5em;
  display: flex;
  justify-content: space-between;
}
#network-box> :first-child h2 span:first-child {
  animation: fluo 6s linear infinite;
}
@media (max-width: 1550px) and (min-width: 1280px) {
  #network-box> :first-child h2 {
    flex-direction: column;
  }
  #network-box> :first-child h2 span+span {
    margin-top: 0.5em;
  }
}
@media (max-width: 1140px) and (min-width: 850px) {
  #network-box> :first-child h2 {
    flex-direction: column;
  }
  #network-box> :first-child h2 span+span {
    margin-top: 0.5em;
  }
}
@media (max-width: 1140px) and (min-width: 770px) {
  #network-box> :first-child h2 {
    flex-direction: column;
  }
  #network-box> :first-child h2 span+span {
    margin-top: 0.5em;
  }
}
@media (max-width: 560px) {
  #network-box> :first-child h2 {
    flex-direction: column;
  }
  #network-box> :first-child h2 span+span {
    margin-top: 0.5em;
  }
}
#network-box> :first-child>p:last-child {
  margin-bottom: 0;
}
@media (max-width: 410px) {
  #network-box> :first-child {
    padding: 20px;
  }
}
::-webkit-input-placeholder {
  color: white;
}
input:focus::-webkit-input-placeholder {
  color: #666;
}
::-moz-placeholder {
  color: white;
}
input:focus::-moz-placeholder {
  color: #666;
}
:-ms-input-placeholder {
  color: white;
}
input:focus:-ms-input-placeholder {
  color: #666;
}
:-moz-placeholder {
  color: white;
}
input:focus:-moz-placeholder {
  color: #666;
}
@keyframes eyes {
  49.9% {
    transform: scaleX(1);
  }
  50% {
    transform: scaleX(-1);
  }
  100% {
    transform: scaleX(-1);
  }
}
.socialicon svg {
  vertical-align: top;
  position: relative;
  top: 0.2em;
  height: 1.25em;
  width: 1.25em;
  display: inline-block;
  display: none;
}
.socialicon strong {
  font-weight: normal;
}
.socialicon:hover svg {
  fill: #4bbfe3;
}
.network-box-nl .group {
  display: grid;
  justify-content: flex-start;
  align-items: stretch;
  grid-template-columns: 1fr 50px;
  margin: 1em 0 0;
}
.network-box-nl form {
  position: relative;
}
.network-box-nl .above-label {
  padding: 12px 15px 8px;
  border: 3px solid transparent;
  grid-column: 1;
  grid-row: 1;
  line-height: 1;
  z-index: 2;
  display: none;
  white-space: nowrap;
  overflow: hidden;
}
.network-box-nl .above-label span {
  animation: eyes 5s infinite;
  display: inline-block;
}
.network-box-nl .input:focus {
  z-index: 2;
}
.network-box-nl .input:placeholder-shown~.above-label {
  display: block;
}
.network-box-nl .input:focus~.above-label {
  display: none;
}
.network-box-nl .input {
  display: flex;
  line-height: 1;
  padding: 12px 15px 8px;
  font-size: inherit;
  border-radius: 0;
  appearance: none;
  flex: 1;
  font-family: inherit;
  position: relative;
  font-size: inherit;
}
.network-box-nl .info {
  font-size: 0.85em;
  margin-bottom: 1em;
}
.network-box-nl .info:empty {
  display: none;
}
.network-box-nl .input {
  border: 3px solid #4bbfe3;
  grid-column: 1;
  grid-row: 1;
}
.network-box-nl .submit {
  grid-column: 2;
  grid-row: 1;
  line-height: 1;
  background-color: #4bbfe3;
  border: 3px solid transparent;
  padding: 12px 15px 8px 9px;
  width: 50px;
}
.network-box-nl .submit::-moz-focus-inner {
  border: 0;
  outline: none;
}
.subscription-details {
  display: none;
}
.subscription-details label,
.subscription-details p {
  display: block;
  max-width: 40rem;
  margin: 1em 0 0;
}
.focused .subscription-details {
  display: block;
}
#subscription-feedback:not(:empty) {
  margin: 0.5em 0;
  animation: fluo 6s linear infinite;
}
/* 
..%%%%...%%......%%%%%%...%%%%...%%..%%..%%%%%%..%%%%%....%%%%...%%..%%.
.%%......%%........%%....%%......%%..%%....%%....%%..%%..%%..%%...%%%%..
.%%.%%%..%%........%%....%%.%%%..%%%%%%....%%....%%%%%...%%..%%....%%...
.%%..%%..%%........%%....%%..%%..%%..%%....%%....%%..%%..%%..%%...%%%%..
..%%%%...%%%%%%..%%%%%%...%%%%...%%..%%....%%....%%%%%....%%%%...%%..%%.
........................................................................
*/

.glightbox-bo .gslide-media {
	padding-top: 25px;
}
 @media (min-width: 768px) {
	.glightbox-bo .gslide-media {
		box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.65);
	}
}
.glightbox-bo .goverlay {
	background: rgba(0, 0, 0, 1);
}
.glightbox-bo .gdesc-inner {
	padding: 16px 0 20px;
	margin-top: -16px;
}
 @media (min-width: 768px) {
	.glightbox-bo .description-left .gdesc-inner, .glightbox-bo .description-right .gdesc-inner {
		position: absolute;
		height: 100%;
		overflow-y: auto;
	}
}
.glightbox-bo .gslide-title, .glightbox-bo .gslide-desc {
	margin: 0.5em 0 0;
	text-decoration: none;
	font-size: 0.86em;
	font-weight: 400;
	max-width: 45em;
	color: rgba(255, 255, 255, 0.8);
	line-height: 1.4em;
}
.glightbox-bo .gslide-desc {
	margin-bottom: 0;
	line-height: 1.4em;
}
.glightbox-bo .gslide-video {
	background: #000;
}
.glightbox-bo .gprev, .glightbox-bo .gnext, .glightbox-bo .gclose {
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 4px;
}
 @media (min-width: 768px) {
	.glightbox-bo .gprev, .glightbox-bo .gnext, .glightbox-bo .gclose {
		background-color: rgba(0, 0, 0, 0.32);
	}
	.glightbox-bo .gprev:hover, .glightbox-bo .gnext:hover, .glightbox-bo .gclose:hover {
		background-color: rgba(0, 0, 0, 0.7);
	}
}
.glightbox-bo .gprev path, .glightbox-bo .gnext path, .glightbox-bo .gclose path {
	fill: #fff;
}
.glightbox-bo .gprev {
	position: absolute;
	top: -100%;
	left: 30px;
	width: 40px;
	height: 50px;
}
 @media (min-width: 768px) {
	.glightbox-bo .gprev {
		top: 45%;
	}
}
.glightbox-bo .gnext {
	position: absolute;
	top: -100%;
	right: 30px;
	width: 40px;
	height: 50px;
}
 @media (min-width: 768px) {
	.glightbox-bo .gnext {
		top: 45%;
	}
}
.glightbox-bo .gclose {
	width: 35px;
	height: 35px;
	top: 15px;
	right: 10px;
	position: absolute;
}
.glightbox-bo .gclose svg {
	width: 18px;
	height: auto;
}
 @media (min-width: 992px) {
	.glightbox-bo .gclose {
		opacity: 0.7;
		right: 20px;
	}
}
.glightbox-bo .gclose:hover {
	opacity: 1;
}
 
/* 
.%%%%%%..%%..%%..%%%%%%..%%%%%....%%%%..
.%%.......%%%%.....%%....%%..%%..%%..%%.
.%%%%......%%......%%....%%%%%...%%%%%%.
.%%.......%%%%.....%%....%%..%%..%%..%%.
.%%%%%%..%%..%%....%%....%%..%%..%%..%%.
........................................
*/
#extrapage-content {
  min-height: 100vh;
}
@media (max-width: 770px) {
  #extrapage-content {
    min-height: 0;
    padding: 0 0 40px !important;
  }
}
.extra-title {
  font-family: var(--altfamily);
  font-variation-settings: "wdth" 1000, "wght" 750;
  font-size: 1.25em;
  position: absolute;
  color: white;
  z-index: 4;
  padding: 40px 40px 40px calc(var(--menuwidth) + 40px);
}
.char {
  /* La variable CSS --delay utilise la variable CSS --index, définie dans le HTML */
  --delay: calc((var(--index) + 1) * 300ms);
  animation: caution 2000ms infinite both;
  animation-delay: var(--delay);
}
@keyframes caution {
  0% {
    font-variation-settings: 'wght' 200, 'wdth' 200;
  }
  50% {
    font-variation-settings: 'wght' 1000, 'wdth' 1000;
  }
  100% {
    font-variation-settings: 'wght' 200, 'wdth' 200;
  }
}
.extrapage-title span {
  display: inline-block;
}
.extrapage-title .grid-sizer,
.extrapage-title .extra-gridimg-item {
  width: calc((100% - 240px) / 4);
  width: calc((100%) / 4);
}
.extrapage-title .gutter-sizer {
  width: 80px;
}
.extrapage-title .extra-gridimg {
  padding: 0 40px;
  min-height: 100% !important;
}
.extrapage-title .extra-gridimg img {
  max-width: 100%;
  height: auto;
}
.extrapage-title .extra-gridimg-item {
  margin-bottom: 40px;
  padding-top: calc(var(--paddingTop) * var(--extraspacer));
  padding-bottom: calc(var(--paddingBottom) * var(--extraspacer));
}
.extrapage-title .extra-bgimg {
  padding: 80px 0;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.extrapage-title .extra-bgimg span {
  height: 100%;
}
.extrapage-title .extra-bgimg img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
@media (max-width: 770px) {
  .extrapage-title .extra-bgimg {
    padding: 0;
  }
}
.extrapage-title .details {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  color: white;
  padding: 80px 80px calc(80px - 1.06375em) calc(var(--menuwidth) + 40px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.extrapage-title .details h1 {
  margin-bottom: 0.5em;
  font-size: calc(2rem + 3vw);
}
@media (max-width: 770px) {
  .extrapage-title .details h1 {
    font-size: calc(2rem + 2vw);
  }
}
@media (max-width: 650px) {
  .extrapage-title .details h1 {
    font-size: calc(2rem + 1vw);
  }
}
.extrapage-title .details p,
.extrapage-title .details h2 {
  max-width: 60ch;
  margin-left: var(--extraspacer);
}
.extrapage-title .details p:last-child {
  margin-bottom: 1.5em;
}
.extrapage-title .exhibition-title {
  margin: 0.25em 0 1em;
}
.extrapage-title .exhibition-artists {
  margin: -1em 0 1em;
}
.extrapage-title h1 {
  font-size: 4em;
  line-height: 0.9;
}
.extrapage-title p+p {
  margin-top: 1em;
}
@media (max-width: 770px) {
  .extrapage-title .extra-gridimg {
    padding: 0;
    margin: 0 calc(-1 * var(--spacer));
  }
  .extrapage-title .grid-sizer,
  .extrapage-title .extra-gridimg-item {
    width: calc((100% - 80px) / 3);
  }
  .extrapage-title .gutter-sizer {
    width: 40px;
  }
}
.extramention {
  padding: var(--extraspacer);
  background-color: #0f0f0f;
  color: white;
}
.extramention p {
  max-width: 580px;
}
.extrapage-button {
  background-color: #222;
  cursor: pointer;
  border: 2px solid transparent;
  color: white;
  font-size: inherit;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.5em 1.5em 0.35em 1.5em;
  margin-left: calc(80px + var(--border-width));
  transition: all 250ms;
  position: relative;
  border-radius: 4em;
  display: flex;
  --border-width: 2px;
  width: min-content;
}
.extrapage-button::after {
  position: absolute;
  content: "";
  top: calc(-1 * var(--border-width) * 2);
  left: calc(-1 * var(--border-width) * 2);
  z-index: -1;
  width: calc(100% + var(--border-width) * 4);
  height: calc(100% + var(--border-width) * 4);
  background: linear-gradient(60deg, #fff, var(--brdrclr));
  background-size: 400% 100%;
  background-position: 0 0;
  border-radius: 4em;
  animation: moveGradient 1.5s alternate infinite;
}
.extrapage-button::before {
  content: "→";
  position: absolute;
  left: 1em;
  text-indent: -1em;
  width: 0;
  overflow: hidden;
  transition: all 250ms;
}
.extralink {
  transition: all 500ms;
  --brdrclr: #fff;
  cursor: pointer;
}
.extralink:hover {
  animation-name: moveGradient;
  --brdrclr: var(--bordercolor);
}
@keyframes moveGradient {
  50% {
    background-position: 100% 50%;
  }
}
.extralist-item:hover .extrapage-button {
  padding-left: 2.5em;
}
.extralist-item:hover .extrapage-button::before {
  width: 1em;
  text-indent: 0em;
}
.extraloaded a {
  pointer-events: none;
  cursor: default;
}
.extraloaded a .extrapage-button {
  visibility: hidden;
}
.extralist-item.extraloading .extrapage-button,
.extralist-item.extraloading:hover .extrapage-button {
  pointer-events: none;
  cursor: default;
  padding-left: 1.5em;
  --brdrclr: #fff;
}
.extralist-item.extraloading .extrapage-button::before,
.extralist-item.extraloading:hover .extrapage-button::before {
  display: none;
}
.extralist-item.extraloading .extrapage-button span,
.extralist-item.extraloading:hover .extrapage-button span {
  display: block;
  color: rgba(0, 0, 0, 0);
}
.extralist-item.extraloading .extrapage-button span::before,
.extralist-item.extraloading:hover .extrapage-button span::before {
  top: 50%;
  content: "";
  display: block;
  position: absolute;
  left: 1em;
  align-self: center;
  border-top: 2px solid white;
  animation: extraloading 1s infinite cubic-bezier(0.83, 0, 0.17, 1) alternate;
}
@keyframes extraloading {
  0% {
    width: 0;
  }
  50% {
    width: calc(100% - 2em);
    left: 1em;
  }
  100% {
    width: 0;
    left: calc(100% - 1em);
  }
}
.extralist-item {
  position: relative;
  height: 70vh;
  overflow: hidden;
  background: #222;
}
.extralist-item:nth-child(1) {
  padding-top: 240px;
}
.extralist-item a:focus {
  color: var(--accent);
}
.extralist-item img {
  display: block;
  mix-blend-mode: multiply;
  filter: grayscale(1);
}
.extralist-item .extra-title,
.extralist-item .exhibition-title,
.extralist-item .exhibition-artists,
.extralist-item .scroll {
  display: none;
}
.extralist-item .extra-gridimg {
  padding: 0;
}
@media (max-width: 770px) {
  .extralist-item {
    height: auto;
  }
}
.extravideo {
  display: block;
  width: 40px;
  height: 40px;
  background: url(../images/video-icon.svg) no-repeat;
  background-size: contain;
  margin: 0 0 0 80px;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100px;
}
.extrapage-header .extra-title {
  top: 80px;
  padding: 0 0 0 var(--extraspacer);
}
@media (max-width: 770px) {
  .extrapage-header .extra-title {
    top: 120px;
  }
}
.extrapage-header .grid-sizer,
.extrapage-header .extra-gridimg-item {
  width: calc((100% - 160px) / 3);
}
.extrapage-header .details {
  display: flex;
  justify-content: center;
}
.extrapage-header img {
  display: block;
  mix-blend-mode: multiply;
  filter: grayscale(1);
}
.extrapage-header .details h1 {
  margin-bottom: 0;
}
.extrapage-header .details h1+h2 {
  margin-top: 1em;
}
.extrapage-header .description {
  margin-top: 1.5em;
}
.extrapage-header .extra-bgimg {
  padding: 80px 40px;
  height: 100vh;
}
.extrapage-header .extrapage-button {
  display: none;
}
@media (max-width: 770px) {
  .extrapage-header .extra-gridimg {
    padding: 0;
    margin: 0 calc(-1 * var(--spacer));
  }
  .extrapage-header .grid-sizer,
  .extrapage-header .extra-gridimg-item {
    width: calc((100% - 80px) / 3);
  }
  .extrapage-header .gutter-sizer {
    width: 40px;
  }
}
@media (max-width: 650px) {

  .extrapage-header .grid-sizer,
  .extrapage-header .extra-gridimg-item {
    width: calc((100% - 40px) / 2);
  }
}
@media (max-width: 770px) {
  .extrapage-header .extra-title {
    top: 20px;
    padding: 0;
  }
  .extrapage-title {
    position: relative;
  }
  .extrapage-title .details {
    padding: var(--extraspacer);
    position: static;
  }
  .extrapage-title .details .extrapage-button,
  .extrapage-title .details h2,
  .extrapage-title .details p {
    margin-left: 0;
  }
  .extrapage-title .details .scroll {
    position: static;
    margin-left: -30px;
    animation: none;
  }
  .extrapage-title .extra-bgimg {
    height: auto;
    display: block;
    position: static;
    padding: 0;
  }
  .extrapage-title .extra-gridimg {
    min-height: 0 !important;
    padding: 40px 0 0 0;
    margin-bottom: -40px;
  }
}
@media (max-width: 410px) {
  #fullheader {
    padding: var(--spacer);
  }
  #fullheader .site-header {
    margin-bottom: var(--spacer);
  }
}


 
#newsletters{
  h2 { color:#ee3300; margin: 42px 0 20px;}
  a:hover { color:#ee3300;}
}