@import url('https://fonts.googleapis.com/css2?family=Racing+Sans+One&display=swap');

h1 {
    font-family: "Racing Sans One", sans-serif !important;
    font-weight: 400 !important;
    color: #ff0000 !important;
    padding: 30px 0px !important;
    font-size: 2.1em !important;
      line-height: 1.5 !important;
}
h2 {
    font-family: "Racing Sans One", sans-serif !important;
    font-weight: 400 !important;
    color: #ff0000 !important;
    padding: 30px 0px !important;
    font-size: 1.9em !important;
    line-height: 1.5 !important;
      line-height: 1.5 !important;
}

h3 {
    font-family: "Racing Sans One", sans-serif !important;
    font-weight: 400 !important;
    color: #ff0000 !important;
    padding: 30px 0px !important;
    font-size: 1.7em !important;
    line-height: 1.5 !important;
}

.bloc1 a{
    background: linear-gradient(90deg, rgb(0 0 0) 5%, rgb(255 0 0) 80%);
    padding: 13px 20px !important;
    display: block;
    margin-top: 17px !important;
    width: 244px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 16.5px !important;
    transition: transform 1.3s !important;
    text-align: center;
}
.bloc1 a:hover{
 background: linear-gradient(81deg, rgb(255 0 0), #000000);
 background-size: 400% 960%;
 -webkit-animation: bt 7s ease infinite;
 -z-animation: bt 7s ease infinite;
 -o-animation: bt 7s ease infinite;
 animation: bt 5s ease infinite;
 transform: scale(0.95);
}
.bloc1 .wizi-imgtxt--reverse .wizi-imgtxt__left {
    padding: 20px 20px 20px 20px !important;
}
.bloc2 a:hover {
    transform: scale(0.9);
}
.wizi-form.wizi-form--simple span {
    color: #999999 !important;
}
.bloc2 a {
    display: block;
    transition: transform 1.3s !important;
}
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 100px !important;
}
    .search--fieldset {
        box-shadow: 0px 0px 3px 3px #f805080a;
        border-radius: 5px !important;
    }

div#\32 b03991e-610b-4526-af5c-c945da9070b1 {
    background-color: #e6e6e6 !important;
    padding: 20px 20px !important;
    text-align: center;
}

.bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 100px !important;
}

.bloc3 a {
    background: linear-gradient(90deg, rgb(0 0 0) 5%, rgb(255 0 0) 80%);
    padding: 13px 20px !important;
    display: block;
    margin-top: 17px !important;
    width: 265px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    transition: transform 1.3s !important;
    text-align: center;
}
.bloc3 a:hover{
 background: linear-gradient(81deg, rgb(255 0 0), #000000);
 background-size: 400% 960%;
 -webkit-animation: bt 7s ease infinite;
 -z-animation: bt 7s ease infinite;
 -o-animation: bt 7s ease infinite;
 animation: bt 5s ease infinite;
 transform: scale(0.95);
}
@-webkit-keyframes bt {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-moz-keyframes bt {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@-o-keyframes bt {
    0%{background-position:0% 82%}
    50%{background-position:100% 19%}
    100%{background-position:0% 82%}
}
@keyframes bt { 
    0%{background-position:0% 82%}
    50%{background-position: 100% 29%;}
    100%{background-position:0% 82%}
}
.bloc3 .wiziblocks__item__maxWidth {
    background-color: #ffffff24;
    padding: 80px 200px !important;
}
.bloc3 {
    background-image: url(https://media.cdnws.com/_i/413664/RAW-1169/1771/70/00fichier-400.png) !important;
    background-position: center;
    background-repeat: no-repeat;
}
.prd {
    background-image: url(https://media.cdnws.com/_i/413664/RAW-1174/35/75/00fichier-200.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.prd .wiziblocks__item__maxWidth {
    background-color: #0000002e !important;
    padding: 70px 50px !important;
}

.prd .prod__shadow {
    background-color: #000000 !important;
    border-radius: 10px !important;
}

.prd span.prod__name__title {
    color: #fff !important;
}

.prd p.prod__price__cur {
    background-color: #ff0000 !important;
    padding: 5px 16px !important;
    border-radius: 5px !important;
    color: #fff !important;
}

.rea {
    background-color: #000;
}

.rea__item {
    padding: 20px 20px !important;
}

.rea__item {
    color: #fff !important;
}

.rea__item strong {
    color: #fff !important;
}

.footer__title {
    color: #000 !important;
}

.footer__link {
    color: #000 !important;
}

.footer__info__text {
    color: #000000 !important;
}

.footer__desc {
    color: #000 !important;
}

.backTop:hover .backTop__text, .backTop__text {
    color: #000 !important;
}

.backTop__icon {
    background-color: #ff000036 !important;
    border-radius: 50% !important;
}

.footer {
    background-color: #fff !important;
}
.header__logo img:hover {
    transform: scale(0.95);
    filter: drop-shadow(2px 4px 6px #00000070);
}
.header__logo img {
     transition: transform 1.4s !important; 
  animation: fadeInDown;
    animation-duration: 3s;
}
.powered {
    background: #000000 !important;
    border-top: 1px solid #ffffff !important;
    padding: 10px 40px !important;
}
.body__wrapper--withoutPadding {
    margin-top: 0px !important;
}



.nav__arrow {
    border-right: 1px solid #ffffff;
    border-top: 1px solid #ffffff;
    border-color: #fff !important;
}
/**************************** responsive*********************/
@media (max-width: 719px) and (min-width: 320px){
    .vign {
    display: block;
    justify-content: space-around;
    width: 70%;
    margin: 0 auto;
}

.m1 {
    margin: 1px 2px !important;
}

.m1 a {
    transition: transform 1s !important;
    display: block;
}
.m1 a:hover {
      transform: scale(0.97);
      filter: drop-shadow(2px 4px 6px #0008);
}
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 0px !important;
}
  .bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 0px !important;
}
  .prd .wiziblocks__item__maxWidth {
     padding: 70px 10px !important;
}  
    .bloc3 .wiziblocks__item__maxWidth {
    padding: 50px 10px !important;
}
.rea__item {
    padding: 10px 10px 20px 66px !important;
}    
  .footer__bloc {
    text-align: center !important;
}

}
@media (max-width: 1023px) and (min-width: 720px){
    .vign {
    display: flex;
    justify-content: space-around;
}

.m1 {
    margin: 5px 5px !important;
}

.m1 a {
    transition: transform 1s !important;
    display: block;
}
.m1 a:hover {
      transform: scale(0.97);
      filter: drop-shadow(2px 4px 6px #0008);
}
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 30px !important;
}
.bloc1 .wizi-imgtxt {
      display: block !important;
}
  .bloc1 .wizi-imgtxt--reverse .wizi-imgtxt__left {
    width: 100% !important;
}
  .bloc1 .wizi-imgtxt--reverse .wizi-imgtxt__right {
    width: 100% !important;
  }
  .bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 30px !important;
}
  .bloc2 .wizi-imgtxt {
    display: block !important;
  }
  .bloc2 .wizi-imgtxt__left{
 width: 100% !important;
  }
  .bloc2 .wizi-imgtxt__right {
     width: 100% !important;
  }
  .bloc3 .wiziblocks__item__maxWidth {
    padding: 50px 60px !important;
}
      body.wiziblocks-on .prod .prod__article {
        padding: 0 6px !important;
        width: 25% !important;
    }
        .search--wrapper .search--fieldset {
        width: 226px !important;
          left: -17px !important;
      
    }
  .prd .wiziblocks__item__maxWidth {
    padding: 70px 20px !important;
}
}
@media (max-width: 1199px) and (min-width: 1024px){
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 0px !important;
}
  .bloc1 .wizi-imgtxt--textRightTextLeft .wizi-imgtxt__right--medium:before {
    padding-top: 74.715% !important;
}
  .bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 0px !important;
}
  .bloc2 .wizi-imgtxt--textLeftTextRight .wizi-imgtxt__left--medium:before {
    padding-top: 75% !important;
}
.bloc2 .wizi-imgtxt__right {
    padding: 20px 20px 20px 20px !important;
}
  .bloc3 .wiziblocks__item__maxWidth {
    padding: 60px 50px !important;
}
}
@media (max-width: 1399px) and (min-width: 1200px){
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 20px !important;
}
  .bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 20px !important;
}
  .bloc3 .wiziblocks__item__maxWidth {
    background-color: #ffffff24;
    padding: 80px 100px !important;
}
  .bloc1 .wizi-imgtxt--textRightTextLeft .wizi-imgtxt__right--medium:before {
    padding-top: 76.715% !important;
}
  .bloc2 .wizi-imgtxt__right {
    padding: 20px 20px 20px 20px !important;
}
  .bloc2 .wizi-imgtxt--textLeftTextRight .wizi-imgtxt__left--medium:before {
    padding-top: 73% !important;
}
       .nav__maxWidth {
        justify-content: center !important;
    } 
}

@media (max-width: 1599px) and (min-width: 1400px){
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 50px !important;
}
  .bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 50px !important;
}
  .bloc3 .wiziblocks__item__maxWidth {
    background-color: #ffffff24;
    padding: 80px 150px !important;
}
  
}
@media (max-width: 1800px) and (min-width: 1600px){
.bloc1 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 50px !important;
}
  .bloc2 .wizi-wrapper.wizi-wrapper--imgtxt {
    padding: 40px 50px !important;
}
  .bloc3 .wiziblocks__item__maxWidth {
    background-color: #ffffff24;
    padding: 80px 150px !important;
}
}
@media (max-width: 2020px) and (min-width: 1024px){
.nav {
    width: 100% !important;
    background-color: #000000 !important;
    min-width: 100% !important;
}
    .header {
        padding: 0px 0px !important;
    }
    .nav__itemlvl1 {
    color: #fff !important;
}
  .wizi-wrapper--formBackground .wizi-form {
    max-width: 660px !important;
     background-color: #0000008a !important;
    padding: 30px !important;
 }
  .vign {
    display: flex;
    justify-content: space-around;
}

.m1 {
    margin: 5px 5px !important;
}

.m1 a {
    transition: transform 1s !important;
    display: block;
}
.m1 a:hover {
      transform: scale(0.97);
      filter: drop-shadow(2px 4px 6px #0008);
}


}
/***********************************/

/******* Animation scrolling*************/

@media (max-width: 2100px) and (min-width: 1400px) {
   .m1:nth-child(4), .m1:nth-child(5), .bloc2 .wizi-imgtxt__left.wizi-imgtxt__left--medium{
        animation: slide linear;
        animation-timeline: view();
        animation-range-start: cover 0%;
        animation-range-end: contain 35%;
    }
       .m1:nth-child(1), .m1:nth-child(2) , .bloc2 .wizi-imgtxt__right{
        animation: slide2 linear;
        animation-timeline: view();
        animation-range-start: cover 0%;
        animation-range-end: contain 35%;
    }
     .m1:nth-child(3), .bloc1 .wizi-imgtxt__right.wizi-imgtxt__right--medium, .prd h2, div#\32 b03991e-610b-4526-af5c-c945da9070b1 h2{
        animation: reveal linear;
        animation-timeline: view();
        animation-range-start: cover 0%;
        animation-range-end: contain 35%;
    }
    .vign, .bloc3 .wizi-txt__item{
        animation: top linear;
        animation-timeline: view();
        animation-range-start: cover 0%;
        animation-range-end: contain 35%;
    }

}
@keyframes slide {
  from{
  transform: translateX(100%);
  opacity:0;
  }
  to {
  transform: translateX(0);
  opacity:1;
  }
}
@keyframes reveal {
  from{
  transform: scale(0);
  opacity:0;
  }
  to {
  transform: scale(1);
  opacity:1;
  }
}

 @keyframes slide2 {
  from{
  transform: translateX(-100%);
  opacity:0;
  }
  to {
  transform: translateX(0%);
  opacity:1;
  }
  @keyframes top {
  from{
  transform: translateY(100%);
  opacity:0;
  }
  to {
  transform: translateY(0);
  opacity:1;
  }
}
/********** end scrolling**********/