/*///////////////////////////// media all //////////////////////////////*/


/*/////////////////////// zone info personelle /////////////////////////*/

.presentation-personelle{
	width:100%;
	background-color: #305577;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: #ffffff;
}

#info-contact{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width:70%;
}

.info-contact-box{
	width: 28%;
	height: auto;
	border-radius: 1em;
	margin: 1em;
}

#identite{
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.info-contact-box-photo{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#reseaux-sociaux{
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
}

.icon-reseaux{
	width: 4em;
	height: 4em;
}

#photo-profil{

	width: 10em;
	height: 10em;
	border-radius: 50%;
	background-image: url(img/photo-profil.jpg);
	background-size: cover;
	background-position: top;
}

/*/////////////////////// zone compétences /////////////////////////*/

.competences{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-size: content;
	background-position: center;
	background-image:url(img/3308.jpg);
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-origin: border-box;
}


#titre-competences{
	background-color: rgba(227, 226, 232, 0.8);
	padding: 0.75em;
	border-radius: 1.25em;
}

.competences-box{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.developpement{
	background-color: rgba(227, 226, 232, 0.8);
}

.systeme{
	background-color: rgba(227, 226, 232, 0.8);
}

.reseau{
	background-color: rgba(227, 226, 232, 0.8);
}

/*/////////////////////// zone experiences-professionelle /////////////////////////*/

.experiences-professionelle{
	width:100%;
	background-color: #305577;
	color: #ffffff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.marge{
	margin-left: 1em;
	margin-right: 1em;
}

/*/////////////////////// zone formation /////////////////////////*/

.formations{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-size: cover;
	background-position: center;
	background-image:url(img/Campus-Eiffel.jpg);
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-origin: border-box;
}

#titre-formations{
	background-color: rgba(227, 226, 232, 0.8);
	padding: 0.75em;
	border-radius: 1.25em;
	margin:1em;
}

.formations-box{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}

.logo-formations-box{
	text-align: center;
}

/*/////////////////////// commun /////////////////////////*/

body{
	margin: 0;

}

.titre{
	text-align: center;
	margin: 1em; 
}

.box{
	width: 20%;
	height: auto;
	border-radius: 1em;
	margin: 2em;
	padding: 2em;
	background-color: rgba(227, 226, 232, 0.8);

}

.logo{
	width: 10em;
	//max-width: 
	height: 10em;
	border-radius: 10%;
}

h1{
	text-align: center;
	font-size: 3em;
}

h2{
	text-align: center;
	font-size: 2em;
}

h4{
	text-align: center;
	font-size: 1.5em;
}

p{
	font-size: 1em;
}

/*/////////////////////// media mobile /////////////////////////*/

@media screen and (max-width: 640px) and (orientation: portrait){

	/*/////////////////////// zone info personelle /////////////////////////*/

	.presentation-personelle{
		width:100%;
		background-color: #305577;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: #ffffff;
	}

	#info-contact{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		
		
	}

	.info-contact-box{
		width: 100%;
		height: auto;
		border-radius: 1em;
		margin: 1em;
	}

	#identite{
		display: flex;
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}

	#reseaux-sociaux{
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
	}

	/*/////////////////////// zone compétences /////////////////////////*/

	.competences{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background-color: rgba(227, 226, 232, 0.8);
	}

	/*/////////////////////// zone formation /////////////////////////*/

	

	/*/////////////////////// commun /////////////////////////*/

	.box{
		width: 100%;
		height: auto;
		padding: 1em;
		background-color: rgba(227, 226, 232, 0.8);
	}

/*/////////////////////// media print /////////////////////////*/

@media print {

	/*display: none;*/

	#titre-competences{
		border-radius: 0;
	}

	.box{
		width: 6cm;
		height: auto;
		border-radius: 0.5cm;
		margin: 0.5cm;
		padding: 0.25cm;
		background-color: rgba(227, 226, 232, 0.8);
	}

	.competences{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center; 

	h1{
		font-size: 24pt;
	}

	h2{
		font-size: 18pt;
	}

	h4{
		text-align: center;
		font-size: 14pt;
	}

	p{
		font-size: 12pt;
	}

}