/* >–––––––––––––––––––––––––––––––––––––– SECTION A –––––––––< */

	/* BYPASSES */

	#sIntro.a .box
	{
		flex-direction: column;
		justify-content: center;
		min-height: 100vh;
	}
	#sIntro.a .content
	{
		display: flex;
		padding-top: 0;
	}
	#sIntro.a .content > div
	{
		flex-grow: 1;
		flex-direction: column;
		height: auto;
	}


	/* TITLES */

	section.a .titles
	{
		display: flex;
		margin-top: auto;
	}

	section.a .triple_title.years
	{
		margin-top: 9rem;
		margin-left: auto;
	}
	section.a .triple_title.years h3
    {
        font-family: "Proxima Nova W01 Thin", sans-serif;
        font-size: 6.2rem; line-height: 6.4rem;
        color: #0001FF;
        text-shadow: 4px 4px 2px rgba(0, 0, 0, 0.15);
    }

    section.a .triple_title.years h4
    {
        font-family: "Proxima Nova W01 Thin", sans-serif;
        font-size: 3.2rem; line-height: 3.4rem;
        color: #000;
    }
    	section.a .triple_title.years h4 b { font-family: "Proxima Nova W01 Regular", sans-serif; }


    /* MAIN CONTENT */

    .main_content
    {
    	display: flex;
    	justify-content: center;
    	align-items: flex-end;
    	margin: 0 auto 2rem auto;
    	width: 100%;
    }
    	.main_content .img
    	{
    		max-width: 30rem;
    	}
	    	.main_content img
	    	{
	    		display: block;
	    		width: 100%;
	    		height: auto;
	    		-webkit-filter: drop-shadow(2px -2px 2px rgba(0, 0, 0, 0.2));
						filter: drop-shadow(2px -2px 2px rgba(0, 0, 0, 0.2));
	    	}
	    	.main_content img.f { display: none; }

    	.main_content .contenu
    	{
    		flex-grow: 1;
    		margin: 0 2rem;
    		max-width: 60rem;
    		text-align: right;
    	}
    		.signup_box
    		{
    			display: inline-block;
    			box-sizing: border-box;
	    		padding: 2.5rem;
	    		border-radius: 1.5rem;
		        background-color: #76FFF6;
		        -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.1));
		                filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.1));
		        transition: all 0.5s ease;
    		}
		    	.signup_box > div
		    	{
		    		display: flex;
		    		align-items: center;
			    }
			    	.signup_box h3
			    	{
			    		margin-right: 4rem;
			    		margin-bottom: 0;
			    		font-size: 3rem; 
			            line-height: 3.2rem;
			            color: #000;
			    	}
		    .signup_box:hover { opacity: 0.8; }


    /* CTA */

	section.a .ctabox 
	{
		margin-top: auto;
		margin-left: auto;
		text-align: right;
	}


/* >–––––––––––––––––––––––––––––––––––––– SECTION B –––––––––< */

	section.b .triple_title
	{
		margin-bottom: 3rem;
	}

	.recent_jobs 
	{
		display: flex;
		flex-wrap: wrap;
	}
	
	.recent_jobs .item 
	{
		flex-basis: 33.33%;
		box-sizing: border-box;
		padding: 1rem;
	}
		.recent_jobs .bigbtn_box
		{
			display: flex;
			flex-direction: column;
			height: 100%;
		}
			.recent_jobs header
			{
				flex-grow: 1;
				position: relative;
			}
				.recent_jobs .bigbtn_box h3 
				{
					margin-bottom: 2rem;
					font-family: "HelveticaNeueETW01-45Lt", sans-serif;
			        font-size: 2.8rem; 
			        line-height: 3rem;
			        color: #FFF;
			    }

			    .recent_jobs .bigbtn_box h4
			    {
			    	margin-bottom: 0.5rem;
			    	font-family: "HelveticaNeueETW01-45Lt", sans-serif;
			    	font-size: 1.6rem;
			    	line-height: 1.8rem;
			    	color: #00F9FF;
			    }

			    .recent_jobs header .data {
			    	display: flex;
			    }
				    .recent_jobs header li {
				    	font-family: "HelveticaNeueETW01-45Lt", sans-serif;
				    	font-size: 1.6rem; line-height: 1.6rem;
				    	color: #fff;
				    	list-style: none;
				    }
				    .recent_jobs header li:last-child {
				    	margin-left: auto;
				    }

			.recent_jobs footer
			{
				margin-top: 1.5rem;
			}
			    .recent_jobs .icons {
			    	display: flex;
			    }
			    	.recent_jobs .icons > * {
			    		display: block;
			    		margin-right: 4rem;
			    		cursor: pointer;
			    	}
			    	.recent_jobs .icons > *:last-child {
			    		margin-right: 0;
			    	}
				    .recent_jobs .icons div { 
				    	position: relative;
				    	width: 3rem;
				    	height: 3rem;
				    }
				    	.recent_jobs .icons svg {
				    		position: absolute;
				    		left: 0; top: 0; right: 0; bottom: 0;
				    		fill: #FFDD00;
				    	}



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

	section.c > .box {
		display: flex;
	}

	.navette 
	{
		width: 60%; max-width: 60rem;
	}
		.navette img {
			display: block;
			width: 100%; max-width: 50rem;
			height: auto;
		}

		.navette .triple_title {
			margin: 1rem 0 3rem 0;
		}

	.branchbox 
	{
		flex: 0 0 40%;
		margin-left: auto;
		margin-top: 50rem;
		max-width: 50rem;
		text-align: center;
	}
		.branchbox .contentbox > div.fond {
			border-radius: 0 0 0.6rem 0;
		}
		.branchbox .bigbtn_box
		{
			margin-bottom: 0;
			border-bottom-left-radius: 0;
			border-bottom-right-radius: 0;
		}
		.branchbox .bigbtn_box h3 
		{
	        font-size: 3rem; line-height: 3.4rem;
	        color: #FFF;
	    }
	    .branchbox .bigbtn_box h4
	    {
	    	margin-bottom: 0.5rem;
			    	font-family: "HelveticaNeueETW01-45Lt", sans-serif;
			    	font-size: 1.6rem;
			    	line-height: 1.8rem;
			    	color: #00F9FF;
	    }

	    .branchbox .img
	    {
	    	box-sizing: border-box;
			padding: 0 0.5rem;
	    }
	    .branchbox img 
	    {
			display: block;
			margin: 0;
			box-sizing: border-box;
			width: 100%;
			height: auto;
			border-radius: 0 0 1.5rem 1.5rem;
		}

		.branchbox .ctabox
		{
			margin: -3rem auto 0 auto;
		}



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

	.recent_jobs .contentbox.onScroll {
		margin-top: 3rem;
		opacity: 0;
		transition: opacity 0.4s ease, margin-top 2s ease;
	}
	.recent_jobs .contentbox.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: 0 auto; width: 100%; }
}

@media all and (max-width: 1100px) 
{
/* SECTION A –––––––––< */
	#sIntro.a .box { display: block; min-height: 0; height: auto; }
	#sIntro.a .content { max-width: none; }
	section.a .titles { display: block; margin-top: 0; margin-bottom: 2rem; }
	section.a .triple_title.years { margin-top: 0; margin-left: 0; }
	section.a .triple_title.years h3 { font-size: 5.2rem; line-height: 5.4rem; }
    section.a .triple_title.years h4 { font-size: 3.2rem; line-height: 3.4rem; }
	.main_content { display: block; margin-bottom: 0; }
	.main_content .contenu { margin: 0; margin-bottom: 4rem; max-width: none; text-align: center; }
	.main_content .bigbtn_box { display: inline-block; vertical-align: top; }
	.signup_box { display: inline-block; vertical-align: top; }
	.main_content .img.girl { display: none; }
	.main_content .img.guy { width: auto; max-width: none; text-align:center; }
	.main_content img.f { display: inline-block; width: 40%; }
	.main_content img.m { display: inline-block; width: 40%; }
	section.a .ctabox { display: none; }
}

@media all and (max-width: 1000px) {
	/* SECTION B ---------< */
	.recent_jobs { display:block; }
	.recent_jobs .contentbox { margin: 0 auto 4rem auto; max-width: 54rem; }
	.recent_jobs .contentbox h3 { font-size: 2.4rem; line-height: 3rem; }
	.recent_jobs footer li { font-size: 1.4rem; line-height: 1.4rem; }
	.recent_jobs .icons div { width:2.5rem; height:2.5rem; }
}

@media all and (max-width: 800px) 
{
/* SECTION A –––––––––< */
	section.a .triple_title.years h3 { font-size: 4.2rem; line-height: 4.4rem; }
    section.a .triple_title.years h4 { font-size: 2.8rem; line-height: 3rem; }
    .main_content img.f { width: 48%; }
	.main_content img.m { width: 48%; }

	/* >------ CONTENT BOX & DEGRADS -----< */
    .contentbox.franchise h4 { font-size: 1.6rem; line-height: 1.6rem; }
    .contentbox.franchise h3 { margin-bottom: 1rem; font-size: 3.2rem; line-height: 3.4rem; }

	/* SECTION C –––––––––< */
	.branchbox .contentbox h3 { font-size: 2.4rem; line-height:3rem; }
}

@media all and (max-width: 600px) 
{
/* SECTION A –––––––––< */
	.signup_box { padding: 2rem; border-radius: 1.2rem; }
}