:root {

  --nanum: 'Nanum Gothic', sans-serif;
  --opensans: "Open Sans", sans-serif;
  --jost: 'Jost', sans-serif;

  --main-logivin-color: #a51547;

  --second-logivin-color: rgba(165,21,71,.1);

  --main-font-size: 16px;

  --transparent: rgba(255,255,255,.75);

  --small-font-size: 14px;

  --radius : 240px;

  --radius-small: 60px;

  --swiper-navigation-color: var(--main-logivin-color);

}



body {

	font-size: var(--main-font-size);

  font-family: var(--opensans);

}

body.home {

  background-color: var(--main-logivin-color);



}

.bgcover {

  height: 500px;

  background-size: cover;

}

.bg-logivin {

  background-color: var(--main-logivin-color) !important;

}

h1, h2, h3, h4 {

  font-family: var(--jost);

}



.svg {

  position: absolute;

  width: 0;

  height: 0;

}

.clipped {

  width: 100%;

  -webkit-clip-path: url(#clippath);

  clip-path: url(#clippath);

}

.clipped01 {

  position: relative;

}

.clipped01:before {

  background: url(../images/mask02.svg) no-repeat;

  content : ' ';

  width: 165px;

  height: 161px;

  position: absolute;

  left: 0;

  bottom: -2px;

  z-index: 999;

}



.swiper-slide figcaption {

  font-family: var(--jost);

  position: absolute;

  bottom: 10vh;

  z-index: 999;

  line-height: 1;

}



.line02 {

  margin-left: 75px;

}

nav#header {

  background: var(--transparent);

}



.navbar-brand img {

  height: 100px;

}



.navbar-expand-md .navbar-nav .nav-link {

  font-size: 24px;

  font-weight: bold;

  font-family: var(--jost);

  color: var(--main-logivin-color);

}

.navbar-expand-md .navbar-nav .nav-link.active {

  color: black;

}



.navbar-expand-md .navbar-nav .nav-link.active:after

 {

  content: '\f107';

   font: var(--fa-font-solid);

   background: black;

   font-size: 12px !important;

   display: flex; width: 15px; height: 15px; border-radius: 50%;

   color: white; justify-content: center; align-items: center;

   margin: auto;

}







.swiper-container {

  height: 80vh; overflow: hidden;

}

.home .swiper-container {

  height: 100vh;

}

.swiper__title {

  height: 100%;

  display: flex;

  align-items: flex-start;

  flex-direction: column;

  justify-content: center;

  opacity: 0;

  text-shadow: 1px 1px 1px rgba(0, 0, 0, 1.0);

}

.swiper__title h2 {

  font-size: 60px;

  font-weight: bold;

}



footer#footer {

  z-index: 999;

  position: relative;

  /* background: transparent; */

}

footer#footer:before {

  content: ' ';

  width: 240px; height: 240px;

  background: url(../images/bblr.svg);

  position: absolute;

  top: -239px; left: 0;

}

.text-bold, .strong {

  font-weight: bold;

}



#socials {

  background: url(../images/logo-logivin-footer.svg) no-repeat;

}



.swiper-scale-effect .swiper-slide-cover {

  transition: 10s ease-out;

  transform: scale(1);

}



.swiper-scale-effect .swiper-slide.swiper-slide-active .swiper-slide-cover {

  transform: scale(1.2);

}

.swiper-slide > .swiper-slide-cover {

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  background: transparent no-repeat 50% 50% /cover;

  transform-origin: 100% 100%;

}



#header__entreprise {

  background-image: url(../images/header-entreprise-1.jpg);

}

.page-template-page-mentionslegales,
.page-template-page-contact {
  background-image: url(../images/header-contact.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
}

#header__portail {

  background-image: url(../images/header-portail.jpg);

}

#header__map {

  background: var(--main-logivin-color);

}

.map__container {

  top: 0; left: 0;

}

#header__map .container-fluid {

  background: url(../images/bg-map.png);

  z-index:9; position:relative ; height: 100vh; justify-content: center; align-items: center;

  background-size: 100%; background-position: center center;

}

#header__services {

  background-image: url(../images/banniere_services.jpg);

}

#header__agences {

  background-image: url(../images/banniere_agences.jpg);

  background-position: bottom center;

}





.bg-entreprise {

    /* background-image: url(../images/separator.png);

    background-size: 50% 100%;

    background-position: bottom center;

    background-repeat: repeat-x; */

    min-height: 280px;



}

.bgbottomcenter {

  background-position: bottom center !important;

}

.who {

    background: url(../images/bg-entreprise.jpg) no-repeat top center /cover;

    overflow: hidden;

    border-bottom-right-radius: var(--radius);



}

.header-container {

  background-size: cover !important;

  min-height: 80vh;

  background-repeat: no-repeat;

}

.home .header-container {

  min-height: 100vh !important;

}

.page__title {

  font-size: 60px;

}



h3 {

  font-size: 50px !important;

  line-height: 0.8 !important;

}



.separator {

  background: url(../images/separator.jpg);

}

.panel, .panelEntreprise {

  min-height: 75vh;

}



.text-logivin {

  color: var(--main-logivin-color);

}

    .autoplay-progress {

      position: absolute;

      right: 16px;

      bottom: 16px;

      z-index: 10;

      width: 48px;

      height: 48px;

      display: flex;

      align-items: center;

      justify-content: center;

      font-weight: bold;

      color: var(--swiper-theme-color);

    }



    .autoplay-progress svg {

      --progress: 0;

      position: absolute;

      left: 0;

      top: 0px;

      z-index: 10;

      width: 100%;

      height: 100%;

      stroke-width: 4px;

      stroke: var(--swiper-theme-color);

      fill: none;

      stroke-dashoffset: calc(125.6 * (1 - var(--progress)));

      stroke-dasharray: 125.6;

      transform: rotate(-90deg);

    }

.bgpositiontopright {

  background-position: top right;

}

.cite .swiper-slide {

  font-size: 40px;

  text-align: center;

  display: flex;

  justify-content: center; align-items: center;

  height: 100%;

}

.fashion-slider02 .cite .swiper-slide {

  height: 500px;

}

.cite__container {

  position: relative;

}

.cite__container:before {

  content: ' ';

  background: url(../images/quotebefore.svg) no-repeat;

  width: 165px; height: 147px;

  position: absolute; top: 50px;left: -165px;

}

.cite__container:after {

  content: ' ';

  background: url(../images/quoteafter.svg) no-repeat;

  width: 165px; height: 147px;

  position: absolute; bottom: 50px;right: -165px;

}



#valeurs {

    background: url(../images/bg-entreprise.jpg) no-repeat left 140% /cover;

}

#portail {

  background: white;

}

.corner-tl {

  border-top-left-radius: var(--radius);

  border: 2px solid black;  

  border-bottom: 0;

  border-right: 0;

}

.corner-bl {

  border-bottom-left-radius: var(--radius);

  border-left: 2px solid black;  

  border-bottom: 2px solid black;

}



.btlr {

  border-top-left-radius: var(--radius);

  background: white;

}

.btrr {

  border-top-right-radius: var(--radius);



}

.bblr {

   border-bottom-left-radius: var(--radius);

 

}

.bbrr {

   border-bottom-right-radius: var(--radius);

 

}



.btlr-small {

  border-top-left-radius: var(--radius-small);

  background: white;

}

.btrr-small {

  border-top-right-radius: var(--radius-small);



}

.bblr-small {

   border-bottom-left-radius: var(--radius-small);

 

}

.bbrr-small {

   border-bottom-right-radius: var(--radius-small);

}







article.description {

  position: relative;

}



.vertical__line {

  position: absolute;

  top: 0; bottom: 0; width: 2px; background: black; height: 100%;

}

.values__title,

.why__title {

  background: white;

  position: absolute;

  right: 0;

}

.values__title {

  top: -60px;

}

.visibility-hidden {

  visibility: hidden;

}

.overflow-hidden {

  overflow: hidden !important;

}

.services__container .swiper-slide {

  height: auto;

  display: flex;

  justify-content: center;

  align-items: center;

}

.inner-120 {

  padding-top: 30px; padding-left: 30px;

}

.gallery-top .swiper-slide-active,

.gallery-topLog .swiper-slide-active {

  font-weight: bold;

  font-size: 20px;

  text-align: center;

}

.gallery-top .swiper-slide-active:after,

.gallery-topLog .swiper-slide-active:after

 {

  content: '\f107';

   font: var(--fa-font-solid);

   background: var(--main-logivin-color);

   display: flex; width: 20px; height: 20px; border-radius: 50%;

   color: white; justify-content: center; align-items: center;

   margin-left: 5px;

}



.h-300 {

  height: 300px;

  background-size: cover;

  background-position: center center;

}

.square {

    background-size: cover;

    background-position: center center;

    background-repeat: no-repeat;

}

/*

.square:before {

  position: absolute; height:100%; width: 100%; display: block;

  background: var(--main-logivin-color);

  opacity: 0.5;

  position: absolute; left: 0; top: 0;

  content: ' ';

}

*/



.sticky-top {

  position: sticky;

  top: 120px;

}

.navbar-brand img {

  transition: all ease .3s;

}

nav#header.compressed .navbar-brand img {

  height: 50px;

}



nav#header.compressed {

  background: white;

  padding: 0 !important;



}

nav#header.compressed:before {







}

.pb-120 {

  padding-bottom: 120px;

}





.swiperVertical {

      width: 100%;

      height: 70vh;

}



    .swiperVertical .swiper-slide {

      text-align: center;

      font-size: 18px;

      display: flex;

      justify-content: center;

      align-items: center;

    }



    .swiperVertical .swiper-slide img {

      display: block;

      width: 100%;

      height: 100%;

      object-fit: cover;

    }



.minheight100vh {

  min-height: 100vh !important;

}



.panel, .panel__logistique {

  min-height: 100vh;

  justify-content: center;

  display: flex;

  flex-direction: column;

}



.border-left {

  position: relative;

}

.border-left:before {

  width: 3px;

  background: var(--main-logivin-color);

  height: 100%;

  content: ' ';

  display: block;

  position: absolute;

  left: 0;

  top: 0;

}

.py-6 {

  padding: 60px;

}



.bg-second-color {

  background: var(--second-logivin-color);

}

.poste h2 {

  z-index: 99;

  text-shadow: 1px 1px 1px black;

}

.poste .ratio div {

  background-size: cover;

}

.btnLogivin, .btnLogivin:hover {

  background: var(--main-logivin-color);

}

.text-small {

  font-size: 14px;

}





.blink {

        animation: blink-animation 1s steps(5, start) infinite;

        -webkit-animation: blink-animation 1s steps(5, start) infinite;

}

@keyframes blink-animation {

  25% {

    opacity: 0.5;

  }

  50% {

    opacity: 0;

  }

  75% {

    opacity: 0.5;

  }

}



.region li:hover {

  cursor:pointer;

}

.region li:not(:hover) {

  opacity: 0.5;

}



.home #post__slider {

  position:relative;

}

.home footer#footer {

  position: absolute;

  bottom: 0;

  width: 100%;

  bottom: -30%;

}

.home .fashion-slider-button-next,

.home .fashion-slider-button-prev {

  z-index: 999999;

}



.swiper-slide { width: 80% }

.logistiqueswiper .swiper-wrapper, .servicesswiper .swiper-wrapper {

  min-height: 60vh;

}



.swiper-slide-container {

  text-align: center;

  font-size: 18px;

  background: #fff;

  height:100%;

  max-width: 600px;

  margin:auto;

    /* Center slide text vertically */

    display: -webkit-box;

    display: -ms-flexbox;

    display: -webkit-flex;

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    -webkit-justify-content: center;

    justify-content: center;

    -webkit-box-align: center;

    -ms-flex-align: center;

    -webkit-align-items: center;

    align-items: center;

}



.gallery-top, .gallery-topLog {

    height: 80%;

    width: 100%;

}

.gallery-thumbs {

    height: 20%;

    box-sizing: border-box;

    padding: 10px 0;

}

.gallery-thumbs .swiper-slide {

    width: 20%;

    height: 100%;

    opacity: 0.4;

}

.gallery-thumbs .swiper-slide-active {

    opacity: 1;

}

a {

  color: var(--main-logivin-color);

}

a:hover {

  color: black;

}

.dropdown-item.active, .dropdown-item:active {

  background: var(--main-logivin-color);

}

.slideshow {
  top: 200px;
}
#accordionExample .accordion-button {
  font-size: inherit !important;
}
.accordion-button:not(.collapsed),
.accordion-button:focus {
  background: var(--main-logivin-color);
  color: white;
}

#socials a {
  color: white !important;
}


.actus-grid {
}

.actus-grid li {

}

.swiperakanea {
  position: relative;
  padding: 0 40px; /* Laisse de l'espace à gauche et à droite pour les flèches */
}

.swiperakanea .swiper-slide {
  box-sizing: border-box;
}

.swiperakanea .swiper-button-next,
.swiperakanea .swiper-button-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10; /* s'assurer qu'elles sont au-dessus des slides */
  color: #000; /* ou une autre couleur si vous avez un fond clair */
}

.swiperakanea .swiper-button-next {
  right: 10px;
}

.swiperakanea .swiper-button-prev {
  left: 10px;
}
.swiperakanea .swiper-slide {
  padding: 0 50px !important;
}