div.societe{
display: flex;
flex-direction: row;
}

div.story{
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
}

div.story > h3{
font-size: 30px;
color:#4C4CCF;
margin-top: 40px;
margin-bottom: 60px;
}

.histoire{ 
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}

#chronos{
height: 1450px;
}

div.flecheG{
height: 1300px;
align-self: flex-start;
display: flex;
flex-direction: column;
justify-content: space-around;
}

div.flecheD{
height: 1100px;
align-self: flex-end;
display: flex;
flex-direction: column;
justify-content: space-between;
}

div.fg{
display: flex;
flex-direction: column;
align-items: flex-end;
}

div.fg > p, div.fd > p{
margin-left: 50px;
margin-right: 50px;
text-align: center;
width: 60%;
font-size: 14px;
color: grey;
opacity: 0;
}

@media screen and (max-device-width:800px ){
	div.fg > p, div.fd > p{
opacity: 1;
}
}


img.fig{
margin-right: 40px;
width: 70%;
}

@media screen and (max-width: 600px){
	#chronos{
		display: none;
	}

	img.fig{
		border-radius: 100%;
	}
}

.nosemploye{
	font-size: 30px;
	color: #A66EFF;
	align-self: center;
	margin-left: 450px;

}

div.suremploye{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

div.gerant{
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 100px;
}

div.gerant > article{
	padding: 20px 20px;
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	align-items: center;
	margin: 56px;
	width: 400px;
	height: 700px;
	border:solid 1px;
	border-color: grey;
}

div.gerant > article > h3.titre{
font-size: 20px;
color:#4C4CCF;
}

div.gerant > article > h3.nom{
	color: grey;
	font-size: 25px;
}

div.gerant > article > h3.nom > span{
	color: #A66EFF;
}

div.gerant > article > p{
	font-size: 14px;
	text-indent: 20px;
	text-align: justify;
}

div.personnel{
	display: flex;
	flex-direction: column;
	align-items: center;
}

div.employe{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	flex-wrap: wrap;
	align-items: center;
}

div.employe > article{
	padding: 20px 20px;
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	align-items: center;
	margin: 10px;
	width: 400px;
	height: 550px;
	border:solid 1px;
	border-color: grey;
}

div.employe > article > h3.nom{
	color: grey;
	font-size: 25px;
}

div.employe > article > h3.nom > span{
	color: #A66EFF;
}

div.employe > article > p{
	font-size: 14px;
	text-indent: 20px;
	text-align: justify;
}

@media screen and (max-width: 1250px){
	div.societe{
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
	}

	div.gerant{
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

@media screen and (max-width: 960px){
	div.gerant{
		flex-direction: column;
		align-items: center;
	}
}

@media handheld{
div.fg > p, div.fd > p{
width: 70%;
font-size: 15px;
opacity: 1;
}
}

div.collabo{
	margin: 10px;
	display: flex;
	flex-direction: row;
	border-top: solid 1px;
	overflow-x: scroll;
	overflow-y: hidden;
}

div.collabo > img {
margin: 30px;
margin-right: 50px;
width: 200px;
height: 200px;
}