@charset "utf-8";
/* CSS Document */
/* smartphones, touchscreens */
@media (hover: none) and (pointer: coarse) {
  /* ... */
}
/* stylus-based screens */
@media (hover: none) and (pointer: fine) {
  /* ... */
}
/* Nintendo Wii controller, Microsoft Kinect */
@media (hover: hover) and (pointer: coarse) {
  /* ... */
}
/* mouse, touch pad */
@media (hover: hover) and (pointer: fine) {
  /* ... */
}
:root {
  --fff-blur: 0px;
  --fff-contrast: 1;
  --fff-brightness: 1;
  --fff-dropshadow: 0px 0px 0px black;
  --fff-grayscale: 0;
  --fff-hue-rotate: 0deg;
  --fff-invert: 0;
  --fff-opacity: 1;
  --fff-saturate: 1;
  --fff-sepia: 0;
}
/* PSEUDOPAGE OVERLAY IFRAME */
iframe.pseudopageoverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  border: 0;
  margin: 0;
  padding: 0;
  outline: 0;
  z-index: 9999999999999;
}
a {
  cursor: pointer;
}
/* EXPAND BUTTON */
.expandbutton {
  scroll-margin-top: 90px;
  display: flex;
  width: fit-content;
  width: -moz-fit-content;
}
.expandbutton:after {
  content: " ";
  margin-left: 5px;
  margin-top: auto;
  margin-bottom: auto;
  display: inline-block;
  transform: rotate(180deg);
  --svgicon-url: var(--utils-icon-up);
  mask-repeat: no-repeat;
  mask-size: var(--svgicon-size);
  mask-position: var(--svgicon-position);
  mask-image: var(--svgicon-url);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: var(--svgicon-size);
  -webkit-mask-position: var(--svgicon-position);
  -webkit-mask-image: var(--svgicon-url);
  background: var(--svgicon-color);
  width: 0.75em;
  height: 0.75em;
  transition: transform 0.6s;
}
.expandbutton[is-expanded]:after {
  transform: rotate(0deg);
}
*[toggle-expand-id] {
  --expand-duration: 0.0s;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--expand-duration);
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
*[toggle-expand-id]:not([is-expanded]) > *{
  min-height: 0;
}
body[is-fe] *[toggle-expand-id] {
  /* overflow: hidden; */
}
body[is-fe] *[toggle-expand-id][is-fully-closed] {
  display: none;
}
*[toggle-expand-id][is-expanded] {
  grid-template-rows: 1fr;
}
/* HIDE SCROLLBAR */
*[hide-scrollbar]::-webkit-scrollbar {
  display: none;
}
*[hide-scrollbar] {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
/* CUTOM SCROLLBAR */
*[custom-scrollbar] {
  scroll-behavior: smooth;
}
@media (hover: hover) and (pointer: fine) {
  *[custom-scrollbar] {
    --scrollbar-bg: transparent;
    --scrollbar-handlerbg: #404040;
    --scrollbar-width: 6px;
    scroll-behavior: smooth;
    scrollbar-width: var(--scrollbar-width);
    scrollbar-height: var(--scrollbar-width);
    scrollbar-color: var(--scrollbar-handlerbg) var(--scrollbar-bg);
  }
  *[custom-scrollbar]::-webkit-scrollbar {
    width: var(--scrollbar-width);
    height: var(--scrollbar-width);
  }
  *[custom-scrollbar]::-webkit-scrollbar-track {
    background-color: var(--scrollbar-bg);
  }
  *[custom-scrollbar]::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-handlerbg);
    border-radius: var(--scrollbar-width);
    border: var(--scrollbar-width) solid var(--scrollbar-handlerbg);
  }
}
/* SVG PICKER */
.svgiconpicker {
  width: 4em;
  height: 4em;
  flex-grow: 0;
  flex-shrink: 0;
}
.svgiconpopup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999999999;
  background: rgb(0 0 0 / 85%);
  --svgicon-color: white;
  padding: 2em;
  display: flex;
}
.svgiconpopup .svgiconpickels {
  margin: auto;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  row-gap: 1em;
  column-gap: 1em;
}
.svgiconpopup .svgiconpickels .svgiconpickel {
  width: 4em;
  height: 4em;
  padding: 0.5em;
}
/* MEDIA */
.media {
  line-height: 0;
  user-select: none;
}
.media input[type="file"], .media .uploadbtlabel {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  line-height: 0px;
  font-size: 0px;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--ci-color);
  transition: background 0.3s;
  pointer-events: inherit;
}
.media .uploadbt, .media .changemediaidbt {
  --padding: 0.25em;
  position: absolute;
  top: var(--padding);
  right: var(--padding);
  width: var(--btwh);
  height: var(--btwh);
  background: white;
  border-radius: 100%;
  cursor: pointer;
}
.media .changemediaidbt {
   width: calc(var(--btwh) * 0.75);
  height: calc(var(--btwh) * 0.75);
}
.media .changemediaidbt {
  right: calc(var(--btwh) + var(--padding) * 2);
}
.media .svgicon {
  background: var(--ci-color);
}
.media .uploadbt .svgicon {
  --svgicon-url: var(--utils-icon-upload);
}
.media .changemediaidbt .svgicon {

  --svgicon-url: var(--utils-icon-src);
}
.media .mediafootage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--obj-pos-x) var(--obj-pos-y);
}
.media .pseudoimg.mediafootage {
  pointer-events: none;
  opacity: 0;
}
.media iframe.mediafootage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: unset;
  object-position: unset;
}
.media .zip.mediafootage .svgicon {
  --svgicon-url: var(--utils-icon-download);
  background: white;
  transition: background 0.3s;
}
.media .zip.mediafootage:hover .svgicon {
  background: var(--ci-color);
}
.media .pdf.mediafootage .svgicon {
  --svgicon-url: var(--utils-icon-pdf);
  background: white;
  transition: background 0.3s;
}
.media .pdf.mediafootage:hover .svgicon {
  background: var(--ci-color);
}
.media .mediafocusel {
  position: absolute;
  border: solid 4px #ffffff73;
  outline: dotted 2px var(--ci-color);
  outline-offset: -3px;
  width: 16px;
  height: 16px;
  border-radius: 16px;
  cursor: pointer;
  transform: translate(-50%, -50%);
}
/* SLUG HOLDER */
.slugholder {
  display: none;
}
/* OVERLAY */
.overlay {
  position: fixed;
  display: flex;
  flex-direction: column;
  top: 0;
  left: 0;
  width: var(--body-client-width);
  height: var(--currentview-height);
  z-index: 999999;
  background: rgb(250 250 250 / 73%);
}
.overlaybox {
  position: relative;
  z-index: 999999999;
  margin: auto;
  max-width: calc(100% - 2em);
  max-height: calc(100% - 2em);
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--bg-color);
  padding: 1em;
  /* --bg-color: white; */
  /* --color: black; */
  color: var(--color);
  box-shadow: rgb(0 0 0 / 32%) 0em 0em 4em;
}
.overlaybox .buttons {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1em;
}
/* SCROLL SNAP INDEXING */
*[use-scroll-snap-indexing] {
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overflow-x: auto;
  display: flex;
}
*[use-scroll-snap-indexing] > * {
  scroll-snap-align: start;
  flex-shrink: 0;
}
*[use-scroll-snap-indexing][instant-scroll] {
  scroll-behavior: auto !important;
}
*[instant-scroll] {
  scroll-behavior: auto !important;
}
/* PROCESSING */
@keyframes processing {
  0% {
    opacity: 0.4;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 0.4;
  }
}
/* TOAST */
.toast {
  position: fixed;
  bottom: 0;
  z-index: 99999999;
  width: var(--body-client-width);
  background: var(--ci-color);
  color: white;
  padding: 1em;
  animation: toastinout_ani var(--toast-duration) forwards;
  text-align: center;
}
@keyframes toastinout_ani {
  0% {
    transform: translateY(100%);
  }
  10% {
    transform: translateY(0%);
  }
  90% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(100%);
  }
}
/* LANGUE STYLE */ :root {
  --lang-en-color: #983cff;
  ;
}
*[target-id$="_en"] {
  --color:  var(--lang-en-color);
  color: var(--color) !important;
  display: none !important;
}
.deeplebt[target-lang="en"] {
  display: none;
}
*[current-langs*='_en'] *[target-id$="_en"], *[current-langs*='_en'] .deeplebt[target-lang="en"] {
  display: block;
}