@font-face {
    font-family: 'BaskemoSans';
    src: url('../fonts/BaskemoSans-Regular.woff2') format('woff2');
    font-style: normal;
    font-weight: normal;
  }
  @font-face {
    font-family: 'BaskemoSans';
    src: url('../fonts/BaskemoSans-Italic.woff2') format('woff2');
    font-style: italic;
    font-weight: normal;
  }
  @font-face {
    font-family: 'BaskemoSerif';
    src: url('../fonts/BaskemoSerif-Regular.woff2') format('woff2');
    font-style: normal;
    font-weight: normal;
  }
  @font-face {
    font-family: 'BaskemoSerif';
    src: url('../fonts/BaskemoSerif-Italic.woff2') format('woff2');
    font-style: italic;
    font-weight: normal;
  }
  @font-face {
    font-family: 'ReadyLight';
    src: url('../fonts/ReadyActive-Light.woff2') format('woff2');
    font-style: normal;
    font-weight: normal;
  }
:root{
    --maelo: #55E9A2;
    --last-color: #55E9A2;
}
.last-color{
  color: var(--last-color);
}
.last-color-background{
  background: black;
  color:var(--last-color);
  border: 1px solid var(--last-color) !important;
}
.last-color-background:hover{
  color:var(--fond)!important;
  border: 1px solid white !important;
}
.boutton-dons:has(.animated){
  border: 1px solid var(--last-color) !important;
  color:var(--last-color);
}
.boutton-dons:has(.animated):hover{
  border: 1px solid white !important;
  color:white !important;
}
html{
    scroll-behavior: smooth;
}

body{
    font-family: "BasicallySans";
    scroll-behavior: smooth;
}
a:hover{
    color:var(--maelo);
}
.top-infos{
    height: 100vh;
    position: sticky;
top:0;
z-index: 665;
pointer-events: none;

}
.top-infos-container{
    display:flex;
}
.top-infos-container .logo{
    width:50%;
    position: relative;
    transition: .3s opacity;
}
.grand{
  font-size: 1.5em;
}
.presentationtexte{
  margin-top:.7em;
}
.top-infos-container .presentation{
    width:50%;
    padding:4em 4em 0 4em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.top-infos-container .presentation .boutton-dons{
  margin-bottom: 0;
}
.top-infos .presentation p+p{
    text-indent: 1em !important;
}

.liens{
    display:flex;
    justify-content: space-between;
    padding:1em;
    width:100%;
    position: fixed;
    bottom: 0;
    font-family: "BaskemoSans";
    text-transform: uppercase;
    z-index: 999;
}
.liens a:hover{
}
.numero{
    aspect-ratio: 2/1;
    display:flex;
}
.numero .couverture{
    width:50%;
    padding:4em;
    text-align: center;
    position: relative;
}
.bandeau-new-issue{
  position: absolute;
  display: flex;
  justify-content: space-between;
  padding:2.5em 1em 2em 1em;
  width: 100%;
  left: 0;
  top: 0;
}

.new-issue-type{
  font-family: "BaskemoSans";
  font-style: italic;
  color:white;
  -webkit-text-stroke: 25px black; 
  paint-order: stroke fill;
  text-transform: uppercase;
  font-size: 1.7em;
  z-index: 999;
}
/* Animation qui fait varier le transform scale dans le temps */
 @keyframes scale-up {
    0% {
      transform: scaleX(1) scaleY(3) skewX(-35deg);
    }
    50% {
      transform: scaleX(1.05) scaleY(3) skewX(-35deg);
    }
    100% {
      transform: scaleX(1) scaleY(3) skewX(-35deg);
    }
  }


.label-new-issue-right{
  right:1em;
  top:1em;
}
.label-new-issue-left{
  left:1em;
  top:1em;
}
.label-new-issue{
  position:absolute;
  background:black;
  border-radius: .1em;
  z-index: 666;
  display:block;
  overflow: hidden;
}
.label-new-issue .inner{
  margin: 1px;
  background:black;
  z-index: 666;
  position: relative;
  padding: .5em 1em .4em 1em;
  border-radius: .1em;
}
.label-new-issue::before {
  content: "";
  display: block;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    #8200fa 25%,
    #8200fa 50%,
    #8200fa 75%,
    rgba(255, 255, 255, 0) 100%
  );
  height: 300px;
  width: 100px;
  transform: translate(0);
  position: absolute;
  animation: rotate 5s linear forwards infinite;
  z-index: 0;
  transform-origin: center;
  top: -150px;
}

@keyframes rotate {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}


.galerie-slick-slide-container-plaintext{
    height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity:0;
  transition: .3s opacity;
}
.cache-show{
  opacity:1;
}
.cache-hover{
    opacity : 0;
    pointer-events: none;
}
.numero .couverture img{
    position: relative;
    z-index: 666;
    transition: .3s opacity;
}

.numero .introduction{
    width:50%;
    padding:4em;
    height: 100%;
    background:var(--terne);
    border-top: 1px solid var(--fond);
    position: relative;
    z-index: 666;
}
.numero .introduction .top-introduction{
  display: flex;
  justify-content: space-between;
  align-items:flex-start;
}
.numero .introduction .top-introduction .boutton-dons{
  margin:0;
}
.boutton-bottom-numero{
  text-align: right;
}
.numero .introduction ul{
    line-height: 1.2;
    columns:2;
    column-gap: 3em;
    margin-left:0;
}
.numero .introduction ul a{

}
.numero .introduction li{
    margin-bottom: 1em;
    break-inside: avoid;
}
.numero .introduction li em{
    font-family: "BasicallySerif";
    font-style:italic;
}
.baskemono{
    font-family: "BaskemoSans";
}
.introduction .baskemono{
    margin-bottom: 2em;
}
.sommaire-rotate{
    font-family: "BaskemoSans";
    position:absolute;
    transform: rotate(90deg);
    transform-origin: top left;
}
.ligne{
    letter-spacing: -.2em;
}
.numero .introduction{
  margin-bottom: 0;
};
.pre-intro{
    font-family: "BaskemoSans";
    text-transform: uppercase;
}
.dons-home, .slide-home{
    width: 100vw;
    background: var(--terne);
    position:relative;
    z-index: 888;
    display:flex;
    padding: 3rem 2rem;
}
.slide-centrer{
  background: var(--terne);
  position:relative;
  z-index: 888;
  display:flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding:4em 15em;
}
.dons-home-container, .sponsors-home-container, .slide-home>*{
    width:50%;
}
.about{
  font-size: 1.5em;
  width: 100vw;
  background: var(--terne);
  position: relative;
  z-index: 888;
  padding: 3rem 2rem;
}
/* .about p{
  padding-left:20em;
} */

.dons-home-container h1, .about h1, .slide-centrer h1, .slide-home h1, .pop-up-choice-buy h1{
    font-family: "ReadyLight";
    font-weight: normal;
    line-height: .8;
    font-size:4rem;
    font-style: normal;
}
.slide-home .center h1{
  font-feature-settings: 'ss01';
}
.slide-home .center{
  text-align: center;
  padding:0em 4em;
}
.slide-home .right{
  text-align: right;
}

.footer-text menu{
    background:var(--terne) !important;
}
.footer-text menu h3{
    color: var(--fond) !important;
}
.liste-logos{
}
.logo{
}
.logosponsors{
    margin-right: 2em;
    display: inline-block;
    margin-bottom:1.5em;
}
.boutton-dons{
    border: 1px solid var(--fond);
    padding:.5em 1em .4em 1em;
    margin-right:.5em;
    margin-bottom:2em;
    border-radius: .1em;
    display:inline-block;
}
.dons-home p{
    text-indent: 0 !important;
}

.boutton-dons{
  pointer-events:visible;
  margin-top:.85em;
}
.custom-slick-next, .custom-slick-next-fake{
display: flex;  
font-size: 2rem;
align-items: center;
cursor: pointer;
justify-content: end;
}
.custom-slick-prev{
  mix-blend-mode: difference;
}
.custom-slick-prev, .custom-slick-prev-fake{
  display: flex;  
  font-size: 2rem;
  align-items: center;
  justify-content: start;
  cursor: pointer;
  }

  .custom-slick-next-fake{
    padding: 0.05em .35em 0 .4em;
  }
  .custom-slick-prev-fake{
    padding: 0.05em .4em 0 .32em;
  }

.custom-slick-next-fake, .custom-slick-prev-fake{
  z-index: 9997;
  cursor: pointer;
  font-family: "PetitFrereWide";
  text-transform: uppercase;
  width: 50%;
  height: 100%;
  pointer-events: none;
  color:var(--terne);
}
.fake-arrows{
  display: flex;
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}
.show-port{
  display:none;
}
.hide-port{
  display:block;
}
.footer{
  margin-top: 0;

}
.footer-text{
  padding:0 1em;
  background: var(--terne);
  z-index: 9999;
  position: relative;
}
.pop-up-choice-buy{
  position:fixed;
  top:0;
  left:0;
  width:100vw;
  height: 100vh;
  background:rgba(0, 0, 0, 0.7);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: .3s opacity;
  text-align: center;
}
.pop-up-choice-buy h1{
  color:var(--last-color);
}
.pop-up-description-price{
  width: 20em;
  margin:auto;
}

.pop-up-introduction{
  width: 40em;
  margin:auto;
}
.fermer-pop-up-choice-buy{
  position:absolute;
  top:0;
  right:0;
  border-left:1px solid var(--fond);
  border-bottom:1px solid var(--fond);
  width:2.5em;
  height:2.5em;
  background: 
  linear-gradient(to top left,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) calc(50% - 1.1px),
      rgb(255, 255, 255) 50%,
      rgba(0,0,0,0) calc(50% + 1.1px),
      rgba(0,0,0,0) 100%),
  linear-gradient(to top right,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) calc(50% - 1.1px),
      rgb(255, 255, 255) 50%,
      rgba(0,0,0,0) calc(50% + 1.1px),
      rgba(0,0,0,0) 100%);
  cursor: pointer;
}
.fermer-pop-up-choice-buy:hover{
  color:var(--last-color);
  cursor: pointer;
}
.pop-up-show{
  opacity: 1;
  pointer-events: all;
}
.pop-up-choice-buy .pop-up-choice-buy-content{
  background:black;
  padding:3em;
  width:70%;
  position: relative;
  border: 1px solid var(--fond);
  border-radius: .1em;
}
.pop-up-choice-buy-columns{
  display: flex;
  flex-direction: row;
}
.pop-up-choice-buy-column{
  width: 50%;
}
.pop-up-choice-buy-column:first-child{
  border-right:1px solid var(--fond);
}
.boutton-preorder:hover{
    color:var(--last-color);
    cursor: pointer;
}
.pop-up-choice-buy-column button{
  margin-top: 2em;
  pointer-events: none;
}
.pointer-all{
  pointer-events: all !important;
}
.pop-up-choice-buy-column button:hover{
  color:var(--last-color);
  cursor: pointer;
}
.wavy {
  animation-name: wavy;
  animation-duration: 1.1s;
  animation-iteration-count: infinite;
  position: relative;
  top: 0;
  left: 0;
}
@keyframes wavy {
  0% {
    top: 2px;
  }
  50% {
    top: -2px;
  }
  100% {
    top: 2px;
  }
}
.wavy2 {
  animation-name: wavy2;
  animation-duration: 1.1s;
  animation-iteration-count: infinite;
  position: relative;
  top: 0;
  left: 0;
  color:var(--last-color);  
}
@keyframes wavy2 {
  0% {
    margin-left: 0px;
    margin-right: 0px;
  }
  100% {
    margin-left: 5px;
    margin-right: 5px;
  }
}

.button-sad{
  cursor: pointer;
  user-select: none; /* Standard syntax */
}
.button-sad:hover{
  color:rgb(130, 0, 250);
}
.days-remaining{
  font-family: "BasicallySans";
  font-size: .6em;
  letter-spacing: .05em;
  text-transform: uppercase;
  color:var(--last-color); 
  display: flex;
  justify-content: space-between;
  width:21.5em;
  position:absolute;
  margin-top: .7em;
  align-items: start;
}
.slide-img{
  width:100vw;
  height: 80vh;
  padding:0;
  background-color: black;
  text-align: right;
}
.slide-img div{
  width: 75vw;
  height: 100%;
  background-position:center;
    background-position-x: center;
  background-position-x: -7em;
  background-size: 135%;
  margin-left: 25vw;
}
.txt-right{
  text-align: right;
}
.slide-img div.left{
  margin-left: 0;
}
@media screen and (max-width: 40em) {
  body{
    padding:0;
    height: 100vh;
  }
  
.top-infos-container {
    display: flex;
    flex-direction: column;
  }
  .top-infos-container .presentation {
    width: 100%;
    padding: 1em;
  }
  .top-infos-container .logo {
    width: 100%;
  }
  .numero {
    flex-direction: column;
    height: auto;
  }
  
  .numero .introduction {
    width: 100%;
    padding: 1em;
    height: 100vh;
  }
 
  .numero .couverture {
    width: 100%;
    padding: 4em;
    text-align: center;
    height: auto;
    width: 100%;
    padding: 4em 2em;
    text-align: center;
  }
  .liens {
    display: block;
    background: var(--terne);
    columns: 2;
  }
  .liens a{
    display: block;
  }
  .dons-home {
    padding:2rem;
    display: flex;
    flex-direction: column;
  }
  .slide-home{
    flex-direction: column;
    padding:2rem;
  }
  .slide-home > *{
    width: 100%;
  }
  .dons-home-container, .sponsors-home-container {
    width: 100%;
  }

  .numero .introduction {
    margin-bottom: 0em;
    height: auto;
    padding:2rem;
  }
  .sommaire-rotate {
    font-family: "BaskemoSans";
    position: relative;
    transform: rotate(0);
    margin-bottom: 1em;
    text-transform: capitalize;
  }
  .numero .introduction ul {
    column-gap: 0.5em;
  }
  ul{
    margin-left: 0;
  }
  .slide-home .center{
    padding:0em;
  }
  .dons-home-container h1, .about h1, .slide-centrer h1, .slide-home h1 {
    font-size: 6rem;
  }
  .liste-logos{
    text-align: center;
  }
  .logosponsors {
    margin-right: 0;
    margin-bottom: 2.5em;
    display:block;
  }
  .show-port{
    display:block;
  }
  .hide-port{
    display:none;
  }
  .bout-port{
    display: block;
    text-align: center;
  }
  .pre-intro p span:nth-child(0){
    color:red;
  }
  .pre-intro p span:nth-child(1){
    margin-left:2em !important;
  }
  .pre-intro p span:nth-child(8){
    margin-left:5em !important;
  }
  .pre-intro p span:nth-child(10){
    margin-left:2em !important;
  }
  .plaintext-lang a{
    display: inline-block;
  }
  .boutton-dons{
    padding: .9em 1em .8em 1em;
  }
  .presentation .boutton-dons{
    margin-top:1.2em;
  }
  .days-remaining {
    font-size: .9em;
    width: 90%;
    margin-top: -5.3em;
    text-align: center;
    justify-content: center; 
  }
  #learnmore{
    margin-top: 2em;
  }
  .new-issue-type {
    text-align: center;
  }
  .slide-img div {
    width: 100%;
    margin-left: 0;
    background-size: 335%;
    background-position-x: -12em;
  }
  .pop-up-choice-buy-column {
    width: 100%;
  }
  .pop-up-choice-buy-columns {
    flex-direction: column;
  }
  .pop-up-description-price {
    width: 100%;
  }
  .pop-up-choice-buy-column:first-child {
    border-right: 0px solid var(--fond);
  }
  .pop-up-choice-buy .pop-up-choice-buy-content {
    padding: 1em;
    width: 91vw;
    height: 96vh;
  }
  .pop-up-choice-buy h1 {
    font-size: 5.5rem;
  }
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
  body{
    padding:0;
  }
.top-infos-container {
    display: flex;
    flex-direction: column;
  }
  .top-infos-container .presentation {
    width: 100%;
    padding: 1em;
  }
  .top-infos-container .logo {
    width: 100%;
  }
  .numero {
    flex-direction: column;
    height: auto;
  }
  .numero .introduction {
    width: 100%;
    padding: 1em;
    height: 100vh;
  }
 
  .numero .couverture {
    width: 100%;
    padding: 4em;
    text-align: center;
    height: auto;
    width: 100%;
    padding: 4em 2em;
    text-align: center;
  }
  .liens {
    display: block;
    background: var(--terne);
    columns: 2;
  }
  .liens a{
    display: block;
  }
  .dons-home {
    padding:2rem;
    display: flex;
    flex-direction: column;
  }
  .slide-home{
    flex-direction: column;
    padding:2rem;
  }
  .slide-home > *{
    width: 100%;
  }
  .dons-home-container, .sponsors-home-container {
    width: 100%;
  }

  .numero .introduction {
    margin-bottom: 0em;
    height: auto;
    padding:2rem;
  }
  .sommaire-rotate {
    font-family: "BaskemoSans";
    position: relative;
    transform: rotate(0);
    margin-bottom: 1em;
    text-transform: capitalize;
  }
  .numero .introduction ul {
    column-gap: 10em;
  }
  ul{
    margin-left: 0;
  }
  .slide-home .center{
    padding:0em;
  }
  .dons-home-container h1, .about h1, .slide-centrer h1, .slide-home h1 {
    font-size: 6rem;
  }
  .liste-logos{
    text-align: center;
  }
  .logosponsors {
    margin-right: 0;
    margin-bottom: 2.5em;
    display:block;
  }
  .show-port{
    display:block;
  }
  .hide-port{
    display:none;
  }
  .bout-port{
    display: block;
    text-align: center;
  }
  .pre-intro p span:nth-child(0){
    color:red;
  }
  .pre-intro p span:nth-child(1){
    margin-left:2em !important;
  }
  .pre-intro p span:nth-child(8){
    margin-left:5em !important;
  }
  .pre-intro p span:nth-child(10){
    margin-left:2em !important;
  }
  .plaintext-lang a{
    display: inline-block;
  }
  .boutton-dons{
    padding: .9em 1em .8em 1em;
  }
  .presentation .boutton-dons{
    margin-top:1.2em;
  }
  .days-remaining {
    font-size: .9em;
    width: 90%;
    margin-top: -4.4em;
    text-align: center;
    justify-content: center; 
  }
}