/*
Pattern Name:       hero-banner-slider
Version:            1.0
*/

.ff-surtitre { font-family: "AbrilFatface", sans-serif !important; }
.ff-titre    { font-family: "ThrowMyHandsUpintheAir", sans-serif !important; }

.css-hero-slider { position: relative; }

.css-hero-slider-nav {
  position: absolute;
  bottom: 50px; right: 5vw;
  display: flex;
  gap: .5rem;
  max-width: 100%;
}

@media (min-width: 992px) {
  .css-hero-slider-nav {
    gap: 1rem;
    max-width: 45%;
  }

  .css-hero-slider-nav figure { width: 80px; }
}

.css-hero-slider-nav figure {
  position: relative;
  width: 50px; height: auto;
  object-fit: cover;
  margin-bottom: 0;
}

.css-hero-slider-nav figure img {
  position: absolute;
  width: 100%; height: 100%;
  border: 1px solid transparent;
  border-radius: 8px;
  opacity: .5;
  cursor: pointer;
  object-fit: cover;
  -webkit-transition: all .3s ease;
     -moz-transition: all .3s ease;
          transition: all .3s ease;
}

.css-hero-slider-nav figure img:hover {
  border: 1px solid white;
  opacity: .8;
}

.css-hero-slider-nav figure.slide-active img {
  border: 1px solid white;
  opacity: .8;
}

.css-hero-slider-nav figure:after {
  display: block;
  content: '';
  padding-bottom: 100%;
}

.block-editor-block-list__block.wp-block-buttons { height: initial!important; }