@property --num {
  syntax: "<integer>";
  initial-value: 0;
  inherits: false;
}


.page-template-rse {overflow-y: initial;}
.page-template-rse.modal-open {padding-right: 0px !important;}
.page-template-rse .wrappcore {overflow: hidden;}

.banners img{opacity: 0.6;transition: all 0.3s ease}
.banners img:hover {opacity:1;}

.wrapdocument {    height: calc(100%);
    display: flex;
    align-items: center;
    margin: auto;
    padding: 25px;}
.wrapdocument .modal-content {
    width: 100%;
    pointer-events: auto;
    border: 0;
        border-radius: 10px;
            margin: auto;
    overflow: hidden;
    outline: 0;top: 40px;    max-height: calc(100vh - 180px);}

.wrapdocument  img{  
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;

    object-position: 50% 50%;}

.swiper {aspect-ratio: 16 / 9;}
.greenwrapp {    position: fixed;
    right:7vw;
    top: 150px;  }
.greenwrapp.left {position: fixed;
    left:0vw;
    right:inherit;
    top: 150px;}
.modal-open .greenwrapp  {
    z-index: 1070;
}

.greenanim {
    min-width:7vw;
    height: auto;
}
.left .greenanim {
transform: rotate(180deg);
}
    
@media (min-width: 1600px){
.modal-xl {
    max-width: 1500px;
}
}

@media (max-width: 992px) { 
.modal-dialog {
        max-width: 83.8%;
}
.modal-open .greenwrapp {z-index: inherit;}
.greenwrapp {   
    right:20vw;
    top: 20vh;  }
.greenwrapp.left {
    top: 20vh;}
.greenanim {
    min-width:20vw
}


}


@media (max-width: 992px) and (orientation: landscape) { 
.modal-dialog {
        max-width:84%;
}

.wrapdocument .modal-content {
    top: 30px;
    max-height: calc(100vh - 80px);
}
}
.justify-content-center .row  ul li {
    margin: 0;
    margin-left: 20px;
    position: relative;
    overflow: visible !important;
}

.justify-content-center .row li::before {
    content: "";
    background-image: url(https://bai-bao.fr/wp-content/themes/bai-bao/assets/round__list--service.svg);
    display: block;
    position: absolute;
    left: -20px;
    top: 5px;
    height: 13px;
    width: 13px;
}






.swiper.graineswiper {
    aspect-ratio:inherit;
}

.swiper.graineswiper{
    background-image: url(https://bai-bao.fr/wp-content/themes/bai-bao/assets/img/terre0.png);
    /* background-size: contain; */
    background-repeat: repeat-x;
    /* mix-blend-mode: lighten; */
    background-position: 0% 52%;
}

.wrappterrefrise{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    z-index: 0;
    left: 0;
    width: 0%;
    height: 100%;
    transition: width 2s ease 2s;
    overflow: hidden;}
.wrappterrefrise .terrefrise{
    content: "";
    display: block;
    background-image: url(https://bai-bao.fr/wp-content/themes/bai-bao/assets/img/terre.png);
    background-size: auto;
    background-repeat: repeat-x;
    /* mix-blend-mode: lighten; */
    background-position: 0% 52%;
    /* position: absolute; */
    top: 0;
    width: calc(100%);
    height: 100%;
}
.is-visible .animfrise {
animation-name: animfrise;
  animation-duration: 5s;animation-delay: 0.1s;animation-timing-function: ease;animation-fill-mode: forwards;
}

/*.wrappterrefrise .terrefrise::after {
    content: "54%";

}*/
.pourcentnumber {
    position: absolute;
right: 6px;
    display: block;
    top: calc(50% + 12px);
  transition: --num 5s ease;
  counter-set: num var(--num);
  font: 800 16px system-ui;

    opacity: 0.5;

}
.pourcentnumber::after {
  content: counter(num)"%";
}



.swiper.graineswiper .slidetexte {
text-align: center;

} 
.swiper.graineswiper .slidetexte.fondutexte {
    
    color: #75B670;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
    font-size: calc(0.4rem + .16vw);
    line-height: 1.5;
    opacity:0;
    transition: opacity 1s ease 0.3s
} 

.swiper.graineswiper .pictotexte {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: -25px;
    max-height: 24px;
}
.swiper.graineswiper .swiper-slide:nth-child(odd) .pictotexte{
        top: inherit;bottom:0px}
.swiper.graineswiper .swiper-slide-visible .slidetexte.fondutexte {
opacity: 1;
} 
.swiper.graineswiper .slidetexte span {
    color: #357230;
    text-transform: uppercase;
    font-size: 13px;
    font-family: 'GTWalsheimProBold',sans-serif;
    font-weight: 600;
    opacity:0;
    transition: opacity 1s ease 
}

.swiper.graineswiper .swiper-slide-visible .slidetexte span {
opacity: 1;
}

.swiper.graineswiper video {
    position: relative;
    width: auto;
    height: 240px;
    object-fit: contain;
margin-top: 10px;margin-bottom: 150px;mix-blend-mode: lighten;
    z-index: 10;
}
.swiper-button-next.maskfrise, .swiper-button-prev.maskfrise {
background: #040028;
    padding: 45px;
    top: 44%;opacity: 1;transition: opacity 0.3s ease
}

.swiper-button-next.maskfrise, .swiper-rtl .swiper-button-prev.maskfrise {right: 0;background: linear-gradient(
270deg
, rgba(4,0,40,1) 0%, rgba(4,0,40,0) 100%);}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
    position: relative;
    left: 30px;
    opacity: 0.5;
    font-size: 20px;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
    position: relative;
    right: 30px;
    opacity: 0.5;
    font-size: 20px;
}
.swiper-button-prev.maskfrise, .swiper-rtl .swiper-button-next.maskfrise {left: 0;background: linear-gradient(
90deg
, rgba(4,0,40,1) 0%, rgba(4,0,40,0) 100%);}

.swiper-button-next.maskfrise.swiper-button-disabled, .swiper-button-prev.maskfrise.swiper-button-disabled {
    opacity: .0;
}


@media (min-width: 576px) { 

.slidetexte:not(.fondutexte) {
    position: absolute;
}
.swiper.graineswiper .slidetexte:not(.fondutexte){
    position: absolute;
    width: 120%;
    left: -10%;
}
.swiper.graineswiper .swiper-slide:nth-child(odd) .slidetexte:not(.fondutexte){
        top: 265px;}
.swiper.graineswiper .swiper-slide:nth-child(2) .slidetexte:not(.fondutexte){
    top:60px;}
.swiper.graineswiper .swiper-slide:nth-child(4) .slidetexte:not(.fondutexte){
    top: 35px;}
.swiper.graineswiper .swiper-slide:nth-child(6) .slidetexte:not(.fondutexte){
    top: 25px;}

.swiper.graineswiper video {
       margin-bottom: 150px;
} 

}
@media (max-width: 1600px) { 
.swiper.graineswiper video {
    height: 220px;
}
.wrappterrefrise .terrefrise,
.swiper.graineswiper {
    background-position: 0% 50%;
}
.swiper.graineswiper .swiper-slide:nth-child(odd) .slidetexte:not(.fondutexte) {
    top: 240px;
}

.pourcentnumber {
    top: calc(50% + 6px);
}

}
@media (max-width: 1400px) { 
}


@media (max-width: 1200px) { 
.swiper.graineswiper .swiper-slide:nth-child(odd) .pictotexte{
        top: inherit;bottom:-16px}


}

@media (max-width: 992px) { 



}

@media (max-width: 768px) { 



}

@media (max-width: 576px) { 

.swiper.graineswiper .slidetexte:not(.fondutexte),
.swiper.graineswiper .swiper-slide:nth-child(odd) .slidetexte:not(.fondutexte){
    position: absolute;
    width: 100%;
    top: 0;
}
.swiper.graineswiper video {
    top: 12px;
}
.swiper-button-next.maskfrise, .swiper-button-prev.maskfrise {

    top: 41%;
 
}
.containerfrise {    margin-bottom: -140px;}

.swiper.graineswiper .swiper-slide:nth-child(1) .slidetexte:not(.fondutexte){
    top:30px;}
.swiper.graineswiper .swiper-slide:nth-child(2) .slidetexte:not(.fondutexte){
    top: 35px;}
.swiper.graineswiper .swiper-slide:nth-child(3) .slidetexte:not(.fondutexte){
    top: 35px;}
}