body 
	{
		margin: 0;
		font-family: Arial, sans-serif;
		color: rgb(19, 21, 21);
		overflow-x: hidden;
	}
	
	
	
	.contentCenter{ width: 1280px; margin: 0 auto; }
  
  h1, h2, h3, h4, p{ margin: 0px !important; }
  
  
	.main .block1 
	{        
		height: 130vh;
		position: relative;
		background: url(images/bg-page.webp) top center no-repeat;
		background-size: auto 130vh;
		position: relative !important;
	}

	.main .block1 #nuagecover{ position: absolute; bottom: 0px; width: 120%; height: 400px; overflow: visible; left: -10%; }
	
	.main .block1 #nuagecover img.nuage 
	{
		width: 100%;
		height: auto;
		filter: blur(25px);
		position: absolute;
		z-index: 9999;
		left: 0px;
		top: 0px;
	}
	
	
	.main .block1 #nuagecover img.phone{ max-width: 100%; margin-top: -80px; border-radius: 50px; }


	.main .block1::before{ content:""; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: block; background: rgba(0,0,0,0.3); }
  
  
  #pageheading{ width: 980px; position: absolute; height: 76vh; left: 50%; margin-left: -490px; top: 50%; margin-top: -38vh; }
  
  #pageheading h1{ color: #fff; text-align: center; font-size: 80px; font-weight: 600; line-height: 78px; }
  
  #pageheading a.button{ display: inline-block; margin: 10px 5px 10px; text-decoration: none; font-size: 17px; padding: 10px 40px !important; }
  
  .inline{ display: inline-block !important; }
  
  .col-2{ width: 50%; margin: 0px; min-width: 50%; min-height: 1px; float: left; }
  
  .col-3{ width: 33%; margin: 0px; min-width: 33%; min-height: 1px; float: left;  }
  
  .col-4{ width: 25%; margin: 0px; min-width: 25%; min-height: 1px; float: left;  }
 
  
  .block8 .col-2 .innercontainer .col-2:nth-child(2){ text-align: right; font-size: 36px; font-weight: 700; float: right !important; }
  .block8 .col-2 .innercontainer .col-2:nth-child(1){ line-height: 16px !important; }
  
  
  .block8 .bgdark.opac50{ padding-bottom: 50px !important; }
  
  .divider5{ width: 100%; clear: both; float: left; width: 100%; height: 5px; }
  .divider10{ width: 100%; clear: both; float: left; width: 100%; height: 10px; }
  .divider20{ width: 100%; clear: both; float: left; width: 100%; height: 20px; }
  .divider30{ width: 100%; clear: both; float: left; width: 100%; height: 30px; }
  
  .innercontainer
  { 
		text-align: center; 
		max-width: 100%; 
		height: auto; 
		padding: 0;
		margin: 0 auto; 
		float: left;
		width: 80% !important;
		padding: 20px 10%;
	}
	
	#sitemenu img.logo
	{
		width: 215px;
		margin-top: -20px;
	}
	
	.main .block1 
	{        
        height: 140vh;
		position: relative;
		background: url(images/bg-page.webp) top center no-repeat;
		background-size: auto 130vh;
    }
	
	.main .block1 #nuagecover{ position: absolute; bottom: 0px; width: 120%; height: 400px; overflow: visible; left: -10%; }
	.main .block1 #nuagecover img.nuage{ width: 100%; height: auto; filter: blur(25px); }
	
	.menutop{ padding: 10px; background: #efefef; border-radius: 20px; margin: 0 auto; max-width: 100%; display: inline-block; }
  
	.menutop a
	{ 
		color: #000; font-size: 17px; text-decoration: none; display: inline-block;
		padding: 10px 15px; border-radius: 15px; 
		margin: 0 2px;
	}
	
	.menutop a img{ vertical-align: center; }
	
	.menutop a.active, .menutop a:hover{ background: rgba(0,0,0,0.1); }
  
  .main .box {
        position: static;
        width: 100%;
    }
    
    .main .block2 {
        background: green;
        height: 600px;
    }
    .main .block3 {
        background: yellow;
        height: 900px;
    }
    .main .block4 {
        background: orange;
        height: 1000px;
    }
	
	
	
	
	.block5 #wrapper{ margin-top: 300px !important; }
	
	
	.wrapper, .wrapper2, .wrapper3
	{
	  width:1280px;
	  margin: 0 auto;
	  overflow:hidden;
	  border: none;
	  cursor:grab;
	  user-select:none;
	}
	
	
	.wrapper3{ width: 100%; }
	
	
	.wrapper4 
	{
		overflow: hidden;
		width: 118%;
		margin-left: -9% !important;
	}
	
	
	.block5{ padding-bottom: 200px; z-index: 9999; position: relative !important; }
	
	#blocanimphone{ position: absolute; width: 300px; height: 500px; bottom: 600px !important; left: 50%; margin-left: -150px; z-index: 3 !important; }
	#blocanimphone img{ max-width: 100%; }
	
	
	.block6 .contentCenter .mentionstitre
	{ 
		font-size: 18px; position: absolute; right: 0px; top: 40px; 
		width: 490px; line-height: 24px;
	}

	.wrapper.dragging, 
	.wrapper2.dragging,  
	.wrapper3.dragging, 
	.wrapper4.dragging
	{
	  cursor:grabbing;
	}

	.track, 
	.track2, 
	.track3,  
	.track4
	{
	  display:flex;
	  gap:20px;
	  width:max-content;
	  padding:20px;
	  pointer-events: none !important;
	  will-change:transform;
	}
	
	.track3{ gap: 30px;  }

	.track .item, 
	.track2 .item, 
	.track3 .item
	{
	  background:#fff;
	  padding:0 0;
	  border-radius:12px;
	  white-space:nowrap;
	  font-size:24px;
	  width: 140px;
	  height: 140px;
	  overflow:hidden;
	  box-shadow: 5px 5px 10px rgba(0,0,0,0.1);
	}
	
	.track4 .item
	{ 
		width: 250px; background: #fff; box-shadow: 0 0 15px rgba(0,0,0,0.15); padding: 6px; border-radius: 30px; 
		font-size: 16px !important; font-weight: 600; color: #000;
	}
	
	
	.track4 .item img
	{ 
		width: 40px; height: 40px; object-fit:cover; vertical-align: middle; border-radius: 100%;
		margin-right: 10px;
	}
	
	
	.track3 .item{ width: 400px; height: 500px; border-radius: 25px; }
	
	
	.track .item img, .track2 .item img{ width:140px; height: 140px; object-fit: cover; }
	.track3 .item img{ width:400px; height: 500px; object-fit: cover; }
	
	.track .item img.miniicone, 
	.track2 .item img.miniicone
	{ width: 70px !important; height: auto !important; display: block; margin: 0 auto; }
	
	.track .item.smallcontent,
	.track2 .item.smallcontent
	{ font-size: 16px; text-wrap: auto; padding-left: 15px; padding-right: 15px; width: 110px; line-height: 20px; }
	
	.item .contentinfos .nom{ font-size: 18px !important; font-weight: 600; }
	.item .contentinfos .nom span{ font-size: 16px !important; font-weight: 500; }
	.item .contentinfos .desc{ font-size: 18px !important; font-weight: 600 !important; }
	
	#animusers {
		width: 140px;
		overflow: hidden;
		padding: 0 53px 0 0;
		display: inline-block;
	}
	
	#animusers .contentusers{ width: 280px; margin-left: -110px; }
	
	#animusers{ position: relative; }
	
	#animusers::after {
		position: absolute;
		display: block;
		content: "";
		top: -6px;
		left: 0px;
		width: 195px;
		height: 65px;
		z-index: 3;
		background: url(images/masque.png) top left no-repeat;
		background-size: 100% auto;
	}
	
	
	#animusers .compteuruser 
	{
		position: absolute;
		width: 45px;
		height: 45px;
		border-radius: 70px;
		top: 11px;
		right: -4px;
		color: #fff;
		z-index: 5;
		font-size: 16px;
		font-weight: 600;
	}
	
	
	@keyframes scrollUser 
	{
	  0%  {  margin-left: -110px;}
	  22% { margin-left: -110px; }
	  25% { margin-left: -75px; }
	  48% { margin-left: -75px;  }
	  50% { margin-left: -30px;  }
	  72% { margin-left: -30px;  }
	  75% { margin-left: 20px;  }
	  99% { margin-left: 20px;  }
	  100%{  margin-left: -110px; }
	}

	#animusers .contentusers
	{
	  animation-name: scrollUser;
	  animation-duration: 5s;
	  animation-iteration-count: infinite;
	}
	
	#animusers img {
		width: 45px;
		display: inline-block;
		margin-right: -10px;
		border-radius: 50px;
		border: solid 2px #202020;
	}
	
	.block12 .contentCenter{ position: relative; }
	
	.block12 .contentCenter::before {
		position: absolute;
		content: "";
		display: block;
		width: 315px;
		height: 760px;
		background: #fff;
		bottom: 0;
		left: -205px;
		background: #fff;
		z-index: 10;
		filter: blur(20px);
	}
	
	
	
	.block12 .contentCenter::after {
		position: absolute;
		content: "";
		display: block;
		width: 315px;
		height: 760px;
		background: #fff;
		bottom: 0;
		right: -215px;
		background: #fff;
		z-index: 10;
		filter: blur(20px);
	}
	
	
	.highlightcontent
	{ 
		padding: 2px 15px; display: inline-block; 
		width: auto; font-size: 15px; border-radius: 20px; 
		border: solid 1px #eaeaea;
	}
	
	.highlightcontent.dark{ background: #eaeaea; }
	
	.highlightcontent.light{ background: #fff; }
	
	.highlightcontent span 
	{
		color: #fff !important;
		background: #000;
		padding: 0px 9px !important;
		display: inline-block;
		line-height: 21px;
		border-radius: 10px;
		margin: 0 5px 0 -5px !important;
	}
	
	
	#pageheading a.button.left{ background: #fff; color: #000; }
	
	#pageheading a.button.right{ background: rgba(255,255,255,0.1); border: solid 1px rgba(255,255,255,0.7); }
	
	#pageheading a.button.right	img{ vertical-align: center; margin-right: 8px; }

	
		.block12 .slick-prev 
		{
			left: 50% !important;
			top: 100% !important;
			margin-left: -140px;
			margin-top: 50px;
		}
		
		.block12 .slick-next 
		{
			right: 50% !important;
			top: 100% !important;
			margin-right: -100px;
			margin-top: 50px;
		}
		
		
		.block12  .slick-prev, .block12  .slick-next {
			background: #dedede !important;
			padding: 25px !important;
			height: 70px !important;
			border-radius: 70px !important;
			width: 70px !important;
			color: #000 !important;
		}
		
		.block12  .slick-prev::before, .block12  .slick-next::before{ color: #000 !important; }
	
	.slick-slide video
	{  

		transform: scale(0.9);
		-moz-transform: scale(0.9);
		-ms-transform: scale(0.9);
		-o-transform: scale(0.9);
		-webkit-transform: scale(0.9);
		color: #e67e22;
		opacity: 0.9;
		transform: scale(0.9);
		
		border-radius: 20px;
		
		pointer-events: none !important;
		
		 filter: blur(5px);
        -webkit-filter: blur(5px);
        -moz-filter: blur(5px);
        -o-filter: blur(5px);
        -ms-filter: blur(5px);
		
		
		transition: all .3s !important;
	
	}
	
	.slick-current video{
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		-webkit-transform: scale(1);
		color: #e67e22;
		opacity: 1;
		transform: scale(1);
		
		pointer-events: auto !important;
		
		 filter: blur(0px);
        -webkit-filter: blur(0px);
        -moz-filter: blur(0px);
        -o-filter: blur(0px);
        -ms-filter: blur(0px);
		
		
		transition: all .3s !important;

	}
	
	
	.slick-prev, .slick-next 
	{
		background: black !important;
		padding: 50px !important;
		z-index: 99 !important;
	}
	
	
	
	.Zebra_Accordion dd /*content*/
	{
		font-size: 17px;
		padding: 5px 20px 20px 20px !important;
		margin: 0px;
		margin-top: -35px;
		border-radius: 20px;
		background: #fff !important;
		position: relative;
		box-shadow: 0 10px 10px rgba(0,0,0,0.2);
		z-index: 99;
	}
	
	.Zebra_Accordion dt 
	{
		background: #fff;
		position: relative;
		font-weight: 600;
		padding: 20px;
		border-radius: 20px;
		margin: 10px 0 0 0;
		box-shadow: 0 0 10px rgba(0,0,0,0.2);
		transition: all .5s;
		
	}
	
	
	.Zebra_Accordion dt::after
	{ 
		content:"+"; position: absolute; display: block; width: 30px; height: 30px; border-radius: 100%; 
		right: 10px; top: 10px; background: #cacaca; font-size: 35px; text-align: center; padding: 4px 5px 5px; font-weight: 200;
		cursor:pointer;
		transform: rotate(0deg); transition: all .5s;
	}
	
	
	.Zebra_Accordion dt.Zebra_Accordion_Expanded{ padding-bottom: 40px; transition: all .5s; }
	
	
	.Zebra_Accordion dt.Zebra_Accordion_Expanded::after{ transform: rotate(405deg); transition: all .5s; }
	
	

	/* Section très haute pour créer du scroll */
	.story-section {
		position: static;
		height: 250vh;
		background: #f7f7f7;
		
		color: #111 !important;
		float: left;
		width: 100%;
	}

	/* Conteneur bloqué à l'écran */
	.sticky-container {
		position: sticky;
		top: 0;
		height: 70vh;
		display: block;
		overflow: hidden;
		float: left;
		width: 100%;
		min-height: 100vh;
		background: url(images/bg-nuages.png) bottom center no-repeat;
	}

	/* Les éléments se superposent */
	.step {
		position: static;
		opacity: 0;
		transition: opacity 0.5s linear;
		color: black;
		font-size: 4rem;
	}
	
	#mainfooter{ padding-top: 150px; width: 100% !important; height: 500px; background: #fff; float: left; }
	
	#bloc2{ position: relative !important; z-index: 99999 !important; margin-top: -300px; overflow: visible;  }
	
	#bloc2 .nuage{ position: absolute !important; }
	
	
	
	#bloc2.isVisible .nuage1{ left: -300px; top: 0px; transition: all 1s !important; }
	#bloc2.isVisible .nuage2{ top: 450px; transition: all 1s !important; width: 100%; max-width: 100%; }
	#bloc2.isVisible .nuage3{ right: -300px; top: 0px;  transition: all 1s !important; z-index: 99999 !important; }
	
	
	#bloc2 .nuage1{ left: -100px; top: 0px;  transition: all 1s !important; }
	#bloc2 .nuage2{ top: 200px; transition: all 1s !important; }
	#bloc2 .nuage3{ right: -100px; top: 0px; transition: all 1s !important; }
	
	#bloc3,#bloc4,#bloc5
	{ 
		position: relative; z-index: 999; float: left; width: 20% !important; padding-top: 0; text-align: center; margin-top: 0px; 
		min-width: 20%; min-height: 500px;
		font-size: 16px;
	}
	
	
	#bloc4{ min-width: 30% !important; width: 30% !important; }
	#bloc3{ padding-left: 15%; z-index: 9999999; }
	#bloc5{ padding-right: 15%; }
	
	#bloc4 img { max-width: 120% !important; width: 120% !important;  margin-top: -40px; margin-left: -5%; }
	
	
	
	
	.block6 .col-2{ min-height: 400px; border-radius: 20px; }
	
	
	.block6 .col-2:nth-child(2)
	{ background: url( images/bg-col-3.jpg ) top left no-repeat; background-size: cover; margin-top: 30px; position: relative; }
	
	
	
	.block6 .col-2 .innercontainer {
		max-width: 100%;
		height: auto;
		padding: 0;
		margin: 0 auto;
		float: left;
		width: 84% !important;
		padding: 45px 8% 15px;
		border-radius: 20px;
		box-shadow: 0 10px 10px 0 rgba(0,0,0,0.06);
	}
	
	
	.block6 .col-2 .innercontent{  }
	
	
	
	.block6 .col-2 .infosAnime
	{ 
		margin: 0 10px 10px 10px; height: 50px; overflow: hidden; border-radius: 15px; 
		color: #fff !important; padding-top: 10px; font-size: 15px !important;
	}
	
	.block6 .col-2 .infosAnime span.first
	{
		display: inline-block;
		width: 10%; text-align: right;
		padding: 5px 2% 0 ;
		line-height: 16px;
	}
	
	
	
	
	
	
	.block6 .col-2 .infosAnime span.secondbloc
	{
		display: inline-block;
		vertical-align: top;
		padding: 10px 2% 0 2%;
		position: relative; width: 75%;
		/*background: rgba(15, 99, 10, 0.85); */
		line-height: 16px;
		height: 36px;
		width: 78%;
		border-radius: 10px;
		border: solid 1px rgba(255, 255, 255, 0.2);  
		color: #fff;
		font-weight: 600;
	}
	
	.block6 .col-2 .infosAnime span.secondbloc.bloc1, .block6 .col-2 .infosAnime span.secondbloc.bloc2{ background: rgba(15, 99, 10, 0.85); }
	
	
	.block6 .col-2 .infosAnime span.secondbloc .fas{ font-size: 12px; margin-right: 8px; color: #12a70a; }
	
	.block6 .col-2 #blocanimation .fas{ margin-left: -15px; opacity: 0; }
	
	
	.block6 .col-2 #blocanimation.etape-2 .bloc3,
	.block6 .col-2 #blocanimation.etape-3 .bloc3,
	.block6 .col-2 #blocanimation.etape-3 .bloc4,
	.block6 .col-2 #blocanimation.etape-4 .bloc4,
	.block6 .col-2 #blocanimation.etape-4 .bloc5,
	.block6 .col-2 #blocanimation.etape-5 .bloc5,
	.block6 .col-2 #blocanimation.etape-5 .bloc6,
	.block6 .col-2 #blocanimation.etape-6 .bloc6,
	.block6 .col-2 #blocanimation.etape-6 .bloc7,
	.block6 .col-2 #blocanimation.etape-7 .bloc7
	{ background: rgba(15, 99, 10, 0.8); transition: all .3s;  }
	
	.block6 .col-2 .tabheading
	{
		border-bottom: solid 1px rgba(255,255,255,0.5);
		min-height: 50px;
		position: relative;
	}
	
	.block6 .col-2 .tabheading .titre 
	{
		color: #fff;
		font-weight: 600;
		font-size: 18px;
		margin: 10px 0 0 40px;
	}
	
	.block5 .button.android img,.block5 .button.apple img
	{ vertical-align: center; margin-right: 10px; }
	.block5 .button.android{ color: #000 !important; }
	
	
	.block5 .button.android,.block5 .button.apple
	{ 
		padding: 20px !important; 
		margin-right: 30px !important;
		box-shadow : 0 0 15px rgba(0,0,0,0.2);
	}
	
	#blocanimation.etape-1{ margin-top: 0px; transition: all .3s; }
	#blocanimation.etape-2{ margin-top: -60px; transition: all .3s; }
	#blocanimation.etape-3{ margin-top: -130px; transition: all .3s; }
	#blocanimation.etape-4{ margin-top: -200px; transition: all .3s; }
	#blocanimation.etape-5{ margin-top: -270px; transition: all .3s; }
	#blocanimation.etape-6{ margin-top: -340px; transition: all .3s; }
	
	#blocanimation.etape-1 .bloc1 .fas, 
	#blocanimation.etape-1 .bloc2 .fas
	{ margin-left: 0px; opacity: 1;}
	
	#blocanimation.etape-2 .bloc2 .fas,
	#blocanimation.etape-2 .bloc3 .fas
	{ margin-left: 0px; opacity: 1; transition: all .3s; }
	
	#blocanimation.etape-3 .bloc3 .fas,
	#blocanimation.etape-3 .bloc4 .fas
	{ margin-left: 0px; opacity: 1; transition: all .3s; }
	
	#blocanimation.etape-4 .bloc4 .fas,
	#blocanimation.etape-4 .bloc5 .fas
	{ margin-left: 0px; opacity: 1; transition: all .3s; }
	
	#blocanimation.etape-5 .bloc5 .fas,
	#blocanimation.etape-5 .bloc6 .fas
	{ margin-left: 0px; opacity: 1; transition: all .3s; }
	
	#blocanimation.etape-6 .bloc6 .fas,
	#blocanimation.etape-6 .bloc7 .fas
	{ margin-left: 0px; opacity: 1; transition: all .3s; }

	
	.smallfont{ font-size: 18px; line-height: 24px; }

	
	.block6 .col-2 .infosAnime span.secondbloc span.inside
	{
		width: 200px; text-align: right; display: inline-block;
		float: right;
		line-height: 16px;
	}
	
	.block6 .col-2:first-child
	{ 
		background: #efefef; 
		width: 48% !important; 
		min-width: 48% !important; 
		margin: 30px 2% 0 0 !important; 
	}
	
	.block6 .col-2 img.illu{ width: 100%; height: auto; border-radius: 20px; }
	
	
	.block10{ position: relative; }
	
	.block10::after
	{ 
		position: absolute;
		width: 100%;
		height: 220px;		
		content:"";
		bottom: 0;
		display: block;
		z-index: 3;
		background: url(images/2.png) top center no-repeat;
	}
	
	.block10 h3 span.bigorange
	{ 
		color: rgb(255, 76, 0); font-size: 150px; display: block; text-align: center;
		margin-top:	60px; text-shadow: 0 10px 10px rgba(0,0,0,0.3); margin-bottom: 80px;
	}
	
	
	.block10  #highlightnumbers span
	{ 
		font-size: 80px; font-weight: 600; 
		display: block; text-align: center; 
		margin: 20px 0 20px; 
	}
	
	.block10 #highlightnumbers span span.color {
		color: rgb(255, 76, 0);
		display: inline !important;
		font-weight: 900;
	}
	
	.phonefx
	{
		background: url(images/bg-col-4.jpg); min-height: 600px; background-size: cover; border-radius: 20px;
		position: relative; overflow:hidden;
	}
	
	
	.phonefx img
	{ 
		position: absolute;
		right: -265px; bottom: -225px;transform: rotate(30deg); 
		opacity: 0; transition: all .3s; transition-delay: 0s;  
	}
	
	.jetevois .phonefx img 
	{
		position: absolute;
		bottom: -125px;
		right: -65px;
		width: 560px;
		height: auto;
		opacity: 1;
		transform: rotate(-20deg);
		transition: all .3s; transition-delay: 1s;
	}
	
	
	#blocfaq .review
	{ 
		background: #e8e8e8;
		margin: 15px 15px 15px 15px;
		border-radius: 20px;
		padding: 20px;
		font-size: 17px;
		text-align: left;
		float:left;
	}
	
	#blocfaq .review p{ font-size: 17px !important; font-weight: 800; float: left; }
	#blocfaq .review p span{ font-size: 15px !important; font-weight: 600; display: block; margin-top: -10px; }
	
	#blocfaq .review img{ float: left; margin: 0 10px 0 0; }
	
	
	#mainfooter
	{
		
		
	}
	
	
	form input{ font-size: 21px !important; min-height: 50px !important; }
	
	form textarea,
	form input[type="mail"],
	form input[type="text"]
	{ 
		border: solid 1px rgba(0,0,0,0.1); background: #dedede; padding: 0 20px; border-radius: 20px; 
		vertical-align: top;
	}
	
	form input[type="submit"]
	{ 
		background: #000; padding: 10px 20px; border-radius: 20px; color: #fff; border: none; 
		font-size: 18px !important;
	}
	
	.formbasic input[type="mail"],
	.formbasic input[type="text"],
	.formbasic textarea
	{
		display: block; width: 100%; margin: 0 0 10px 0;
		font-size: 17px !important;
		font-weight: 600;
		font-family: "Google Sans Flex", sans-serif;
	}
	
	.formbasic textarea{ height: 310px !important; padding: 20px !important; }
	
	
	#mainfooter a.footerlink{ margin-top: 10px; display: inline-block; background: #dedede; padding: 3px 10px; border-radius: 20px;  }
	
	#mainfooter p{ font-size: 16px; }
	
	#mainfooter form input{ font-size: 21px !important; min-height: 50px !important; }
	
	#mainfooter form input[type="mail"]
	{ 
		border: solid 1px rgba(0,0,0,0.1); background: #dedede; padding: 0 20px; border-radius: 20px; 
		vertical-align: top;
	}
	
	#mainfooter form input[type="submit"]
	{ 
		background: #000; padding: 10px 20px; border-radius: 20px; color: #fff; border: none; 
		font-size: 18px !important;
	}
	
	
	
	p, body
	{ 
		color: rgb(73, 77, 77) !important; 
		font-family: "Google Sans Flex", sans-serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		line-height: 30px;
		font-size: 21px;
	}
	
	.justify{ text-align: justify; }
	.alignleft{ text-align: left; }
	.alignright{ text-align: right; }
	.aligncenter{ text-align: center; }
	.fontwhite{ color: #fff !important; }
	.font16{ font-size: 16px !important; }
	
	.floatleft{ float: left !important; display: block !important;  }
	
	.padding20{ padding: 20px !important; }
	
	#bloc3 h3, #bloc5 h3{ color: rgb(19, 21, 21); font-size: 42px; font-weight: 600; line-height: 48px; }
	
	h3{ color: rgb(19, 21, 21); font-size: 60px; font-weight: 500; line-height: 72px; }
	
	a.button
	{ 
		display: block; text-align: center; 
		padding: 15px 20px; border-radius: 50px; 
		background: #111; color: #fff; 
		margin: 0 0 10px; 
		text-decoration: none;
	}
	
	
	a.button.apple,
	a.button.android
	{ 
		display: inline-block; text-align: center; 
		padding: 12px 20px; border-radius: 50px; 
		background: #111; color: #fff; 
		margin: 0 0 10px; 
		font-size: 19px;
		text-decoration: none;
		width: 300px;
	}
	
	
	.blockcontainer{ width: 1280px; margin: 0 auto !important; max-width: 100%; }
	
	
	.block8{ padding: 25px 0 200px 0; float: left; }
	
	.block8 .col-2.left
	{
		background: url(images/bg1.jpg) center center no-repeat;
		background-size: cover;
		
		border-radius: 20px;
		overflow: hidden;
		box-shadow: 0 0 10px rgba(0,0,0,0.3);
		width: 48%;
		min-width: 48%;
		margin: 0 2% 0 0;
	}
	
	
	.block8 .col-2.right
	{
		background: #131515 url(images/bg-col-1.png) 0px 150px no-repeat;
		border-radius: 20px;
		color: #fff;
	}
	
	.block8 .col-2.right, .block8 .col-2.left{ min-height: 700px; }
	
	
	.block8 .col-2.left h3, 
	.block8 .col-2.right h3, 
	.block7 .innercontainer h3,
	.block6 h3
	{ 
		font-size: 30px !important; 
		line-height: 36px; 
	}
	
	.block7 .innercontainer p{ color: rgb(184, 184, 184) !important; line-height: 23px; font-size: 18px; }
	.block7 .innercontainer a.button
	{ 
		background: #fff !important; color: #111; font-size: 16px; padding: 8px 30px; 
		text-decoration: none; margin-top: 20px;
	}

	.block8 .col-2.right .innercontainer div.notification
	{ 
		margin: 0 auto; max-width: 100%; width: 310px; min-width: 310px; min-height: 200px; 
		background: rgba(32, 32, 32, 0.9);
		border: solid 1px rgba(255,255,255,0.3);
		position: relative;
		border-radius: 20px;
		margin-top: 100px;
		padding: 50px 50px 20px 50px;
	}
	
	.block7 .blockcontainer .innercontainer
	{
		background: #090a0d url(images/bg-col-2.webp) top left no-repeat;
		/*background: #090a0d url(images/animation-phone-2.png) top left no-repeat;*/
		background-size: 100% auto;
		border-radius: 20px;
		min-height: 400px;
		padding-top: 100px;
		position: relative;
		overflow: hidden;
	}
	
	.block7 .blockcontainer .innercontainer .legende
	{ 
		color: rgb(184, 184, 184) !important; font-size: 16px; font-weight: 600; 
		position: absolute; bottom: 30px; left: 5%; width: 900px; height: auto;
	}
	
	
	.block7 .blockcontainer .innercontainer img.animphone
	{
		position: absolute; bottom: -180px; right: 100px; width: 400px; height: auto;
	}
	
	
	div.notification::before
	{ 
		background: url(images/cloche.png) 5px 5px no-repeat; 
		width: 70px; 
		height: 70px; 
		content:""; 
		position: absolute; 
		top: -30px; 
		left: -30px; 
		display: block; 
	}
	
	.block8 .col-2.right .innercontainer div.notification .small{ font-size: 15px !important; color: #afafaf !important; font-weight: 600; line-height: 18px;  }
	
	.block8 .col-2.right .innercontainer div.notification p
	{ 
		font-size: 15px; color: #afafaf !important; font-weight: 600; line-height: 18px; margin-top: 10px !important; 
	}
	
	.block8 .col-2.right a.button
	{ 
		padding: 8px 0 !important; border-radius: 10px; background: #cacaca; 
		font-size: 16px; text-decoration: none; width: 48%;
	}
	
	.block8 .col-2.right a.button:first-child{ background: #fff; color: #131515; }
	.block8 .col-2.right a.button:nth-child(2){ background: #131515; }
	
	.radius20{ border-radius: 20px !important;  }
	
	.bgdark{ background: #131515 !important;  }
	
	.bgdark.opac80{ background: rgba(19, 21, 21, 0.8) !important; }
	.bgdark.opac60{ background: rgba(19, 21, 21, 0.6) !important; }
	.bgdark.opac50{ background: rgba(19, 21, 21, 0.5) !important; }
	
	
	
	.innercontainer .innercontent .col-2
	{
		width: 48% !important; min-width: 48% !important; max-width: 48% !important; float: left !important;
	}
	
	.innercontainer .innercontent .col-2:nth-child(2){ float: right !important; }
		
	.innercontainer .innercontent .col-2 .bgdark { min-height: 40px; margin-top: 10px; }
	
	
	.block13 .faqdescription
	{
		border-radius: 20px; background: #fff; text-align: left; padding: 30px; width: 400px;
	}
	
	.block13 h2{ font-size: 48px !important; line-height: 55px !important; }
	
	.circle-progress{
		position:relative;
		width:100px;
		height:100px;
		margin: 0 auto;
	}
	
	.circle-progress.large{
		position:relative;
		width:130px;
		height:130px;
	}

	.circle-progress svg{
		width:100%;
		height:100%;
		transform:rotate(-90deg);
	}

	.circle-progress circle{
		fill:none;
		stroke-width:10;
		stroke-linecap:round;
	}

	.circle-bg{
		stroke:#2c2c2c;
	}

	.circle-bar{
		stroke:#9000ff;
		/*stroke:#00d8ff;*/
	}
	
	.circle-bar.jaune{
		stroke:#ff9803;
		/*stroke:#00d8ff;*/
	}
	
	.circle-bar.orange{
		stroke:#ff4c00;
		/*stroke:#00d8ff;*/
	}

	.progress-value{
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%, -50%);
		color:white;
		font-size:21px;
		font-weight:bold;
	}
	
	.block8 .col-3 .valeurtitre{ color: #b5b5b5; font-size: 20px; }
	
	
	.block9 h2, .block11 h2, .block10 h3{ font-weight: 600; font-size: 60px; line-height: 68px; color: rgb(19, 21, 21); }
	
	.btntab
	{ 
		color: #222; 
		display: inline-block; 
		padding: 8px 20px; 
		margin: 0 5px 0 0; 
		background: #efefef; 
		border: solid 1px rgba(0,0,0,0.2); 
		border-radius: 5px; 
		text-decoration: none;
		font-size: 16px;
	}
	
	.btntab.active{ background: #cacaca; color: #131313; }
	
	.block11 .btntab img{ vertical-align: center; width: 15px; height: auto; margin-right: 5px; }
	
	
	.contentTab{ width: 1024px; margin: 0 auto; position: relative; border-radius: 20px; overflow: hidden; height: 450px; margin-top: 40px; max-width: 100%; }
	
	.contentTab .extrait
	{ 
		color: #fff; 
		background: rgba(0,0,0,0.25); 
		width: 350px; 
		height: auto; 
		position: absolute; 
		bottom: 40px; 
		right: 40px; 
		border: solid 1px rgba(255,255,255,0.3); ; 
		border-radius: 10px;
		padding: 20px 30px; 
		font-size: 18px;
		line-height: 21px; 
		text-align: left;
		font-weight: 500;
		box-shadow: 0 0 20px rgba(0,0,0,0.15);
	}
	
	.contentTab::before
	{ 
		content:""; position: absolute; top: 0px; left: 0px; width: 100%; height: 350px; 
		display: block;
		background: #000000;
		background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.72) 100%);
	}
	
	#bloclinkTab1{ background: url(images/bgtabs/1.jpg) center center no-repeat; background-size: cover; }
	#bloclinkTab2{ background: url(images/bgtabs/2.jpg) center center no-repeat; background-size: cover; }
	#bloclinkTab3{ background: url(images/bgtabs/3.jpg) center center no-repeat; background-size: cover; }
	#bloclinkTab4{ background: url(images/bgtabs/4.jpg) center center no-repeat; background-size: cover; }


	.contentTab{ opacity: 0; position: absolute; }
	

	.contentTab.active{ opacity: 1;  position: relative;  transition: all .6s; }
	
	.col4infos
	{
		width: 22%; margin: 0 1% 0 1%; display: inline-block; background: #fff; border-radius: 15px;
		box-shadow: 0 0 15px rgba(0,0,0,0.1); position: relative; min-height: 280px; font-size: 19px; line-height: 24px;
		text-align: left;
	}
	
	.col4infos img{ position: absolute; top: 20px; left: 20px; }
	
	
	#mobilestory{ display: none !important; }
	
	#blocactus{ padding-left: 5% !important; width: 85% !important; }
	
	
	@media screen and (max-width:1024px)
	{
		#mainfooter form input[type="mail"] 
		{
			margin-bottom: 10px !important;
		}
		

		
		.block7 .blockcontainer .innercontainer {

			background-position: -60px -179px;
		}
		
		.block6 .contentCenter .mentionstitre {
			top: 10px;
			width: 410px;
		}
		
		.maxwidthmobile{ max-width: 100% !important; }
		
		.hideonmobile{ display: none !important; }
		.centermobile{ margin: 0 auto !important; float: none !important; }
		
		.box
		{ 
			display: block !important; 
			width: 100% !important; 
			float: left !important; 
			position: relative !important; 
			height: auto !important;
			max-width: 100% !important;		
		}
		
		.wrapper, .wrapper2, .wrapper3 {
			max-width: 100% !important;
		}
		
		.contentCenter {
			max-width: 100% !important;
		}
		
		.main{
			float: left !important;
			max-width: 100% !important;
			display: block !important;
			overflow-x:hidden;
		}
		
		.main .block1 {
			height: 140vh !important;
			background-size: auto 140vh;
		}
		
		.main .block1 #nuagecover{ height: 250px !important; }
		
		
		.main .block1 #nuagecover img.phone {
			max-width: 235px;
			margin-top: -100px;
			border-radius: 20px;
		}
		
		h2 { font-size: 40px !important; font-weight: 500;	line-height: 50px !important;	}
		h3 { font-size: 36px !important; font-weight: 500;	line-height: 46px !important;	}
		
		
		.block6, .block14, .block13{ padding: 90px 3% !important; max-width: 94% !important; }
		
		.block15 h3{ font-size: 21px !important; line-height: 22px !important; }
		
		.block7 .blockcontainer .innercontainer{ min-height: 400px; }
		
		.block7 .blockcontainer .innercontainer img.animphone 
		{
			right: 65px !important;
			width: 30% !important;
		}
		
		.block10 video{ width: 100% !important; }
		
		.btntab {
			padding: 8px 10px !important;
			margin: 0 4px 0 0 !important;
			font-size: 14px !important;
		}
		
		.block12  video{ width: 300px; }
		
		.block10::after 
		{
			bottom: 145px;
		}
		
		.story-section{ display: none !important; }
		
		
		#mobilestory
		{
			display: block !important; width: 100% !important; float: left !important;
		}
		
		
		
		
		/*html body, body *{ display: none; }*/
	}
	
	@media screen and (max-width:980px)
	{
		
		form input{ width: 100% !important; }
		
		.innercontainer{ padding: 20px 0px !important; width: 100% !important; }
		
		#sitemenu{ position: static !important; }
		
		html body .main .col-2, 
		.col-3, 
		#sitemenu .col-3,
		.col-4, 
		#sitemenu .col-4,
		#sitemenu .col-2,
		.innercontainer .innercontent .col-2
		{ float: none !important; width: 100% !important; max-width: 100% !important; clear:both !important; }
		
		h1{ font-size: 40px !important; line-height: 46px !important; }
		h2, h3{ font-size: 30px !important; line-height: 36px !important; }
		
		div{ /*max-width: 100% !important;*/ }
		
		.main .block1 #nuagecover{ width: 100% !important; max-width: 100% !important; }
		
		#pageheading {
			width: 100% !important; 
			height: 76vh !important; 
			left: 0 !important; 
			margin-left: 0 !important; 
			position: relative !important;
			margin-top: 25px !important;
			top: 0%;
		}
		
		.block6 .col-2:nth-child(2){ padding-bottom: 40px !important; }
		
		
		
		#pageheading a.button, a.button,
		a.button.apple, a.button.android,
		.block5 a.button.apple, .block5 a.button.android
		{
			width: 100% !important;
			margin: 0 0 20px !important;
			text-decoration: none;
			font-size: 17px;
			padding: 20px 0 !important;
		}
		
		
		.main .block1 {
			height: 135vh !important;
			overflow: hidden !important;
		}
		
		.main .block1 #nuagecover{ height: 250px !important; left: 0 !important; }
		
		
		.main .block1 #nuagecover img.nuage 
		{
			display: none !important;
		}
		
		#wrapper div, #wrapper2 div, #wrapper3 div, #wrapper4 div{  }
		
		
		.block6 .contentCenter .mentionstitre {
			position: static !important;
			float: left;
			width: 100% !important;
			height: auto !important;
		}
		
		.block6 .col-2:first-child {
			background: #efefef;
			position: relative !important;
			float: left;
			width: 100% !important;
			height: auto !important;
			display: block !important;
			margin: 0px !important;
		}
		
		
		.contentCenter {
			max-width: 100% !important;
			float: left;
			width: 100% !important;
		}
		
		.block6 .col-2 .innercontainer {
			width: 100% !important;
		}
		
		#blocactus{ width: 80% !important; padding: 30px 10% 0 10% !important; } 
		
		
		.blockcontainer{ float: left !important; }
		
		.col4infos {
			width: 95% !important;
			margin: 0 1% 15px 1%;
		}
		
		.block7
		{
			background: #f7f7f7;
			position: static;
			float: left;
			width: 100%;
			width: 92% !important;
			margin: 0 4% !important;
		}
		
		
		.block6, .block14, .block13 {
			padding: 30px 3% !important;
			max-width: 94% !important;
		}
		
		.block12 .contentCenter::after, .block12 .contentCenter::before{ display: none !important; }
		
		.slick-slide{ text-align: center; }
		
		h2,	h3, p{ padding: 0 15px !important; margin-bottom: 10px !important; }
		
		img.illu{ margin: 15px 3% !important; max-width: 94% !important; }
		
		.innercontent{ float: left !important; width: 100% !important; }
		
		#pointville .col-3{
			padding-top: 30px;
			width: 30% !important;
			float: left !important;
			width: 33% !important;
			clear: none !important;
		}
		
		.block6 .col-2:nth-child(2){ float: left !important; }
		
		.block12 .slick-prev{ margin-left: -90px;}
		
		.block10 h3 span.bigorange{ font-size: 77px; }

		#highlightnumbers{ position: relative; z-index: 99; }
		
		#highlightnumbers .col-3{ margin-bottom: 50px !important; }
		
		.btntab{ margin-bottom: 10px !important; }
		
		.innercontent 
		{
			float: left !important;
			width: 96% !important;
			margin: 2% !important;
		}
		
		.block8{ padding-bottom: 50px !important; width: 90% !important; margin-left: 5% !important; }
		
		.block8 .col-2.right{ padding-bottom: 50px !important; }
		
		.block7 .blockcontainer .innercontainer {
			background-size: 400px auto;
			background-position: -125px 0;
		}
		
		.block7 .blockcontainer .innercontainer img.animphone{ display: none !important; }
		
		.block7 .blockcontainer .innercontainer .legende {
			color: rgb(184, 184, 184) !important;
			font-size: 16px;
			font-weight: 600;
			position: absolute;
			bottom: 20px;
			left: 5%;
			width: 76%;
			height: auto;
			line-height: 18px;
		}
		
		.block5 h3
		{
			padding: 30px 50px !important;
			font-size: 30px !important;
			line-height: 32px !important;
		}
		
		
		.block5 #wrapper {
			margin-top: 0 !important;
			padding-top: 170px !important;
		}
		
		.block5 {
			padding-bottom: 35px !important;
			z-index: 9999;
			position: relative !important;
		}
		
		.menutop {
			padding: 5px !important; margin-bottom: 10px !important;
		}
		
		.menutop a {
			color: #000;
			font-size: 16px;
			text-decoration: none;
			display: inline-block;
			padding: 6px 10px;
			border-radius: 15px;
			margin: 0 2px;
		}
		
		.block7 .blockcontainer .innercontainer {
			min-height: 400px;
		}
		
		.block8 .col-2.right .innercontainer div.notification {
			margin: 0 5%;
			max-width: 90%;
			width: 80% !important;
			margin-top: 40px;
			padding: 50px 5% 20px 5%;
			min-width: 200px !important;
		}
		
		.contentTab .extrait {
			width: 200px;
		}
		
		
		#mainfooter form input[type="submit"] 
		{
			margin-bottom: 40px !important;
		}
		
		#mainfooter{
			padding: 150px 5% 0;
			width: 90% !important;
			height: 500px;
			background: #fff;
			float: left;
		}
		
		.block13 .faqdescription {
			padding: 30px 10%;
			width: 80% !important;
			max-width: 100% !important;
		}
		
		
		.circle-progress.large {
			position: relative;
			width: 100px;
			height: 100px;
		}
		
		.block8 .col-2.right{
			min-height: 730px;
		}
		
		.block14 div{ padding-right: 0px !important; }
		
		.block12 video {
			width: 100%;
		}
		
		#mainfooter form input[type="mail"] {
			padding: 0 3% !important;
			width: 94% !important;
		}
		
		.block7 .innercontainer a.button {
			padding: 5px 0px !important;
			border-radius: 8px !important;
		}
		
		#blocanimphone img {
			max-width: 100%;
			width: 80% !important;
			display: block;
			margin: 0 auto;
			margin-top: 32%;
		}
		
		.formbasic input[type="mail"],
		.formbasic input[type="text"],
		.formbasic textarea
		{
			display: block; width: 90% !important; padding: 5px 5% !important;
		}
		
	}