@charset "UTF-8";
/* CSS Document */
/* color 1 mauve foncé : #652583 */
/* color 2 mauve clair : #911B83 */
/* color 3 gris : #969696 */
#formation{
	max-width: 1140px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 40px 10px;
	margin: 40px auto;
}
#formation a{
	color: #652583;
	text-decoration: none
}
#formation main{
	margin-bottom: 4em;
}
#formation main h1{
	color: #652583;
	text-transform: uppercase;
	font-size: 2rem;
}
#formation main h2.fCategorie{
	color: #969696;
	font-size: 1rem;
	margin-bottom: 4em;
}
#formation main h2{
	color: #911B83;
	margin-bottom: 1em;
}
#formation main div{
	margin-bottom: 4em;
}
#formation aside .fImage{
}
#formation aside img{
	width: 100%;
	height: auto;
}
#formation aside > *{
	background-color: #911B83;
	margin-bottom: 2em;
	-webkit-border-radius: 6px 6px 6px 6px;
	border-radius: 6px 6px 6px 6px;
	-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.25);
	box-shadow: 0 0 10px 0 rgba(0,0,0,.25);
}
#formation aside > div{
	padding: 10px 10px 10px 65px;
	color: white;
	position: relative;
	min-height: 4em;
}
#formation aside > div i{
	position: absolute;
	top: 15px;
	left:20px;
}
#formation aside > div p{
	margin-bottom: 0;
}
#formation a.btn{
	background-color: #652583;
	color: white;
	padding: 1em;
	-webkit-border-radius: 6px 6px 6px 6px;
	border-radius: 6px 6px 6px 6px;
	-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.25);
	box-shadow: 0 0 10px 0 rgba(0,0,0,.25);
}
#formation a.btn:hover{
	background-color: #911B83;
}

@media screen and (min-width: 768px){
	#formation{
		flex-direction: row;
	}
	#formation main{
		width: 65%
	}
	#formation aside{
		width: 32%
	}
}