
/* >–––––––––––––––––––––––––––––––––––––– STATS EN BREF / SERVICES –––––––––< */

#sIntro.b {  }
#sIntro.b .content {
	padding-right: 0;
	padding-bottom: 8rem;
}

.services {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 20vh;
}
	.services section {
		margin-bottom: 1rem;
		box-sizing: border-box;
		padding: 2rem 4rem;
		max-width: 50rem;
		text-align: center;
		border-radius: 0.6rem;
		box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.4);
	}
		.services h4 {
			margin-bottom: 1rem;
			font-family: "Proxima Nova W01 Thin", sans-serif;
			font-size: 3.5rem; line-height: 4rem;
			color: #54CFFD;
		}

		.services p {
			text-align: center;
			color: #eee;/*#FFDD00;*/
		}



/* >–––––––––––––––––––––––––––––––––––––– SECTION C –––––––––< */

.navette 
{
	display: flex;
}
	.navette .image {
		flex: 0 0 40%;
		margin-left: auto;
		margin-top: auto;
	}
		.navette img {
			display: block;
			width: 100%;
			height: auto;
		}

	.navette .txt {
		box-sizing: border-box;
		margin-left: auto;
		padding-left: 4rem;
		max-width: 60rem;
	}
	.navette .triple_title {
		margin: 1rem 0 3rem 0;
	}
		.navette .triple_title h1 {
			color: #FFFEF7;
		}
		.navette .triple_title h2 {
			color: #B4D4FF;
		}

	.navette .txt > p {
		color: #69C6FB;
	}


/* >–––––––––––––––––––––––––––––––––––––– ANIMATION –––––––––< */

.services section.onScroll {
	margin-top: 3rem;
	opacity: 0;
	transition: opacity 0.4s ease, margin-top 2s ease;
}
.services section.onScroll.active { margin-top: 0; opacity: 1; }


.navette img.onScroll { margin-left: -4rem; opacity: 0; transition: opacity 0.4s ease, margin-left 2s ease; }
.navette img.onScroll.active { margin-left: 0; opacity: 1; }




/* >–––––––––––––––––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF ––––––––––––––––––––––– REACTIF –––––––––< */



@media all and (max-width: 1200px) {
	/* SECTION C –––––––––< */
	section.c > .box { flex-direction:column; }
	.branchbox { flex: 0 0 100%; order: 2; margin: 18rem auto 0 auto; }
	.navette { order: 1; margin-left: auto; margin-right: auto; width: 100%; }
}

@media all and (max-width: 1100px) {
	/* SECTION B ---------< */
	#iViewport > section#sIntro.b { display: block; padding-top: 6rem; padding-bottom: 6rem; }
	#sIntro.b .content { flex: 0 0 100%; margin-left: 0; padding-top: 0; padding-bottom: 0; width: 100%; }

	/* SECTION C ---------< */
	.navette .image { flex: 0 0 45%; }
	.navette .txt { flex: 0 0 55%; }
}

@media all and (max-width: 800px) {
	/* SECTION C –––––––––< */
	.navette { display:block; }
	.navette .txt { padding-left: 0; }
}

@media all and (max-width: 600px) {
	
}

