/* --- bloc-accordeon.css --- */

.container-bloc-accordeon { display: flex; flex-direction: column;}
.container-bloc-accordeon h2{margin-top: 0;}
.accordeon-toggle {cursor: pointer; padding: 1rem 0; position: relative; font-family: 'Lato'; font-weight: bold;font-size: 1.8rem; margin-left: 2rem;  border-top: 1px solid var(--couleur-secondaire-light);margin-top: 0;margin-bottom: 0;}
.accordeon-toggle:before {content: '•'; position: absolute;left: -2rem;color: var(--couleur-principale); font-size: 1.2rem;font-weight: bold;top: 30%;}
.accordeon-toggle:after {content: ' +';top:20%;   color: var(--couleur-principale);  font-size: 2rem;font-weight: 300;right: 1rem;position: absolute;}
.accordeon-toggle.open:after {content: ' -';}
.accordeon-content {display: none; overflow: hidden; padding:0 2rem; }
.accordeon-content.collapsed { height: 0;padding: 0;border: none;}
.accordeon-content .btn-cta{margin-bottom: 1rem;}

@media (min-width: 768px) {
    .bloc-accordeon-intro {max-width: 80rem; }
}

/* --- bloc-bandeau-entete.css --- */
.container-bloc-bandeau-entete{display: flex; justify-content: center; align-items: center; padding: 2rem;}
.container-bloc-bandeau-entete .presentation-page { position: relative; width: 100%; border-radius: var(--border-radius); aspect-ratio: auto; display: flex;flex-direction: column; justify-content: center; align-items: center;text-align: center;overflow: hidden;background-size: cover;background-position: center;background-repeat: no-repeat;}
.container-bloc-bandeau-entete .presentation-page::before { content: ""; position: absolute;top: 0;left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); z-index: 1;}
.container-bloc-bandeau-entete .presentation-page *{color: white;}
.container-bloc-bandeau-entete .presentation-page *{position: relative; z-index: 2;}
.container-bloc-bandeau-entete .presentation-page p{font-size: 1.6rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);}

.container-bloc-bandeau-entete .presentation-page .titre-bandeau{margin: auto;max-width: 80%;}

@media (min-width: 1000px) {
	.container-bloc-bandeau-entete .presentation-page  { aspect-ratio: 16 / 9;}
}

/* --- bloc-bloc-titre.css --- */
.container-bloc-titre { text-align: center; flex-wrap: wrap; display: flex;flex-direction: row; justify-content: center; gap: 4rem;margin:8rem 0; }




.container-bloc-titre .img{ height: auto; aspect-ratio:3/2; border-radius: var(--border-radius); overflow: hidden;   position: relative; display: flex; justify-content: center; align-items: center; }
.container-bloc-titre .img img{object-fit: cover; height:100%; width: 100%; transition: transform .5s ease; }
.container-bloc-titre .un-bloc-titre:hover img { transform: scale(1.1); }

.container-bloc-titre h2{ border-radius: var(--border-radius); color: white; padding: 1.5rem 2rem; text-align: left; width: 70%; background: var(--couleur-secondaire); margin-left: 10%; margin-top: -3rem; z-index: 10; position: relative; }
.container-bloc-titre a { color: white; text-decoration: none; }
.container-bloc-titre p { padding: 0 2rem 1rem 2rem; text-align: left; }
.container-bloc-titre .btn.btn-secondary{ color: white;padding: 1rem 2rem; border: 1px solid white; position: absolute; opacity: 0.4; transition: 0.3s; }

.container-bloc-titre .un-bloc-titre:hover .btn.btn-secondary{ opacity:1; }


@media (min-width: 768px) {
	.container-bloc-titre .un-bloc-titre { width:calc(50% - 2rem);   }
}

/* --- bloc-carrousel-nouveautes.css --- */

.carrousel-nouveautes  .vignette-bg .realisation-thumbnail img{border-radius: var(--border-radius);}

.carrousel-nouveautes .bloc-fleche {  position: relative; display: flex;  justify-content: start; align-items: center;  gap: 1rem; max-width: 500px;}
.carrousel-nouveautes .bloc-fleche  button {width: 40px;height: 40px; margin: auto; background-color: var(--couleur-principale); color: white; border-radius: var(--border-radius);cursor: pointer; font-size: 1.8rem;  transition: background-color 0.3s, color 0.3s; border: 0; position: initial; opacity: 1;transform: none;}
.carrousel-nouveautes .bloc-fleche button::before {  content: "\f053"; font-family: "Font Awesome 6 Free"; font-weight: 900;display: block;}
.carrousel-nouveautes .bloc-fleche button:last-child::before { content: "\f054"; font-family: "Font Awesome 6 Free";font-weight: 900;display: block;}


.carrousel-nouveautes .carrousel-vignette {position: relative;   display: block; overflow: hidden;}
.carrousel-nouveautes .bloc-hover-carrousel { position: absolute;top: 0;  left: 0;  width: 100%;  height: 100%; background: var(--couleur-admin-text-light); color: white; display: flex;  align-items: center; justify-content: center;text-align: center; opacity: 0;transition: opacity 0.3s ease-in-out;}
.carrousel-nouveautes .carrousel-vignette:hover .bloc-hover-carrousel { opacity: 1; }

@media (min-width: 768px) {
  .carrousel-nouveautes  .vignette-bg .realisation-thumbnail { height: 600px; }
  .carrousel-nouveautes .bloc-hover-carrousel { position: absolute;top: 0;  left: 0;  width: 100%;  height: 100%; background: var(--couleur-admin-text-light); color: white; display: flex;  align-items: center; justify-content: center;text-align: center; opacity: 0;transition: opacity 0.3s ease-in-out;}

}

@media (min-width: 1000px) {
 .bloc-carrousel.carrousel-nouveautes  h2 {  text-align: left;   max-width: none; }
 .bloc-carrousel.carrousel-nouveautes .bloc-fleche {width: initial;padding: 0px;justify-content: start;}
}




  @media (min-width: 1200px) {
     .carrousel-nouveautes .section-carrousel-post .content-carrousel{padding: 10rem;text-align: left;} 
  }
@media (min-width: 1700px) {
   .carrousel-nouveautes .section-carrousel-post .bloc-fleche { width: initial;}
}

@media (max-width: 768px) {
  .bloc-carrousel.carrousel-nouveautes{padding: 0;}
}


@media (max-width: 1200px) {
.bloc-carrousel.carrousel-nouveautes .section-carrousel-post{display: block;padding: 0 4rem;margin-top: 0;}
 .bloc-carrousel.carrousel-nouveautes .bloc-fleche {margin: auto;width: 100%;}
  .bloc-carrousel.carrousel-nouveautes  h2 { text-align: center;}
 .bloc-carrousel.carrousel-nouveautes  .txt-carrousel{text-align: center;}
}

/* --- bloc-comparateur-decor.css --- */
.filtre-comparateur .select2-container .select2-selection--single {height: 50px;}
.filtre-comparateur .select2-container--default .select2-selection--single .select2-selection__rendered {line-height: 50px;}
.filtre-comparateur .select2-container--default .select2-selection--single .select2-selection__arrow {height: 50px;}
.filtre-comparateur .select2-results__option img {max-width: 50px;height: 50px;margin-right: 10px;}
.filtre-comparateur .select2-selection__rendered img {max-width: 50px;margin-right: 10px;vertical-align: middle; height: 50px;border-top-left-radius: var(--border-radius); border-bottom-left-radius: var(--border-radius);}
.filtre-comparateur .select2-container{max-width: 70px;}
.filtre-comparateur .select2-container--default .select2-selection--single{border-radius: var(--border-radius);border:0px;}
.filtre-comparateur .select2-container--default .select2-selection--single .select2-selection__rendered{padding: 0px;}
.filtre-comparateur .select2-results__option {display: flex; font-size: 0.8em;}
.filtre-comparateur .select2-results__option span {flex: 1;}
.filtre-comparateur .select2-dropdown { width: 200px !important; }
.filtre-comparateur{display: flex; flex-direction: row;justify-content: center;gap: 5rem;margin-top: 3rem;}
.filtre-comparateur .filtre{display: flex;align-items: center;border-right: 0.5rem solid var(--couleur-principale);gap:2rem;justify-content: center;    padding-right: 5rem;}
.filtre-comparateur .filtre:last-child{border-right: 0px;}

.filtre-comparateur .filtre p{margin: 0;}
.filtre-comparateur .filtre-decors {display: flex; gap:2rem;}
#containerComparateur {
    position: relative;
    width: 100%; /* Ou une largeur fixe si nécessaire */
    height: 600px; /* Hauteur fixe pour le conteneur */
    overflow: hidden;
}

#containerComparateur .before-image,
#containerComparateur .after-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Couvre tout l'espace disponible sans déformer l'image */
}

#containerComparateur img{width: 100%;}
#containerComparateur{    border-radius: var(--border-radius);margin-top: 3rem;}
#containerComparateurBtn {display: flex; justify-content:space-between; margin: 2rem 0; }

.filtre-lieu img{width: 50px;margin: auto;height: 40px;margin-bottom: 1rem;}

.filtre-lieu .option.selected p{color: var(--couleur-principale);font-weight: bold;}
.filtre-lieu .option{cursor: pointer;}
.filtre-lieu .option:hover p{color: var(--couleur-principale);font-weight: bold;}

@media (max-width: 900px) { 
    .filtre-comparateur{flex-wrap: wrap;}
    .filtre-comparateur>.filtre:first-child{border-right: 0px;}
    .filtre-comparateur .filtre {padding-right: 2rem;}
    #containerComparateur {height: 300px;}



}

/* --- bloc-decors-nouveaute.css --- */

.container-bloc-decors-nouveaute .bloc-btn { position: relative; display: flex; justify-content: center;align-items: center; gap: 1rem;max-width: 300px;  margin: 0 auto; }
.container-bloc-decors-nouveaute .bloc-btn button { width: 40px; height: 40px; margin: auto; background-color: var(--couleur-principale); color: white; border-radius: var(--border-radius);cursor: pointer;  font-size: 1.8rem; transition: background-color 0.3s, color 0.3s; border: 0;position: initial;opacity: 1;transform: none;}
.container-bloc-decors-nouveaute .bloc-btn button::before {content: "\f053"; font-family: "Font Awesome 6 Free";font-weight: 900;}
.container-bloc-decors-nouveaute .bloc-btn button:last-child::before { content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900;}
.container-bloc-decors-nouveaute  .picto-decor img {  filter: grayscale(100%); }

/* --- bloc-liste-decors.css --- */
.container-bloc-liste-decors a{
    cursor: pointer;
    flex: 1;
}

#filter .abloc svg { display: inline-block; width: 70px; height: 50px; }
#filter .abloc svg path{fill: var(--couleur-secondaire) !important}

#filter .abloc{ display: flex; flex-direction: column; align-content: center; align-items: center; padding: 1rem; border-radius: var(--border-radius); }
#filter>span{font-weight: bold;}
#filter { display:flex; gap: 5rem; align-content: center; align-items: center;   justify-content: space-around; flex-wrap:wrap; }
#filter div.radio{display: flex;}
@media (max-width: 900px) { #filter div.radio{flex-basis: 100%;}}
#filter .search{position: relative;}
#filter input{ padding: 0.5rem 1.2rem; border:0; }
#filter .search::before {
  content: "\f002";
  font-family: "Font Awesome 6 Free";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--couleur-texte);
  font-weight: 900;
  font-size: 1.6rem;
}


.containerradio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
/* On mouse-over, add a grey background color */
.containerradio:hover input ~ .abloc {
  background-color: var(--couleur-secondaire-dark);
}
.containerradio:hover input ~ .abloc span{
  color: white;
}
#filter .containerradio:hover input ~ .abloc svg path{fill: white !important}
/* When the radio button is checked, add a blue background */
.containerradio input:checked ~ .abloc {
  background-color: var(--couleur-secondaire-dark);
}
.containerradio input:checked ~ .abloc span{
  color: white;
}
#filter .containerradio input:checked ~ .abloc svg path{fill: white !important}
/* Create the indicator (the dot/circle - hidden when not checked) */
.abloc:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.containerradio input:checked ~ .abloc:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.containerradio .abloc:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

/* --- bloc-picto-produits.css --- */
.container-bloc-picto-produits .produits-list *{text-align: center;color: white;}
.container-bloc-picto-produits .produits-list{text-align: center;  display: flex;flex-direction: row; justify-content: center; gap: 4rem;margin:8rem 0;}
.container-bloc-picto-produits .produit-item .produit-thumbnail{width: 150px;margin: auto;height: 100px;}
.container-bloc-picto-produits .produit-item .produit-thumbnail img{height: auto;}
.container-bloc-picto-produits .produit-item h3{    font-family: 'Lato';}

/* --- bloc-presentation-page.css --- */
.container-bloc-presentation-page {display: flex; justify-content: center; align-items: center; padding: 0rem;}
.container-bloc-presentation-page  .presentation-page { position: relative; width: 100%; border-radius: var(--border-radius);display: flex;flex-direction: column; justify-content: center; align-items: center;text-align: center;overflow: hidden;padding: 2rem;}
.container-bloc-presentation-page  .presentation-page::before { content: ""; position: absolute;top: 0;left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1;}
.container-bloc-presentation-page  .presentation-page h2{color: white;max-width: 80%;margin-left: auto;margin-right: auto;}
.container-bloc-presentation-page  .presentation-page { background-size: cover;background-position: center;background-repeat: no-repeat;}
.container-bloc-presentation-page  .presentation-page h2,.container-bloc-presentation-page  .presentation-page .btn-cta {position: relative; z-index: 2;}
.container-bloc-presentation-page  .presentation-page .presentation-bloc{ z-index: 2; max-width: 100%; margin-bottom: 3rem;}
.container-bloc-presentation-page  .presentation-page .presentation-bloc ul {list-style: none;text-align: left;columns: 1; }
.container-bloc-presentation-page  .presentation-page .presentation-bloc ul li { border-left: 5px solid var(--couleur-principale);  margin-bottom: 2rem; font-size: 1.2rem; padding-left: 1rem;}
.container-bloc-presentation-page  .presentation-page .presentation-bloc ul li strong { display: block;text-transform: uppercase;}

@media (min-width: 1000px) {
	.container-bloc-presentation-page  .presentation-page { aspect-ratio: 1 / 1; padding: 0;}
	.container-bloc-presentation-page  .presentation-page .presentation-bloc ul{columns: 2;}
	.container-bloc-presentation-page  .presentation-page .presentation-bloc{ max-width: 60%;}
}

/* --- bloc-reassurance.css --- */

.container-bloc-reassurance .bloc-reassurance { display: flex; justify-content: center; flex-wrap: wrap;width: 100%;}
.container-bloc-reassurance .item-reassurance { display: flex;flex-direction: column; align-items: center; text-align: center;  gap: 1rem;   width: 50%; }
.container-bloc-reassurance .picto-wrapper {  background-color: white;   border-radius: 50%;padding: 2rem;  display: flex;  justify-content: center;align-items: center; width: 120px; height: 120px; }
.container-bloc-reassurance .picto-wrapper img {height: auto;}
.container-bloc-reassurance .texte-reassurance *{ font-weight: bold;}
.container-bloc-reassurance .item-reassurance .picto-wrapper,.container-bloc-reassurance .item-reassurance .texte-reassurance { opacity: 0;transform: translateY(20px);transition: all 0.6s ease-out;}
.container-bloc-reassurance  .item-reassurance .picto-wrapper.animate-picto {opacity: 1;transform: translateY(0);}
.container-bloc-reassurance  .item-reassurance .texte-reassurance.animate-texte { opacity: 1; transform: translateY(0); transition-delay: 0.2s; }

@media (min-width: 768px) {
	.container-bloc-reassurance .item-reassurance {width: 20%;}
}

/* --- bloc-sliderSofema.css --- */

.slider-carrousel {width: 100%;margin: 4rem 0;}
.container-bloc-slider {padding: 0;}
.container-bloc-slider .slick-prev,.container-bloc-slider .slick-next{position: initial;display: inline-block;}
.container-bloc-slider .slick-prev:before,.container-bloc-slider .slick-next:before{display: none;}
.container-bloc-slider .slider-navigation {display: none; position: absolute; background-color: #fafafa; right: 2rem; top: 5rem;z-index: 1; color: var(--couleur-texte); border-radius: 5px;}
.container-bloc-slider .slider-navigation button {transform: none; font-size: 1.2rem; padding: 8px; width: auto; height: auto;}
.container-bloc-slider .slider-navigation span {font-size: 1.4rem; font-weight: 400; letter-spacing: 2px; padding: 5px 8px; border-left: 1px solid #e2e2e2; border-right: 1px solid #e2e2e2; display: inline-block; min-width: 50px; text-align: center;}
.container-bloc-slider {position: relative;}

.container-bloc-slider .slick-slide .slide-content { opacity: 0; transform: translateY(120%); will-change: transform, opacity; transition: opacity .9s, transform .9s cubic-bezier(.26,.54,.32,1) .3s; padding-left: 0; padding-right: 0; flex-direction: column; margin-top: 3rem;}

.container-bloc-slider .slick-active .slide-content {opacity: 1;transform: translateY(0);}



.container-bloc-slider.entete-center .slide-content {text-align: center;align-items: center; justify-content: center;}
.container-bloc-slider:not(.entete-center) .slide-content {justify-content: flex-end;}
.container-bloc-slider.entete-center .slide-content .btn-cta {margin-left: auto; margin-right: auto;}
.container-bloc-slider h1, .container-bloc-slider h2 {margin-top: 0;}
.container-bloc-slider .slick-active .image-slide  img{transform: scale(1);}

.container-bloc-slider .slick-slide .image-slide {position: relative;overflow: hidden; width: 100%; aspect-ratio: 16/9; height: 100%;}
.container-bloc-slider .slick-slide .image-slide:before {content: "";pointer-events: none; width: 100%; height: 100%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; background: radial-gradient(rgba(0, 0, 0, .36) 0%, transparent 100%);}

.container-bloc-slider.border-radius .slick-slide .image-slide {border-radius: var(--border-radius);}
.container-bloc-slider .image-slide img {display: block;position: absolute;left: 0;top: 0;height: 100%;object-fit: cover;width: 100%; transform: scale(1.2); will-change: transform; transition: transform 2s cubic-bezier(.21,.6,.35,1);}
.container-bloc-slider.border-radius .image-slide img {border-radius: var(--border-radius);}

/*
.image-slide iframe, .image-slide object, .image-slide embed {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    aspect-ratio: 16/9;
}*/

.image-slide .video-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 2px solid #000; /* Add a border */
    background-color: #f0f0f0; /* Add a background color */
}

@media (min-width: 768px) {
    .container-bloc-slider .slick-slide .slide-content {padding-left: 5rem; padding-right: 5rem; margin-top: 0; }
    .container-bloc-slider .slider-navigation {display: block;}
    .container-bloc-slider:not(.entete-center) .slide-content {padding-bottom: 6rem;}
    .container-bloc-slider .slide-content {position: absolute; top: 0; left: 0;right: 0; bottom: 0; display: flex; z-index: 2;}
    .container-bloc-slider.entete-center .slide-content {max-width: 80rem;}
    }
    
@media (min-width: 1000px) {
    .container-bloc-slider:not(.entete-center) h2, .container-bloc-slider:not(.entete-center) h1 {max-width: 60%;}
}

/* Styles pour la vidéo YouTube en arrière-plan */
.container-bloc-slider.has-youtube-bg {
    position: relative;
    overflow: hidden;
}

.youtube-background-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    overflow: hidden;
}

.youtube-bg-player {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
}

/* Masquer la vidéo YouTube en arrière-plan sur mobile pour des performances optimales */
@media (max-width: 767px) {
    .youtube-background-container {
        display: none;
    }
}

/* Overlay pour améliorer la lisibilité du contenu par-dessus la vidéo */
.container-bloc-slider.has-youtube-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    z-index: 0;
    pointer-events: none;
}

/* S'assurer que le contenu du slider reste au-dessus de la vidéo */
.container-bloc-slider.has-youtube-bg .slider-carrousel,
.container-bloc-slider.has-youtube-bg .slider-navigation {
    z-index: 1;
}

/* Ajuster la hauteur minimale pour les sliders avec vidéo en arrière-plan */
.container-bloc-slider.has-youtube-bg {
    aspect-ratio: 16/9;
}

/* Masquer complètement tous les éléments d'interface YouTube */
.youtube-background-container iframe {
    pointer-events: none; /* Désactive toutes les interactions */
}

/* Masquer les éléments YouTube qui pourraient apparaître */
.youtube-background-container .ytp-chrome-top,
.youtube-background-container .ytp-chrome-bottom,
.youtube-background-container .ytp-watermark,
.youtube-background-container .ytp-gradient-top,
.youtube-background-container .ytp-gradient-bottom,
.youtube-background-container .ytp-show-cards-title,
.youtube-background-container .ytp-pause-overlay,
.youtube-background-container .ytp-upnext,
.youtube-background-container .ytp-endscreen-content,
.youtube-background-container .ytp-ce-element,
.youtube-background-container .ytp-cards-teaser,
.youtube-background-container .ytp-suggested-action,
.youtube-background-container .ytp-videowall-still,
.youtube-background-container .ytp-impression-link {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}



/* --- bloc-video.css --- */
.contenu-video-centrale{flex-direction: column;}

.contenu-video-centrale .thevideobloc{height: 600px; width: 100%;}

.contenu-video-centrale .thevideobloc button.plyr__control--overlaid {left: 50%;}

.ytp-show-cards-title{display: none !important;}

/* --- bloc-video-background.css --- */

.container-bloc-video-background  { position: relative; overflow: hidden;}
.video-bg { width: 100%; height: 40vh; object-fit: cover;}

.video-bg .video-container {  position: relative; width: 100%; height: 100%; overflow: hidden;}
.iconsound{ position: absolute; width: 50px; top: 30vh; right: 10px;  z-index: 9;  cursor: pointer;}
.video-bg { position: relative;}

.video-bg ::before { content: '';position: absolute; top: 0; left: 0;  width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2);  z-index: 1;}
.container-bloc-video-background .titre-video { position: absolute;  top: 50%; left: 50%;transform: translate(-50%, -50%); text-align: center;     z-index: 10; }
.container-bloc-video-background .titre-video .btn-cta{margin:auto;}


.titre-video p{font-size: 1.8rem;}

.container-bloc-video-background  .popup { display: none; position: fixed;top: 0;  left: 0; width: 100%;  height: 100%;background-color: rgba(0, 0, 0, 0.7);  z-index: 1000;}
.container-bloc-video-background  .popup-content {position: absolute;  top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #000; padding: 10px; border-radius: 8px;  max-width: 80%; max-height: 80%;}
.container-bloc-video-background  .popup-close {position: absolute;top: 10px;right: 15px; font-size: 24px; color: white; cursor: pointer;}
.container-bloc-video-background .popup-video iframe {  height: auto; border: none; width: 400px;  height: auto;max-width: 100%; }
.titre-video .titrevideo {font-size: 3rem;}
.titre-video .titrevideo strong{border-right: 2px solid var(--couleur-principale);padding: 0 2rem;}
.titre-video .titrevideo strong:last-child{border-right:0;}

@media (min-width: 768px) {
    .video-bg {height: 60vh;}
    .iconsound{ top: initial; bottom: 10px; }
    .container-bloc-video-background .popup-video iframe{width: 800px;  height: 500px;max-width: none;}
}