/* IMPORT FONTS */

@font-face {

    font-family: 'roboto-r';

    src: url('../fonts/roboto-regular.eot');

    src: url('../fonts/roboto-regular.eot?#iefix') format('embedded-opentype'),

        url('../fonts/roboto-regular.woff2') format('woff2'),

        url('../fonts/roboto-regular.woff') format('woff'),

        url('../fonts/roboto-regular.ttf') format('truetype'),

        url('../fonts/roboto-regular.svg#roboto-regular') format('svg');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'roboto-i';

    src: url('../fonts/roboto-italic.eot');

    src: url('../fonts/roboto-italic.eot?#iefix') format('embedded-opentype'),

        url('../fonts/roboto-italic.woff2') format('woff2'),

        url('../fonts/roboto-italic.woff') format('woff'),

        url('../fonts/roboto-italic.ttf') format('truetype'),

        url('../fonts/roboto-italic.svg#roboto-italic') format('svg');

    font-weight: normal;

    font-style: italic;

    font-display: swap;

}





@font-face {

    font-family: 'nexa-b';

    src: url('../fonts/nexabold.eot');

    src: url('../fonts/nexabold.eot?#iefix') format('embedded-opentype'),

        url('../fonts/nexabold.woff2') format('woff2'),

        url('../fonts/nexabold.woff') format('woff'),

        url('../fonts/nexabold.ttf') format('truetype'),

        url('../fonts/nexabold.svg#nexabold') format('svg');

    font-weight: bold;

    font-style: normal;

    font-display: swap;

}





@font-face {

    font-family: 'nexa-l';

    src: url('../fonts/nexalight.eot');

    src: url('../fonts/nexalight.eot?#iefix') format('embedded-opentype'),

        url('../fonts/nexalight.woff2') format('woff2'),

        url('../fonts/nexalight.woff') format('woff'),

        url('../fonts/nexalight.ttf') format('truetype'),

        url('../fonts/nexalight.svg#nexalight') format('svg');

    font-weight: 300;

    font-style: normal;

    font-display: swap;

}





@font-face {

    font-family: 'd-din-cd-b';

    src: url('../fonts/d-dincondensed-bold.eot');

    src: url('../fonts/d-dincondensed-bold.eot?#iefix') format('embedded-opentype'),

        url('../fonts/d-dincondensed-bold.woff2') format('woff2'),

        url('../fonts/d-dincondensed-bold.woff') format('woff'),

        url('../fonts/d-dincondensed-bold.ttf') format('truetype'),

        url('../fonts/d-dincondensed-bold.svg#d-dincondensed-bold') format('svg');

    font-weight: bold;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'd-din-cd';

    src: url('../fonts/d-dincondensed.eot');

    src: url('../fonts/d-dincondensed.eot?#iefix') format('embedded-opentype'),

        url('../fonts/d-dincondensed.woff2') format('woff2'),

        url('../fonts/d-dincondensed.woff') format('woff'),

        url('../fonts/d-dincondensed.ttf') format('truetype'),

        url('../fonts/d-dincondensed.svg#d-dincondensed') format('svg');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}





@font-face {

    font-family: 'avantgarde-medium';

    src: url('../fonts/avantgarde-medium.eot');

    src: url('../fonts/avantgarde-medium.eot?#iefix') format('embedded-opentype'),

        url('../fonts/avantgarde-medium.woff2') format('woff2'),

        url('../fonts/avantgarde-medium.woff') format('woff'),

        url('../fonts/avantgarde-medium.ttf') format('truetype');

    font-weight: 500;

    font-style: normal;

    font-display: swap;

}

@font-face {
  font-family: 'Bebas';
  src: url('../fonts/BebasNeue.eot');
  src: url('../fonts/BebasNeue.eot?#iefix') format('embedded-opentype'),
      url('../fonts/BebasNeue.woff2') format('woff2'),
      url('../fonts/BebasNeue.woff') format('woff'),
      url('../fonts/BebasNeue.ttf') format('truetype'),
      url('../fonts/BebasNeue.svg#BebasNeue') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'din-r';
  src: url('../fonts/DIN-Regular.eot');
  src: url('../fonts/DIN-Regular.eot?#iefix') format('embedded-opentype'),
      url('../fonts/DIN-Regular.woff2') format('woff2'),
      url('../fonts/DIN-Regular.woff') format('woff'),
      url('../fonts/DIN-Regular.ttf') format('truetype'),
      url('../fonts/DIN-Regular.svg#DIN-Regular') format('svg');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}















/* RESET */

body, ul, li, ol, form, h1, h2, h3, h4, h5, h6, div, span, p { padding:0; margin:0; border:0; -webkit-text-size-adjust:none; -moz-text-size-adjust:none; text-size-adjust:none;}

article, aside, dialog ,figcaption, figure, footer, header, hgroup, main, nav, section { display:block;}  

input, textarea                                             { -webkit-appearance:none; -ms-appearance:none; appearance:none; -moz-appearance:none; -o-appearance:none; border-radius:0;}

*                                                           { outline:none !important;}

strong, b                                                   { }

ul                                                          { list-style-type:none;}

body                                                        { font:normal 22px/25px d-din-cd, Arial; color:#000000;}

body *                                                      { box-sizing:border-box; outline:0 }

a                                                           { text-decoration:none; color:#ffffff; outline:none;}

img                                                         { border:none;}

p{ margin-bottom: 10px }



/* CLASS */

.clear                                                      { clear:both; float:none !important; width:100% !important; padding:0 !important; margin:0 !important; display:block;}

.clr:after                                                  { content:''; display:table; width:100%; clear:both}

.wrapper                                                    { margin: auto;padding: 0 40px;max-width: 1105px; width: 100%}

.slick-prev         { width:40px; height:63px; background:url(../images/arrow-left.png) 50% 50% no-repeat;  z-index:50; cursor:pointer; text-indent:-9999px; outline:none; border:0; padding:0;}

.slick-next         { width:40px; height:63px; background:url(../images/arrow-right.png) 50% 50% no-repeat; z-index:50; cursor:pointer; text-indent:-9999px; outline:none; border:0; padding:0;}



.btn{ background: #70ab9a;padding: 6px 20px 4px;font:normal 14px/24px roboto-r, Arial;text-transform: uppercase;border-radius: 10px ;display: inline-block}







/* HEADER */

.banner-mob{ display: none }

.blcTop{ position: absolute;top: 0;width: 100%;z-index: 99991;padding: 27px 0 0; }

.blcTop.dark{ padding-top: 12px }

.blcTop .wrapper{ display: flex;align-items: center;position: relative }

.slogan{ font:normal 18px/24px nexa-l, Arial; color:#ffffff;text-transform: uppercase;letter-spacing: 22px;padding-left: 20px }

.dark .slogan{ color: #000000; }

.dark.blcTop .btn-menu span::before,

.dark.blcTop .btn-menu span::after,

.dark.blcTop .btn-menu span{ background: #000; }

.logo{ display: inline-block }

.logo img{display: block}

.blcBanner{ position: relative }

.slider .item{ height: 100vh;min-height: 600px;background-size: cover;background-repeat: no-repeat;background-position: center; display: flex;align-items: center;justify-content: flex-end;flex-direction: column;padding-bottom: 160px }

/*.slider .item0{  background-image:url(../images/bg-banner0.jpg)}

.slider .item1{  background-image:url(../images/bg-banner1.jpg)}

.slider .item2{  background-image:url(../images/bg-banner2.jpg)}

.slider .item3{  background-image:url(../images/bg-banner3.jpg)}*/

.blcTop .btn-menu{ position: absolute;right: 68px;top: 6px;width: 30px;height: 20px;cursor: pointer;z-index: 10 }

.blcTop .btn-menu span{ width: 100%;height: 4px;background: #ffffff;position: absolute;top: 50%;left: 0;right: 0;margin:-2px auto 0;border-radius: 5px }

.blcTop .btn-menu span:before{ content: '';position: absolute;top: -8px;left: 0;height: 4px;background: #ffffff;width: 100%;border-radius: 5px}

.blcTop .btn-menu span:after{ content: '';position: absolute;bottom: -8px;left: 0;height: 4px;background: #ffffff;width: 100%;border-radius: 5px}

.arrow-slider{ position: absolute;width: 100%;z-index: 999;top: 50%;margin: -31px auto 0;max-width: 1105px;left: 0;right: 0;padding: 0 40px;display: flex;justify-content: space-between}

.text-copyright{ position: absolute;bottom: 45px;text-align: center;left: 0;right: 0;width: 100%;font:normal 12px/16px roboto-r, Arial; color:#ffffff;text-transform: uppercase }

.scrollBottom{ margin: auto;width: 43px;height: 56px;border: 1px solid #fff; background:url(../images/scrollBottom.png)center no-repeat;border-radius: 10px ;display: inline-block;animation: MoveUpDown 1s infinite ease-in-out;opacity: 0.4}

.blcBanner .scrollBottom{ position: absolute;bottom: 70px;left: 0;right: 0; }



.scrollBottom.scroll:hover { animation-play-state: paused; }

@keyframes MoveUpDown {

  0% {

    background-position-y: 17px;

  }

  50% {

   background-position-y: 23px;

  }

  100% {

    background-position-y: 17px;

  }

}



/*.textBanner{text-align: center;

    position: absolute;

    z-index: 99;

    padding: 0 20px;

    bottom: 140px;

    width: 100%;}*/

.textBanner{ text-align: center ;position: absolute;z-index: 99;padding: 0 20px; bottom: 160px;  width: 100%;}

.textBanner h1{ font:normal 59px/60px d-din-cd-b;text-transform: uppercase;color: #ffffff;}

.textBanner h2{ font:normal 32px/40px d-din-cd-b;text-transform: uppercase;color: #ffffff;text-align: center ;text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3); }



.blcBanner .deco{ position: absolute;bottom: 0;left: 0;right: 0;margin: auto; width: 30%;z-index: 16}

.blcBanner .deco img,

.blcBanner .item1 .missile img{ width: 100% }

.blcBanner .item1 .deco{ width: 23%;opacity: 0;transition: all ease-in-out 2s; }

.blcBanner .item1 .missile{ width: 13.3%;position: absolute;right: 30%;bottom: 41%;opacity: 0;z-index: 10; }



.blcBanner .item2 .deco{ width: 87.6%;left: 0;right: 0;display: flex;align-items: flex-start; }

.blcBanner .item3 .deco{ width: 44.2%;left: initial;right: 21.5% }

/* .blcBanner .item0 .deco{ background:url(../images/chat-botte0.jpg)center no-repeat;width: 100%;height: 100%;top: 0;left: 0 } */

.blcBanner .item0 .deco img{ object-fit: cover;height: 100%; }

  

.missile{ transition: bottom ease-in-out 4s,opacity ease-in-out 4s; transition-delay: 0s, 4s }

.missile img.decolle{  animation: decolle 0.2s infinite ease-in-out ;animation-delay: 11s; }

.blcBanner .item1 .missile.show{ opacity: 1 }

@keyframes decolle {

  0% {

    transform: translate(0px,0px);

  }



  100% {

    transform: translate(0px,3px);

  }

}



.b2{ transition: bottom ease-in-out 5s,transform ease-in-out 3s;transition-delay: 2s,4s;bottom: -200%;justify-content: center;transform: scale3d(2.5, 2.5, 2.5) translate(15%, 55%); }

.text1.on,

.text3.on{ transition: all ease-in-out 4s;transition-delay: 5s; }

.text1{ transition: transform ease-in-out 4s }

.text2{ transition: transform ease-in-out 4s;}

.text3{ transition: transform ease-in-out 4s; }

.text2.on{transition: all ease-in-out 4s;transition-delay: 4s;   }

/* .text3-b.on{ opacity: 0;transition: all ease-in-out 4s;transition-delay: 5s; }

.text3-b{ opacity: 1;transition: transform ease-in-out 4s }

 */

/* news */

.blcBanner .item1 .deco.show{ opacity: 1 ;transition: all ease-in-out 2s}



.run-out.text2 .char:before, .run-out.text2 .char:after{ transition-delay: calc( 0.06s * var(--char-total) + (0.08s * var(--char-index)) );  }

.run-out.text3 .char:before, .run-out.text3 .char:after { transition-delay: calc( 0.02s * var(--char-total) + (0.08s * var(--char-index)) );  }

.text3-b{ opacity: 1;transition: all ease-in-out 2s; transition-delay: 8s;  }

.text3-b.on{ opacity: 0;transition: all ease-in-out 2s;transition-delay: 0s;   }

.blcBanner{ opacity: 0 }



@keyframes move {

  0% {

    transform: translate(15px,1px);

  }

  33% {

   transform: translate(1px,15px);



  }

   66% {

   transform: translate(10px,7px);



  }



  100% {

    transform: translate(15px,1px);

  }

}



.blcBanner .item2 .deco img{ animation: move 6s infinite ease-in-out }

.b0{ transition: all ease-in-out 2s }





/* MENU BURGER */

.menu-burger{ position: fixed;width: 100%;height: 100vh;top: 0;left: 0;z-index: 99999999999999999 ;transform: translateX(100%);transition: 1s ease;transition-delay: 0s;transition-delay: 0s;transition-delay: .8s;}





/* .menu-burger{ position: fixed;width: 100%;height: 100vh;top: 0;left: 0;z-index: 999999 ;background: rgba(255,255,255,0.7);transform: translateX(0);display: none} */



.ajax-loader{ position: absolute!important }





.menu-burger.active{ transform: translateX(0);transition: 1s ease; }

.menu-burger .row{ height: 100%;justify-content: flex-end; }

.blcMenu{width: 42.6%;height: 100%;background: #ffffff;display: flex;align-items: center;padding-left: 22px;position: relative;}

.blcMenu .title-menu{ font:normal 42px/42px nexa-b, Arial;margin-bottom: 15px }

.blcMenu .menu a{ color: #000000;font:normal 24px/32px nexa-l, Arial;text-transform: uppercase;padding-bottom: 7px;display: block;position: relative}

.blcMenu .menu a:after{ content: '';width: 100%;height: 2px;background:url(../images/dotted.png)center;background-repeat: repeat-x;position: absolute;left: 0;bottom: 0 }

.blcMenu .menu li{ margin-bottom: 14px }

.blcMenu .menu li:last-child a{ padding-bottom: 0 }

.blcMenu .menu li:last-child a:after{display: none}

.blcMenu .rs { display: flex;position: absolute;bottom: 24px }

.blcMenu .rs a{ width: 25px;height: 25px; display: block;margin-left:8px;position: relative  }

.blcMenu .rs a:before{ content: '';width: 25px;height: 25px;position: absolute;left: 0;top: 0 }

.blcMenu .rs .fb{ background:url(../images/icon-fb.svg)center no-repeat; }

.blcMenu .rs .fb:before{ background:url(../images/icon-fb-green.svg)center no-repeat;opacity: 0; }

.blcMenu .rs .linkedin{ background:url(../images/icon-linkedin.svg)center no-repeat; }

.blcMenu .rs .linkedin:before{ background:url(../images/icon-linkedin-green.svg)center no-repeat;opacity: 0; }

.menu-burger .icon-close{ position: absolute;width: 40px;height: 40px;top: 27px;left: 22px ;background:url(../images/icon-close2.png)center no-repeat;cursor: pointer  }

.bg-burger{ position: fixed;width: 100%;height: 100%;background: #ffffff;opacity: 0;top: 0;transition-delay: 0s;transition-delay: 0s;transition-delay: .8s;z-index: -10 }

.bg-burger.show{ opacity: 0.7;transition: 1s ease;z-index: 9999999999999999999 }





/********** ETOILE **********/



.small-stars2,

.small-stars3,

.small-stars4{ position: absolute;width: 100%;height: 1600px;top: 0;left: 0;background:url(../images/small-star-slide2.png)center no-repeat;background-size: cover;}

.small-stars2.show,

.small-stars3.show,

.small-stars4.show{ animation: animStar 180s infinite ease-in }

/* .fond_slide2{  position: absolute;width: 100%;height: 100%;top: 0;left: 0;background:url(../images/fond2-slide2.png)center no-repeat;background-size: cover;z-index: 2} */

@keyframes animStar {

  from {

    transform: translateY(0px);

  }

  to {

    transform: translateY(-2000px);

  }

}





.big-stars2a,

.big-stars3a,

.big-stars4a{ position: absolute;width: 100%;height: 1600px;top: 0;left: 0;background:url(../images/big-star1-slide2.png)center no-repeat;background-size: cover;animation: animStar_big1 4s infinite ease-in}





@keyframes animStar_big1 {

  0% {

    opacity: 1;

  }

  50% {

   opacity: 0;



  }



  100% {

    opacity: 1;

  }

}









.big-stars2b,

.big-stars3b,

.big-stars4b{ position: absolute;width: 100%;height: 1600px;top: 0;left: 0;background:url(../images/big-star2-slide2.png)center no-repeat;background-size: cover;animation: animStar_big2 2s infinite ease-in}



@keyframes animStar_big2 {

  0% {

    opacity: 0;

  }

  50% {

   opacity: 1;



  }



  100% {

    opacity: 0;

  }

}



.big-stars2c,

.big-stars3c,

.big-stars4c{ position: absolute;width: 100%;height: 1600px;top: 0;left: 0;background:url(../images/big-star3-slide2.png)center no-repeat;background-size: cover;animation: animStar_big3 4s infinite ease-in}



@keyframes animStar_big3 {

  0% {

    opacity: 0;

  }

  50% {

   opacity: 1;



  }





  100% {

    opacity: 0;

  }

}









.fond_slide3{ position: absolute;width: 100%;height: 100%;top: 0;left: 0;background:url(../images/fond2-slide3.png)center no-repeat;background-size: cover;z-index: 2 }



.fond_slide4{ position: absolute;width: 100%;height: 100%;top: 0;left: 0;background:url(../images/fond2-slide4.png)center no-repeat;background-size: cover;z-index: 2 }











/* SECTION SERVICE */

.intro{ padding-top: 0 }

.row{display: flex;flex-wrap: wrap;align-items: center}

.col6{ width: 50% }

.blcTitre{ position: relative;padding-left: 74px; }

.blcTitre .blcRs{ position: absolute;left: 8px;top: 23px }

.blcTitre .blcRs a{ display: block;width: 25px;height: 25px;margin-bottom: 10px;border-radius: 50%;position: relative }

.blcTitre .blcRs a:before{ content: '';width: 25px;height: 25px;position: absolute;left: 0;top: 0;opacity: 0 }

.blcTitre .blcRs .fb{  background:url(../images/icon-fb.svg)center no-repeat }

.blcTitre .blcRs .fb:before{  background:url(../images/icon-fb-green.svg)center no-repeat  }

.blcTitre .blcRs .linkedin{  background:url(../images/icon-linkedin.svg)center no-repeat }

.blcTitre .blcRs .linkedin:before{  background:url(../images/icon-linkedin-green.svg)center no-repeat }

.titre{ font:normal 131px/100px d-din-cd-b, Arial; text-transform: uppercase}

.titre>span{ display: block }

.titre .bottom { padding-left: 67px;display: inline-block }

.titre .point{ color: #70ab9a }

.s-titre{ font:normal 26px/30px nexa-b, Arial;text-transform: uppercase;margin-bottom: 10px }

.intro .right p{ max-width: 375px; font-size:18px; }

.intro .col.left { width: 52%; }

.intro .col.right { width: 48%;padding-left: 20px;border-left:  2px solid #000000;padding-top: 13px }

.list-services .content-item .item{ display: block }

.list-services  .img{ display: block;overflow: hidden }

.list-services  .img img{ width: 100%;display: block;transform: scale(1.4) rotate(25deg);transition: transform .5s ease-in-out; }



.list-services{ max-width: 940px;margin:20px auto 34px;flex-wrap: wrap;width: 100% }

.list-services .item{ padding: 0 17px;width: 25%;cursor: pointer }

.list-services .inner-item{ position: relative }







@keyframes black-to-white1 {

  0% {

    color: #fff;

  }

  33% {

   color: #000;



  }



  66% {

   color: #000;

  }



  100% {

    color: #000;

  }

}



@keyframes black-to-white2 {

    0% {

    color: #000;



  }

  33% {

   color: #fff;



  }



  66% {

   color: #000;



  }



  100% {

    color: #000;



  }

}



@keyframes black-to-white3 {

    0% {

    color: #000;



  }

  33% {

   color: #000;



  }



  66% {

   color: #fff;



  }



  100% {

    color: #000;



  }

}



@keyframes black-to-white4 {

    0% {

    color: #000;

  }

  33% {

   color: #000;



  }



  66% {

   color: #000;



  }



  100% {

    color: #ffffff;

  

  }

}











@keyframes zoomin1 {

  0% {

    transform: scale(1.2);

  }

  33% {

   transform: scale(1);



  }



  66% {

   transform: scale(1);

  }



  100% {

    transform: scale(1);

  }

}



@keyframes zoomin2 {

    0% {

    transform: scale(1);



  }

  33% {

   transform: scale(1.2);



  }



  66% {

   transform: scale(1);



  }



  100% {

    transform: scale(1);



  }

}



@keyframes zoomin3 {

    0% {

    transform: scale(1);



  }

  33% {

   transform: scale(1);



  }



  66% {

   transform: scale(1.2);



  }



  100% {

    transform: scale(1);



  }

}



@keyframes zoomin4 {

    0% {

    transform: scale(1);

  }

  33% {

   transform: scale(1);



  }



  66% {

   transform: scale(1);



  }



  100% {

    transform: scale(1.2);

  

  }

}





.list-services .content-item{ position: relative;display: block; overflow:hidden}

.list-services .titre-srvc{ position: absolute;width: 100%;height: 100%;top: 0;left: 0 ;font:normal 50px/50px d-din-cd-b, Arial; text-transform: uppercase;color: #000000;display: flex;align-items: center;justify-content: center;z-index: 10;transform: scale(0.9);}



.list-services .item1 .titre-srvc{ animation: black-to-white1 8s infinite ease-in-out }

.list-services .item2 .titre-srvc{ animation: black-to-white2 8s infinite ease-in-out }

.list-services .item3 .titre-srvc{ animation: black-to-white3 8s infinite ease-in-out }

.list-services .item4 .titre-srvc{ animation: black-to-white4 8s infinite ease-in-out }



.list-services .item1 .img{ animation: zoomin1 8s infinite ease-in-out }

.list-services .item2 .img{ animation: zoomin2 8s infinite ease-in-out }

.list-services .item3 .img{ animation: zoomin3 8s infinite ease-in-out }

.list-services .item4 .img{ animation: zoomin4 8s infinite ease-in-out }



.sec-service .scrollBottom{ position: static;display: block}

.blcProjet{background:url(../images/bg-projet.jpg)center no-repeat;background-size: cover;text-align: center;padding: 25px 0 25px;  }

.sec-service>.top{ padding-bottom: 23px }

.blcProjet h2{ font:normal 38px/42px nexa-b, Arial;text-transform: uppercase;color: #70ab9a;margin-bottom: 15px }

.blcProjet .text{ color: #ffffff;font: normal 18px/22px d-din-cd, Arial; }

.blcProjet .tel{ font:normal 30px/30px nexa-b, Arial;color: #70ab9a;display: inline-block;margin-bottom: 15px;margin-top: 15px }

.sec-service .fp-tableCell>.top,

.sec-service .fp-scroller>.top,

.sec-service > .top{ min-height: 66vh;display: flex;justify-content: center;flex-direction: column ;

  background-size: cover;background-attachment: fixed; background-position: right center; }

.sec-service .blcProjet{ min-height: 34vh;display: flex;align-items: center;position: relative;z-index: 99 }











/* SECTION2 */

/* .sec-sur-mesure{ background:url(../images/bg-sur-mesure.jpg)center no-repeat;background-size: cover; position: relative} */



.sec-sur-mesure .scrollBottom{position: absolute;left: 0;right: 0;margin:auto;bottom: 30px;z-index: 9999}

.sec-sur-mesure .wrapp-sur-mesure{ padding-top: 80px }

.sec-sur-mesure .blcText{ max-width: 620px;padding-left: 70px;margin-top: 19px;padding-bottom: 345px; font-size: 18px; }

.sec-sur-mesure .tel{ font:normal 24px/28px nexa-b, Arial;color: #000000;margin-top: 10px;display: inline-block;padding-left: 38px ; background:url(../images/icon-tel.svg)left center no-repeat;min-height: 31px;display: flex;align-items: center}

.sec-sur-mesure .deco-buste{ position: absolute;bottom: 0;right: 13% ;width: 43%;display: block;z-index: 99}

.sec-sur-mesure .deco-bobine{ position: absolute;bottom: 72px;right: 88px;width: 84.5%;display: block;z-index: 0 }

.sec-sur-mesure .deco-bobine img,

.sec-sur-mesure .deco-buste img{ width: 100%;display: block } 

.sec-sur-mesure .wrapper{ position: relative;z-index: 999;height: 100%; }

.sec-sur-mesure .contact{ position: absolute;bottom: 20px;left: 110px;text-align: center }

.contact{ font:normal 18px/24px d-din-cd, Arial; text-transform: uppercase;color: #000000;padding-top: 50px; background:url(../images/icon-msg.png)center 4px no-repeat;min-width: 60px;display: inline-block}

.titre .point{ display: inline-block }



.inner-sec-sur-mesure{ height: 100%;position: relative; background:url(../images/bg-sur-mesure.jpg)center no-repeat;background-size: cover; position: relative}



body.overflow{ overflow: hidden!important }

body.overflow .detail-services{height: 100vh;overflow: scroll}





/* SECTION3 */

.sec-realisation .intro .col.left{ width: 58% }

.sec-realisation .intro .col.right{ width: 42%;     font-size: 18px; }

.listReal{ margin-top: 25px;display: flex;flex-wrap: wrap }

.listReal .item{ width: 33.33%;position: relative;overflow: hidden; }

.listReal .item .img{ display: block }

.listReal .item .img img{ width: 100%;display: block }

.listReal .item .hide { position: absolute;width: 100%;height: 100%;top: 100%;left: 0;background: rgba(0,0,0,0.6); padding: 20px;display: flex;align-items: center;justify-content: center;}

.listReal .item .hide .titre-real{position: absolute;bottom: 18px;display: flex;flex-wrap: wrap;justify-content: center;padding: 0 20px;}

.listReal .item .hide .titre-real li{  font:normal 26px/28px d-din-cd, Arial; text-transform: uppercase;color:#ffffff; list-style: none;}

.listReal .item .hide .titre-real li:after{ content: 'i';display: inline-block;margin: 0 6px; }

.listReal .item .hide .titre-real li:last-child:after{ display: none }

.sec-realisation{ background: #e7e8e2;padding-bottom: 0;position: relative;}

.sec-realisation .btn{ margin: 10px auto 0;display: block;width: 260px;cursor: pointer }

.sec-realisation .btn.active{ width: 285px }



.listReal .item.hide{ display: none }



.sec-realisation .intro{  padding-top: 80px; }



.sec-realisation .titre .bottom{ padding-left: 58px }



.sec-realisation .contact{display: block;width: 60px;padding-bottom: 35px;margin-left: 67px;text-align: center}

.sec-realisation .scrollBottom{ border-color: #333 ;position: absolute;bottom: 30px;left: 0;right: 0;margin:auto;background: url(../images/scrollBottom-gris.png)center no-repeat; }



.sec-sur-mesure.graphi-culteur{ background: #70ab9a; }

.sec-sur-mesure.graphi-culteur .wrapp-graphiculteur{ padding-top: 80px }

.sec-sur-mesure.graphi-culteur .blcTitre{ color: #ffffffff;max-width: 645px;position: relative }

.sec-sur-mesure.graphi-culteur .blcText{ color: #ffffff; }





.sec-sur-mesure.graphi-culteur .blcRs .fb { background: url(../images/icon-fb-white.svg)center no-repeat;}

.sec-sur-mesure.graphi-culteur .blcRs .linkedin{ background: url(../images/icon-linkedin-white.svg)center no-repeat; }

.sec-sur-mesure.graphi-culteur .tel{ background: url(../images/icon-tel-white.svg)left center no-repeat; color: #ffffff;margin-top: 15px;cursor: pointer}

.graphi-culteur.sec-sur-mesure{ position: relative }

.graphi-culteur.sec-sur-mesure .blcText{ max-width: 603px; }

.sec-sur-mesure.graphi-culteur .titre .bottom{ padding-left: 122px }

.deco-graphi-culteur{ position: absolute;bottom: 34px;width: 100%;right: -32px; text-align: center}

.deco-arrosoir{     position: absolute;

  width: 41%;

  right: 9%;

  bottom: 107px;}

.deco-arrosoir img,

.deco-fleur img,

.deco-pelle img{ width: 100%;display: block; }

.deco-fleur{ position: absolute;width: 12%; left:16.33%;bottom: 80px }

.deco-pelle{ position: absolute;width: 22%; left:28%;bottom:100px }



.graphi-culteur.sec-sur-mesure .wrapper{ position: relative;z-index: 50;height: 100%; }

.graphi-culteur.sec-sur-mesure{ overflow: hidden }

.graphi-culteur.sec-sur-mesure .contact{ bottom: 9px;background: url(../images/icon-msg-white.png)center 4px no-repeat;color: #ffffff; }

.graphi-culteur.sec-sur-mesure .s-titre{     font: normal 32px/34px d-din-cd-b, Arial;

  position: absolute;

  top: 10px;

  right: 0;}

.graphi-culteur.sec-sur-mesure .titre .point{ color: #000000; }

.graphi-culteur .deco-souris{ position: absolute;top: 0;right: 300px }



.graphi-culteur .deco-souris{ animation: LeftToRight 2s infinite ease-in-out; }

/*@keyframes LeftToRight {

  0% {

    right:300px;

  }

  50% {

   right:306px;

  }

  100% {

    right:300px;

  }

}*/



.graphi-culteur .blcTitre .blcRs .fb::before{ background: url(../images/icon-fb.svg)left center no-repeat }

.graphi-culteur .blcTitre .blcRs .linkedin::before{ background: url(../images/icon-linkedin.svg)left center no-repeat }



/* SECTION 4 */



.sec-about{ padding: 0 0 0;background: url(../images/bg-apropos.jpg)center no-repeat; background-size: cover;background-attachment: fixed}

.sec-about .left{ width:60%;padding-right: 47px ;}

.sec-about .left .text{ padding: 20px 0 0 209px;background: url(../images/caricature.png)38px 10px no-repeat; font: normal 15px/18px roboto-i, Arial;min-height: 217px; }

.sec-about h3{  font: normal 30px/34px d-din-cd-b, Arial;margin-bottom: 13px}

.sec-about .auteur{text-align: right}

.sec-about .signature{ text-align: right }

.sec-about .right{ width: 40% }

.sec-about .right .text{ font: normal 18px/24px roboto-i, Arial; }

.sec-about .right .text p{ margin-bottom: 18px }



#fp-nav ul li a span, .fp-slidesNav ul li a span{ height: 9px;width: 9px;margin: 0;top: 0;left: 0 }

#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span{ width: 9px;height: 9px;margin: 0; }

#fp-nav ul li, .fp-slidesNav ul li{width: 9px;height: 9px;}

#fp-nav ul li a.active span{ background: #70ab9a; }

#fp-nav.right{ right: 1% }

#fp-nav.hide{ display: none }



.sec-about  .contact{position: absolute;bottom: 0;left: 100px}

.sec-about .wrapper{ position: relative; }

.sec-about .blcTop + .wrapper{padding-top: 80px; } 





#fp-nav.white ul li a span{ background: #ffffff; }

#fp-nav.white ul li a.active span{background: #000;}

#fp-nav.white.foot  ul li a.active span{ background: #70ab9a; }







/* DETAIL SERVICES */

.detail-services{ background: url(../images/bg-detail-srvc.jpg)right center no-repeat;background-size: cover;position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 0; opacity: 0;display: flex;align-items: center;}

.detail-services.active{ z-index: 9999;opacity: 1; }

.detail-services>.wrapper{ height: auto!important; }

.slide-services .item{ display: flex !important;flex-wrap: wrap;position: relative }

.slide-services .item .col-left{ width: 46.2% }

.slide-services .item .col-left img{  

      display: block;

    max-height: 500px;

    margin: 0 auto;

    position: relative;

    top: 0;

}

.slide-services .item .col-right{ width: 53.8%;padding-left:26px  }

.slide-services .item .col-right h2{ font: normal 50px/50px d-din-cd-b, Arial;text-transform: uppercase;margin-bottom: 17px; /*position: relative; top: 30px;*/}

.slide-services .item p{ margin-bottom: 17px }

.blcPartenaires{ margin-top: 55px }

.blcPartenaires .title{ font: normal 22px/24px nexa-l, Arial;text-transform: uppercase;text-align: center;color: #020202;margin-bottom: 17px  }

.list-partenaire{ padding: 13px 0 5px;position:relative }

.list-partenaire:before{ content: '';width: 100%;height: 2px;background:url(../images/dotted.png)center;background-repeat: repeat-x;position: absolute;left: 0;top: 0 }

.list-partenaire:after{ content: '';width: 100%;height: 2px;background:url(../images/dotted.png)center;background-repeat: repeat-x;position: absolute;left: 0;bottom: 0 }

.list-partenaire{ display: flex;justify-content: space-between; }

.list-partenaire .item{ display: block;padding: 0 10px; }

.list-partenaire .item img{width: 100%;height: 95px;object-fit: contain}

.slide-services .item .col-right .text{ padding-bottom: 104px }

.blcNav-service{ width: 53.8%;position: absolute;right: 0;bottom: 0;padding-left: 18px }

.blcNav-service .item{ width: 96px;padding: 0 8px;cursor: pointer }



.blcNav-service .item.slick-current .content-item:before{ opacity: 0.4 }

.blcNav-service .item img{ width: 100%;display: block }

.blcNav-service .title{ font: normal 20px/24px d-din-cd-b, Arial;text-transform: uppercase; }

.blcNav-service .content-item{  position: relative}

.blcNav-service .title{ position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center }

.blcNav-service .content-item:before{ content: '';width: 100%;height: 100%;top: 0;left: 0;background: #000;opacity: 0 ;position: absolute}

.blcNav-service .inner-item{ overflow: hidden; }

.inner-service{ position: relative;     padding-top: 80px; }



.close_service{ width: 40px;height: 40px;background: url(../images/icon-close.png)center no-repeat;display: block;position: absolute;right: 0;top: 10%;cursor: pointer;z-index: 50 }



.blcNav-service .nav-service .slick-track .item:nth-child(1) .title{ animation: black-to-white1 8s infinite ease-in-out }

.blcNav-service .nav-service .slick-track .item:nth-child(2) .title{ animation: black-to-white2 8s infinite ease-in-out }

.blcNav-service .nav-service .slick-track .item:nth-child(3) .title{ animation: black-to-white3 8s infinite ease-in-out }

.blcNav-service .nav-service .slick-track .item:nth-child(4) .title{ animation: black-to-white4 8s infinite ease-in-out }



.blcNav-service .nav-service .slick-track .item:nth-child(1) .img{ animation: zoomin1 8s infinite ease-in-out }

.blcNav-service .nav-service .slick-track .item:nth-child(2) .img{ animation: zoomin2 8s infinite ease-in-out }

.blcNav-service .nav-service .slick-track .item:nth-child(3) .img{ animation: zoomin3 8s infinite ease-in-out }

.blcNav-service .nav-service .slick-track .item:nth-child(4) .img{ animation: zoomin4 8s infinite ease-in-out }



.blcNav-service .nav-service .item.slick-current .img{ transform: scale(1.2)!important; }

.blcNav-service .nav-service .item.slick-current .title{ color: #000!important;  background: rgb(0 0 0 / 50%);}





/* PAGE FICHE REALISATION */

.fiche-real .slider .item{background: none;padding: 55px 0 0}

.fiche-real .slider .item .wrapper{height: 100%;background-size: cover}

.fiche-real .slider .item .wrapper img{ width: 100% }

.fiche-real .header .scrollBottom{ opacity: 1;background-color: rgba(0,0,0,0.03);border-color: #000;background-image: url(../images/scrollBottom-gris.png) }

.fiche-real .header .scrollBottom:before{ /* content: '';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #000;opacity: 0.5 */ }

.fiche-real #slider {background: #e7e8e2;}

.fiche-real .blcIntro .col.left{width: 67.7%;border-right: 3px solid #000;}

.fiche-real .blcIntro .col.right{width: 32.3%;padding-left: 21px;}

.fiche-real .blcIntro .titre-real{  font: normal 35px/50px nexa-l, Arial;text-transform: uppercase;color: #70ab9a  }

.fiche-real .blcIntro .titre-real ul{display: flex;flex-wrap: wrap}

.fiche-real .blcIntro .titre-real li:after{ content: 'I';display: inline-block;color: #000;margin: 0 16px; }

.fiche-real .blcIntro .titre-real li:last-child:after{ display: none }

.fiche-real .customer-name{ font: normal 50px/53px d-din-cd-b, Arial;text-transform: uppercase; }

.fiche-real .customer-activity{ font: normal 35px/40px d-din-cd, Arial;text-transform: uppercase;  }

.fiche-real .top-img img,

.fiche-real .bottom-img img{ width: 100%;display: block }

.fiche-real .top-img{ margin-top: 40px }

.fiche-real .bottom-img { margin-top: 34px }

.fiche-real .slideReal-fiche{ padding-top: 60px;padding-bottom: 27px; }

.fiche-real .content-fiche{ padding-top: 60px;padding-bottom: 27px; }



.slick-dots                                                 { width:100%; height:9px; position:relative; text-align:center; padding:0; line-height:0; z-index:50;margin-top:50px;}

.slick-dots li                                              { display:inline-block; height:9px; margin:0 3.5px 15px;text-indent:-9999px;cursor: pointer}

.slick-dots button                                          { display:block; width:9px; height:9px; text-indent:-9999px; background:#000000; outline:none; padding:0; border:none;border-radius: 50%;cursor: pointer}

.slick-active button                                        { background:#70ab9a;} 



.btn-real{ color: #000000;font: normal 14px/24px roboto-r, Arial;text-transform: uppercase;display:inline-block;position: relative ;padding: 2px 0 }

.btn-real:before{content: '';width: 100%;height: 2px;position: absolute;top: 0;left: 0;background: #000;}

.btn-real:after{content: '';width: 100%;height: 2px;position: absolute;bottom: 0;right: 0;background: #000;}

.fiche-real .blcBtn{ text-align: center }

.fiche-real .blcPartenaires{ padding-bottom: 56px; }



.fiche-real #fp-nav{display: none}

.list-services .content-item{ background: #000; }

.single-realisation .footer.section .blcTop{ display: none }







/* FOOTER */

.footer .top{ padding: 40px 0 40px;text-align: center;text-align: center;background: url(../images/bg-top-footer.jpg)center no-repeat; background-size: cover;color: #ffffff;min-height: calc(100vh - 303px);display: flex;align-items: center }

.footer .top h2{  font: normal 36px/42px nexa-b, Arial; text-transform: uppercase;margin-bottom: 17px}

.footer .top p{font:normal 32px/40px d-din-cd, Arial;}

.footer .top  .icon-mail{ display: block; text-align: center;margin-top: 12px}

.footer .middle{ background: #000000; color: #ffffff;padding: 40px 0 36px;}

.footer .col{ width: 26% ;padding: 0 25px;position: relative}

.footer .col:after{ content: '';width: 1px; height: 109px;position: absolute;right: 0;top: 50%;background: #ffffff;margin-top: -55px }

.footer .col.col4{ width: 22% }

.footer .col.col4:after{ display: none }

.footer .middle .slog-foot p{ font: normal 17px/24px roboto-i, Arial; }

.footer .col1{ padding: 0 10px; }

.footer .title{  font: normal 20px/24px d-din-cd-b, Arial;text-transform: uppercase}

.footer .middle p{ font: normal 13px/16px roboto-r, Arial; }

.footer .col3 .tel,

.footer .col3 .mail{ font: normal 14px/16px roboto-r, Arial;display: block  }

.footer .le-grand{ display: block }

.footer .bottom{ background: #70ab9a; }

.menu-bottom{ font: normal 11px/16px avantgarde-medium, Arial;display: block;padding: 15px 0;color: #ffffff;padding-right: 68px;position: relative  }

.footer .rs{ position: absolute;right: 40px;display: flex;top: 12px }

.footer .rs a{ width: 22px;height: 22px;display: block;margin-left: 6px;position: relative }

.footer .rs a:before{content: '';width: 22px;height: 22px;position: absolute;top: 0;left: 0;background-size: 22px;border-radius: 50%;opacity: 0}

.footer .rs .fb{ background: url(../images/icon-fb-white.svg)center no-repeat; }

.footer .rs .fb:before{ background: url(../images/icon-fb.svg)center no-repeat;  }

.footer .rs .linkedin{ background: url(../images/icon-linkedin-white.svg)center no-repeat; }

.footer .rs .linkedin:before{ background: url(../images/icon-linkedin.svg)center no-repeat; }

.footer .wrapper{ position: relative }

body,html{

    overflow: hidden !important;

}



.logo-foot img{ width: 220px }





.nav-service .item:hover .content-item:before{ opacity: 0.4 }





/* ANJARA */

.sec-about .scrollBottom {

  background: url(../images/scrollBottom-gris.png)center no-repeat;

  border-color: #333;

  display: block;

}





.sec-about  .blcBottom .text{ width: 47.5% }

.sec-about  .blcBottom .blcBlcImg{ width: 52.5%;display: flex }

.sec-about  .blcBottom .image-left{ position: relative;padding-left: 50px }

.sec-about  .blcBottom .image-left .img1{ position: relative }

.sec-about  .blcBottom .image-left .inscription-gratuit{ position: absolute;left: 0;top:50%;margin-top: -50px; z-index: 2; }

.sec-about  .blcBottom .image-right{ padding-left: 50px }

.sec-about .blcBottom  .text {font: normal 15px/18px roboto-i, Arial;padding: 0 30px 20px 63px;}

.sec-about  .blcBottom:before{ content: '';width: 100%;height: 2px;background: url(../images/dotted.png)center;background-repeat: repeat;background-repeat: repeat-x;position: absolute;left: 0;top: 0; }

.sec-about .blcBottom { margin-top: 15px;padding: 10px 0 0}

 .text-img{ font: normal 18px/22px d-din-cd-b, Arial;text-transform: uppercase }

 .text-img li{list-style: none;}



 .sec-about  .blcBottom:before{ content: '';width: 100%;height: 2px;background: url(../images/dotted.png)center;background-repeat: repeat;background-repeat: repeat-x;position: absolute;left: 0;top: 0; } 

 .sec-about .scrollBottom{ background: url(../images/scrollBottom-gris.png)center no-repeat;border-color: #333;display: block; position: relative; top:initial;bottom: 20px;}

 .graphi-culteur.sec-sur-mesure .blcContact .deco{ background: url(../images/deco-formulaire2.png)center no-repeat;}

.sec-about .blcContact .deco{ background: url(../images/deco-formulaire3.png)center no-repeat;}

.coordonnees .blcContact .deco{ background: url(../images/deco-formulaire4.png)center no-repeat;}

.blcContact .deco{ position: absolute;top: 0;left: 40px;width: 87px;height: 43px; background: url(../images/deco-formulaire1.png)center no-repeat;}

.blcContact .close{width: 20px;height: 20px;background: url(../images/icon-close2.png)center no-repeat;display: block;position: absolute; 

  background-size: contain;     right: 120px;

  top: 90px; cursor: pointer;z-index: 50;}

.blcContact.foot.active{ opacity: 1;transition: all ease-in-out 0.5s}

.blcContact.active{ opacity: 1;transition: all ease-in-out 0.5s;z-index: 99999999 }





.blcNav-service .item:hover .content-item:before{ opacity: 0.4 }

.footer .top,

.footer .middle,

.footer .bottom,

.footer .top1,

.footer .middle1,

.footer .bottom1{transition: all ease-in-out 0.4s;z-index: 40;position: relative}

.footer .top.up,

.footer .top.up1{ transform: translate3d(0,calc(-100vh + 303px), 0); transition: all ease-in-out 0.4s}

.footer .middle.down,

.footer .bottom.down,

.footer .middle.down1,

.footer .bottom.down1{ transform: translate3d(0,303px, 0);transition: all ease-in-out 0.4s }

.sec-service .titre .point{ position: relative;  right: 0;}

.secHearReal .scrollBottom{    position: absolute;top: 89vh;left: 0;right: 0}



/*.secHearReal .blcTop.dark {

    padding-top: 27px;

}*/

.sec-service .intro .wrapper{

  padding-top: 80px;

}







@media (min-width:1201px) {

  body a span, body a,.listReal .item .hide,.list-services .item .titre-srvc,.blcTitre .blcRs a:before,.slick-next,.slick-prev,

  #fp-nav ul li a span, .fp-slidesNav ul li a span,.footer .rs a:before,.blcMenu .rs a:before,.nav-service .item .content-item:before,.btn-real:after,.btn-real:before,

  .list-services .item .img{ -webkit-transition:all 400ms ease-in-out; -moz-transition:all 400ms ease-in-out; -ms-transition:all 400ms ease-in-out; transition:all 400ms ease-in-out;}

  a:hover { color:#70ab9a; }

  .listReal .item:hover .hide{ top: 0 } 

  .list-services .item:hover img{  transform: scale(1) rotate(0deg)!important;transition: transform .5s ease-in-out!important;}

  .list-services .item:hover .titre-srvc{color: #ffffff!important}

  .list-services .item:hover .titre-srvc{ transform: scale(1)!important }

  .blcTitre .blcRs a:hover:before{ opacity: 1 }

  .blcProjet .tel:hover{ color: #ffffff }

  .sec-sur-mesure .tel:hover{ color: #70ab9a }

  .sec-realisation .btn:hover{ background: #000;color: #ffffff }

  .sec-sur-mesure.graphi-culteur .tel:hover{ color: #000 }

  .footer .bottom a:hover{ color: #000 }

  .contact:hover,

  .graphi-culteur.sec-sur-mesure .contact:hover{ background-position-y: 0; }

  .slick-next:hover{ margin-right: -5px; }

  .slick-prev:hover{ margin-left: -5px; }

  #fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span{ margin: 0;width: 9px;height: 9px; }

  #fp-nav ul li a:hover span{ background: #70ab9a; }

  .footer .rs a:hover{ opacity: 0.8 }

  .footer .top a:hover{color:#70ab9a }

  #fp-nav.white ul li a span:hover{ background: #000; }

  #fp-nav.white.foot  ul li a span:hover{ background: #70ab9a; }



  .blcMenu .menu a:hover{ color:#70ab9a  }

  .blcMenu .rs a:hover:before{ opacity: 1 }

  .btn-real:hover:before{ left: -20px;background: #70ab9a }

  .btn-real:hover:after{ right: -20px;background: #70ab9a }

  .list-partenaire .item:hover{ opacity: 0.5 }

  .list-services .item:hover .img{ opacity: 0.5 }

    .macom-sure-mesure .inner-sec-sur-mesure .s-titre {

        font: normal 32px/34px d-din-cd-b, Arial;

        position: absolute;

        top: 20px;

        right: 0;

        left: 43%;

        width: 60vw;

    }

}









/* RESPONSIVE */

@media (max-width:1367px) and (max-height: 680px) {

    .intro{ padding-top: 60px }

    .list-services{ padding-bottom: 40px }

    .sec-sur-mesure .blcTitre { margin-top: 80px }

    .sec-about .row{ padding-top: 60px }



    .detail-services{ padding-top: 80px }



    .blcContact .content-contact{ padding-top: 40px }

    .blcContact h2{ margin-bottom: 50px }

}







@media (max-width:1200px) {

    .titre {font: normal 100px/80px d-din-cd-b, Arial;}

    /* .blcBanner .deco{ display: none } */

    .slider .item{ justify-content: center;padding-bottom: 0 }

    .arrow-slider{ display: none }



}



@media (max-width:980px) {

    .blcTitre{ padding-left: 50px }

    .list-services .titre-srvc{ font-size: 38px }

    .footer .col,

    .footer .col.col4{width: 50%}

    .footer .col2:after{ display: none}

    .footer .col1,

    .footer .col3{ padding-left: 0 }

    .menu-bottom{ text-align: center;padding: 25px 0 10px; }

    .footer .rs{ position: static;justify-content: center;padding: 0 0 25px; }

    .graphi-culteur,

    .graphi-culteur .fp-tableCell,

    .sec-sur-mesure,

    .sec-sur-mesure .fp-tableCell{ height: auto!important; }

    .textBanner h1 { font: normal 35px/50px nexa-b; }

    .textBanner h2{ font: normal 25px/30px avantgarde-medium; }

    .blcMenu{width: 50%}

    .blcNav-service{ position: static;margin: auto; }

    .nav-service{ position: static;margin: auto; }

    .slide-services .item .col-right .text{padding-bottom: 50px;}

    .blcNav-service{width: 100%}

    .sec-service .titre .point{right: 0}





}

@media (max-width:700px) and (max-height: 500px) {

.footer .top h2 { margin-top: 26px;font: normal 25px/41px nexa-b, Arial; }
.textBanner h1 {font: normal 24px/41px nexa-b;}
.blcBanner .item3 .deco{ width: 33% }

}



@media (max-width:980px) and (max-height: 500px) {

  body.overflow-mob{overflow: hidden!important}

  .blcMenu{ height: 100vh;overflow: scroll ;display: block}

  .blcMenu .content-menu{ padding: 30px 0 50px;}

  .blcMenu .rs{ position: static;margin-top: 25px }

  .blcMenu .rs a:first-child{ margin-left: 0 }

  .blcMenu .title-menu{ padding-left: 70px;    font: normal 30px/40px nexa-b, Arial;margin-bottom: 30px; }

  .blcTop .btn-menu{right: 40px}

  .slogan {letter-spacing: 1px;}

  .blcTop .wrapper{ flex-direction: row!important;align-items: center!important }

  .titre .top{ padding-right: 13px; }

.sec-service  .titre .top,

.sec-realisation .titre .top{ padding-right: 0 }



}



@media (max-width:768px) and (max-height: 1025px) {

    .sec-realisation .scrollBottom{ bottom: 0 }

    .deco-fleur,.deco-pelle{display: none}

    .deco-arrosoir{ display: block }

    .titre .top{ padding-right: 13px; }

.sec-service  .titre .top,

.sec-realisation .titre .top{ padding-right: 0 }





}



@media (max-width:768px) {

    .titre {font: normal 90px/80px d-din-cd-b, Arial;}

    .blcTop .btn-menu{right: 40px}

    .intro,

    .sec-sur-mesure,

    .graphi-culteur.sec-sur-mesure,

    .sec-about{ padding-top: 40px }

    .intro .col.left,

    .intro .col.right,

    .sec-realisation .intro .col.left,

    .sec-realisation .intro .col.right,

    .sec-about .left,

    .sec-about .right{ width: 100% }

    .sec-service > .top{ padding-bottom: 35px }

    .intro .col.right{ border-left: none;padding-left: 0 }

    .titre > span{ display: inline-block }

    .titre .bottom,

    .sec-realisation .titre .bottom{ padding-left: 0 }



    .blcTitre .blcRs{ top: 13px }

    .list-services .item{ padding: 15px;width: 50% }

    .list-services{ padding: 0 25px; }

    .sec-sur-mesure .blcText{ padding-bottom: 220px;padding-left: 50px }

    .sec-sur-mesure .contact{ bottom: 5px }

    .deco-graphi-culteur,

    .graphi-culteur .deco-souris{ display: none }

    .sec-sur-mesure.graphi-culteur .titre .bottom{ padding-left: 0 }

    .graphi-culteur.sec-sur-mesure .s-titre{ position: static }

    .graphi-culteur.sec-sur-mesure .blcText{ padding-bottom: 180px;padding-left: 50px }

    .blcProjet{ padding: 50px 0; }

    .footer .top{ padding: 50px 0; }

    .sec-realisation{ padding-bottom: 80px }

    .sec-realisation .scrollBottom{ bottom: 40px }

    .graphi-culteur.sec-sur-mesure .contact{ bottom: 50px }

    .sec-about{ padding-bottom: 32px }

    .footer .middle{padding: 50px 0;}

   /*  .section{height: auto!important} */

    /* .section .fp-tableCell{ height: auto!important; }

    .sec-service .fp-tableCell > .top, .sec-service .fp-scroller > .top,

    .sec-service .blcProjet{ height: auto;min-height: initial } */

  /*   .fp-scrollable{ height: auto!important; } */

    .sec-realisation .intro{ padding-top: 80px }

    .fp-scrollable,

    .fp-scroller{ overflow: visible; }

    .sec-service .fp-tableCell > .top, .sec-service .fp-scroller > .top,

    .sec-service > .top{ padding-bottom: 35px }

    .blcTop.dark{ display: none }

    .graphi-culteur .blcTop{ display: none }

    body, html{ overflow: visible!important }

       .intro{ padding-top: 80px }

    .list-services{ padding-bottom: 0 }

    .sec-sur-mesure .blcTitre { margin-top: 0 }

    .graphi-culteur.sec-sur-mesure .blcTitre { margin-top: 60px }

    .sec-about .row{ padding-top: 0;padding-bottom: 85px; }

    .sec-realisation .btn{ margin-top: 40px }



    .detail-services{ position: static;opacity: 1 }

    .sec-sur-mesure.macom-sure-mesure{padding-top: 0}

    .slide-services .item .col-left{ width: 100% }

    .slide-services .item .col-left img{ height: auto; object-fit: cover;max-height: inherit;width:100%;}

    .detail-services > .wrapper{ padding-bottom: 50px }

    .detail-services{ padding-top: 70px;background: #fff;position: fixed;z-index: 999;top: 0;left: 0;width: 100%;height: 100vh;transform: translateX(-100%);transition: 1s ease;transition-delay: 0s;transition-delay: 0s;transition-delay: .8s; }

    .slide-services .item .col-right{ width: 100%;padding: 40px 0 0; }

    .nav-service{width: 100%;padding-left: 0}



    .close_service{ background-size: 30px;background-color: #ffffff}

    .detail-services.active{ transform: translateX(0);transition: 1s ease; }

    .fiche-real .blcTop.dark{ display: block }

    .fiche-real .blcIntro .col.left,

    .fiche-real .blcIntro .col.right{ width: 100% }

    .fiche-real .blcIntro .col.left{ border: none; }

    .fiche-real .blcIntro .col.right{ padding-left: 0;margin-top: 15px }

    .fiche-real .blcIntro .titre-real {font: normal 28px/35px nexa-l, Arial;}

    .fiche-real .blcIntro .titre-real li::after { margin:  0 10px; }



    .blcContact{ transform: translateX(-100%);transition: 1s ease;transition-delay: 0s;transition-delay: 0s;transition-delay: 0s;transition-delay: .8s;position: fixed;top: 0;left: 0;overflow: scroll;padding: 0;height: 100vh;}

    .blcContact.active{ transform: translateX(0);transition: 1s ease;transition-delay: 0s;transition-delay: 0s;transition-delay: 0s;transition-delay: .8s;}



    .blcContact .row-contact .left,

    .blcContact .row-contact .right{ width: 100% }

    .blcContact .wrapper{ height: auto; }

    .blcContact .deco{ display: none }

    .blcContact .content-contact{ padding:140px 0 50px}

    /* .blcContact .close{ top: 0 } */

    .sec-realisation .btn{ margin-top: 20px }

    .blcContact h2{ padding-right: 50px;font: normal 30px/35px nexa-b, Arial; }

/*     .blcContact.foot{ display: none } */

.footer .top.up,

.footer .middle.down, .footer .bottom.down  {transform: translate3d(0,0,0);}

.blcContact.foot.active{ z-index: 9999999999 }

.blcFormulaire .btn{ margin: 25px 0 0; }



.sec-about .blcBottom .text{ width: 100%;padding: 40px 0 0 20px; }

.sec-about .blcBottom .blcBlcImg{ width: 100% }

.sec-about .blcBottom{ margin-top: 0 }

.sec-about{ padding-bottom: 50px; padding-top: 80px; }



.sec-about .scrollBottom{ padding-bottom: 60px;display: block }



.sec-about .blcTop + .wrapper,

.sec-service .intro .wrapper{ padding-top: 0 }

.inner-sec-sur-mesure{ padding-top: 50px }



.run-out .char{ color: #ffffff }

.textBanner {text-align: center;position: relative;z-index: 99;padding: 0 20px;bottom: inherit;height: 100%;display: flex;flex-direction:column;align-items: center;justify-content: center}

.footer.section{ position: relative } 

.sec-service > .top{ /* background: #ffffff!important */ }

 .footer.section .blcTop { display: none }





   .text1,

   .text2,

   .text3{transform:scale3d(1, 1, 1) translate(0, 0)!important}

   .text3-b.on{ opacity: 1 }

 

   .blcNav-service{ padding-left: 0 }

   .slide-services .item .col-right .text{ padding-bottom: 20px }

   .close_service{ top: 0 }

   .cntSelect select{ width: auto;padding: 0 50px 0 20px ; }

   body .blcContact .close{ top: 77px;right: 40px }

   .cntBtnContact{ width: 100%;justify-content: center; }

   .list-services{ margin-bottom: 0 }

    .slogan {letter-spacing: 1px;}

    .single-realisation .footer.section .blcTop{ display: none!important }

    .graphi-culteur.sec-sur-mesure .blcText{ padding-bottom: 400px }

      .deco-arrosoir{bottom: 130px;width: 280px;left: 0;right: 0;margin:auto;}
          .footer .col.col1{ text-align: center }

          .logo-foot img{ margin: auto; }



  .blcProjet .vid-service, #video-service { object-fit: cover!important;object-position: -150px 0!important; }





  

}



@media (max-width:640px) { 

  .blcTop .wrapper{ flex-direction: column;align-items: flex-start }

  .titre .top{ padding-right: 13px; }

.sec-service  .titre .top,

.sec-realisation .titre .top{ padding-right: 0 }



}







@media (max-width:600px) { 

  body .blcProjet .tel{ margin-top: 25px;}

    .wrapper{ padding: 0 38px; }

.slogan{ padding-left: 0;letter-spacing: 1px }

.logo{width: 200px}

.section .logo,
.section .slogan,
.section .scrollBottom,
.section .contact,
.blcTitre .blcRs{ display: none }
.section.header .logo,
.section.header .slogan,
.header .scrollBottom{ display: block }


.logo img{ width: 100% }

.blcTop .btn-menu{ right: 20px;top: 0 }

.slider .item{ height: auto;min-height: auto; padding:33px 0 30px;background: #000!important;}

.arrow-slider{ padding: 0 20px; }

.titre {font: normal 45px/55px d-din-cd-b, Arial;}

.blcTitre .blcRs{ position: static }

.blcTitre{ padding-left: 0 }

/* .blcTitre .blcRs{ display: flex; } */

.blcTitre .blcRs a{ margin-right: 10px;margin-bottom: 0 }

.list-services{ padding: 0 15px; }

.list-services .img img{ display: block }

.list-services .titre-srvc{ font-size: 40px }

.blcProjet h2 {font: normal 25px/34px nexa-b, Arial; margin-bottom: 19px;}

.blcProjet{ padding: 29px 0; }

.sec-sur-mesure .blcText{ padding-left: 0 }

.sec-sur-mesure .deco-bobine{ display: none }

.sec-sur-mesure .deco-buste{ display: block }

.sec-sur-mesure .blcText{ padding-bottom: 266px }

.sec-sur-mesure .contact{ bottom: 210px;left: 20px }

.listReal .item{ width: 50% }

.sec-realisation .btn{ margin: 25px auto 0; }

.graphi-culteur.sec-sur-mesure .blcText{ padding-left: 0;padding-bottom:290px }

.graphi-culteur.sec-sur-mesure .contact{ bottom: 40px }



.sec-about .left .text{ /* padding:250px 0 0 ; */padding-left: 140px;background-position-x: left;background-position-y:20px ;background-size: 148px;margin-bottom: 15px;text-align: left; }

.sec-about .left{ padding-right: 0; }

.titre .top{ padding-right: 10px; }

.sec-service  .titre .top,

.sec-realisation .titre .top{ padding-right: 0 }

.footer .top{ padding: 80px 0 40px;min-height: initial }

.footer .top h2{ font: normal 25px/35px nexa-b, Arial; }

.footer .top p{ font-size: 18px;line-height: 24px }

.footer .col, .footer .col.col4{ width: 100% }

.footer .col::after { display: none }

.footer .col{ padding: 0 0 15px; }

.footer .middle{ padding: 30px 0 20px;text-align: center }

.menu-bottom{ padding: 30px 0 10px }

.footer .rs{ padding-bottom: 30px; }

.textBanner h2 {font: normal 22px/30px avantgarde-medium;}

.banner-mob{ display: block }

.banner-mob img{ width: 100%;display: block ;height: 350px;object-fit: cover}

.text-copyright{ padding: 0 20px; }

#fp-nav.right{ right: 20px }

.sec-realisation .contact{ margin-left: 0 }

    .blcBanner{ background: #000; }

    .blcBanner .scrollBottom{ position: static;margin:0 auto 40px;display: block }

    .text-copyright{ position: static;margin:15px auto 0; padding-bottom: 40px}

    .textBanner h1{line-height: 45px}

    .sec-sur-mesure .wrapp-sur-mesure{ padding-top: 0 }

    .sec-sur-mesure .scrollBottom,

    .sec-realisation .scrollBottom{ bottom: 55px }
/*     .sec-sur-mesure .scrollBottom{ bottom: 230px } */

    .sec-realisation{ padding-bottom: 30px }

    .graphi-culteur.sec-sur-mesure .wrapper{ padding-top: 0 }

    .sec-about .contact{ left: 20px }

     .blcMenu{width: 100%}

     .blcMenu .rs{ bottom: 40px }

     .slide-services .item .col-right .text{padding-bottom: 25px;}

/* .list-services .slick-slide>div,

.blcNav-service .slick-slide>div{padding: 5px;} */

.list-services .inner-item{display: block!important}

.blcNav-service .inner-item{ position: relative;display: block!important }

.blcNav-service .inner-item img{ width: 100% }

 .list-services .inner-item{display: block}

 .blcNav-service .title{ font-size: 30px; }

 .detail-services{ padding-bottom: 50px; }

 .inner-sec-sur-mesure{ padding-top: 38px;text-align: center }

 .blcNav-service .item,

.list-services .item{width: 50%!important;padding:5px!important;}

.slide-services .item .col-left img{ height: auto;width: 100% }

.blcPartenaires{ margin-top: 45px }

.list-partenaire{ flex-wrap: wrap;align-items: center }

.list-partenaire .item{ width: 33.33% }

.fiche-real .blcBanner .scrollBottom{ position: absolute;left: 0;right: 0;bottom: 40px;margin: auto; }

.fiche-real .slick-dots{ margin-top: 40px }

.blcFormulaire .blcButton{ flex-direction: column;margin: 0;justify-content: center;align-items: center }

.blcContact h2 {padding: 50px 0 0;}



.sec-about .blcBottom .blcBlcImg{display: block}

.sec-about .row{ padding-bottom: 40px }

.fiche-real #slider{ height: auto; }

.fiche-real .slider .item{ height: auto;background: #fff!important;padding-top: 115px }

.secHearReal .slogan{padding-left: 0;letter-spacing: 1px;font-size: 18px }

.secHearReal .blcTop .wrapper{ padding: 0 20px; }

.secHearReal .blcTop .btn-menu{right: 20px}

.fiche-real .slider .item .wrapper{ background-position: center; }

.secHearReal{ position: relative; } 

.secHearReal .scrollBottom{ bottom: 40px;top: inherit }

.cntBtnContact{ flex-direction: column }

.blcFormulaire input[type="submit"]{display: block;margin:25px auto 0;}

.cntBtnContact>.wpcf7-form-control-wrap{ margin: 0 -10px; }

.blcContact .content-contact h2{ padding-top: 0;margin-bottom: 30px }



.sec-about .contact,

.sec-about .scrollBottom{ bottom: inherit;top: 0 }

.list-services .content-item{ background: none; }



.fiche-real .blcListReal .title,

.blcPartenaires{ margin-top: 40px }

.fiche-real .content-fiche{ padding-top: 35px }

.fiche-real .blcPartenaires{ padding-bottom: 45px }

.hidden-mobile{ display: none }



.sec-about .blcBottom{ padding: 10px 20px 0; }

body .sec-about .blcBottom .text{padding-left: 0;}

.sec-about .blcBottom .image-left{ left: 0 }

.sec-about .blcBottom .image-right{ left: 0;padding-left: 0 }

.g-recaptcha>div{ margin: auto; }







.blcBanner .deco{display: none!important}

  .blcBanner .item1 .missile{display: none!important}



  .sec-sur-mesure .deco-buste,

  .deco-arrosoir{bottom: 130px;width: 280px;left: 0;right: 0;margin:auto;}
 .sec-sur-mesure .deco-buste{bottom: 0;}

 .le-grand img{ margin: auto; }

 .image-right img{ margin: auto; }
 .text-img{ text-align: center }

 #list-services.list-services{ padding: 0 33px; }
 .list-services .item{padding:13px!important;}
 .intro{ padding: 13px 40px 16px; }
 .blcProjet .text h6{ line-height: 30px }

 .sec-sur-mesure .s-titre,
 .sec-realisation .s-titre{ font: normal 18px/23px nexa-b, Arial }
 .sec-sur-mesure .tel{ display: inline-block }
 .sec-sur-mesure .deco-buste{ max-width: 351px;width: 100% }

 .sec-realisation .intro{ padding-top: 9px;padding-left: 0;padding-right: 0;text-align: center }
 .listReal{ margin-top: 0 }

 .graphi-culteur.sec-sur-mesure .blcTitre{ margin-top: 0 }
 .graphi-culteur.sec-sur-mesure{ padding-top: 14px;text-align: center }
 .sec-sur-mesure.graphi-culteur .tel{ display: none }
 .deco-arrosoir{ bottom: 20px }

 .sec-about{ padding-top: 17px;text-align: center;padding-bottom: 10px }
 .sec-about .row{ padding-bottom: 5px }
 .sec-about .blcBottom .text{ padding-top: 10px }
 .sec-about .blcBottom::before { left: 0;right: 0;margin: auto; }


}



@media (max-width:600px) and (max-height: 500px) {

  .slogan {letter-spacing: 1px;padding-left: 20px}

  .blcTop .wrapper{ flex-direction: row!important;align-items: center!important }

  .blcTop .btn-menu{ top: 3px }



}


@media (max-width:375px) { 
 .wrapper{ padding: 0 20px; }
 .intro{ padding-left: 20px;padding-right: 20px}
  .list-services .item{padding:5px!important;}
  #list-services.list-services{ padding:0 20px; }
  .list-services .titre-srvc {font-size: 30px;}
}













.fiche-real .blcListReal .title{

  display: none;

}







/* .slide-services .item h2 + p{display: none;} */

.fp-viewing-coordonnees #fp-nav ul li a span{

  background: #fff;



}

.fp-viewing-coordonnees #fp-nav ul li a.active span,

.fp-viewing-coordonnees #fp-nav ul li a:hover span{

  background: #70ab9a;



}

@media (max-width:768px) {

  .home section.section{position: relative;}

}