/*-----------------------MISE EN PAGE ELEMENTS-----------------------*/

body{
	margin: 0px;
	margin-top: 12px;
	margin-bottom: 60px;
	background: linear-gradient(#9cc916, 35%, #4A9134);
}


.logo{
	opacity: 1;
	transition-duration: 0.2s;
	margin-left: 15px;
	margin-right: 15px;
}


.logo:hover{
	opacity: 0.5;
}


/*-----------------------CV-----------------------*/

#cv{
	display: flex;
	animation: fadeIn ease 0.5s;
	-webkit-animation: fadeIn ease 0.5s;
	-moz-animation: fadeIn ease 0.5s;
	-o-animation: fadeIn ease 0.5s;
	-ms-animation: fadeIn ease 0.5s;
}


/*-----------------------COLONNE DE GAUCHE-----------------------*/

#colonne-gauche{
	text-align: center;
	background: linear-gradient(#778500, 20%, #4A9134);
	box-shadow: 10px 5px 5px black;
	border-radius: 30px;
	margin-left: 20px;
	margin-bottom: 200px;
	width: 40%;
	float: left;
}


/*-----------------------NOM ET PHOTO-----------------------*/

#nom-photo{
	height: 290px;
	margin-bottom: 30px;
}


#nom-photo h1{
	font-size: 26px;
	color: white;
	margin-top: 10px;
	margin-bottom: 10px;
}


#nom-photo .photo{
	border-radius: 30px;
	border: 2px solid;
	opacity: 1;
	transition:0.2s;
	width: 250px;
	height: 260px;
}


#nom-photo .photo:hover{
	transform: rotate(8deg);
	border-radius: 30px;
	opacity: 0.6;
}


/*-----------------------ADRESSE-----------------------*/

#adresse{
	display: flex;
	margin-bottom: 20px;
}


#adresse p{
	font-size: 16px;
	font-weight: bold;
	color: white;
	margin-top: 20px;
}


/*-----------------------NAISSANCE-----------------------*/

#naissance{
	display: flex;
	margin-bottom: 20px;
}

#naissance p{
	font-size: 16px;
	font-weight: bold;
	color: white;
	margin-top: 20px;
}


/*-----------------------ADRESSE MAIL-----------------------*/

#email{
	display: flex;
	margin-bottom: 20px;
}


#email p{
	font-size: 16px;
	font-weight: bold;
	color: white;
	margin-top: 15px;
}


/*-----------------------TELEPHONE-----------------------*/

#telephone{
	display: flex;
	margin-bottom: 20px;
}


#telephone p{
	font-size: 16px;
	font-weight: bold;
	color: white;
	margin-top: 15px;
}


/*-----------------------PERMIS-----------------------*/

#permis{
	display: flex;
	margin-bottom: 20px;
}


#permis p{
	font-size: 16px;
	font-weight: bold;
	color: white;
	margin-top: 8px;
}


/*-----------------------LINKEDIN-----------------------*/

#linkedin{
	display: flex;
	margin-bottom: 50px;
}


#linkedin p{
	font-size: 16px;
	font-weight: bold;
	color: white;
	margin-top: 15px;
}


/*-----------------------COMPETENCES-----------------------*/

#competences{
	margin-top: 40px;
	text-align: left;
	color: white;
}


#competences .section{
	width: 95%;
}


#competences h1{
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	font-size: 18px;
	font-weight: bold;
	text-decoration: underline;
	color: #750000;
}


#competences p{
	margin-left: 20px;
	font-size: 17px;
}


#competences .infos{
	font-style: italic;
	font-weight: bold;
	color: orange;
}


/*-----------------------TABLEAU LANGAGES-----------------------*/

#tableau-langages table{
	width: 90%;
	margin-top: 20px;
	margin-left:auto; 
    margin-right:auto;
}


#tableau-langages th{
	text-align: center;
}


#tableau-langages table, th, td{
	border: 1px solid black;
}


#tableau-langages .algo{
	width: 35%;
}


#tableau-langages .stat{
	width: 25%;
}


#tableau-langages .web{
	width: 40%;
}


/*-----------------------DOWNLOAD PDF-----------------------*/

#download{
	margin-top: 30px;
	margin-bottom: 30px;
}


#download .logo{
	-webkit-transition: .0.5s ease-in-out;
	transition: .0.5s ease-in-out;
}


#download .logo:hover{
	opacity: 0.5;
}


/*-----------------------COLONNE DE DROITE-----------------------*/

#colonne-droite{
	width: 65%;
	margin-bottom: 200px;
}


/*-----------------------FORMATION-----------------------*/

#formation h1{
	margin-left: 20px;
	margin-bottom: 50px;
	text-align: center;
	font-size: 22px;
	color: yellow;
}


#formation p{
	margin-top: 10px;
	margin-left: 20px;
}


#formation .blue-italic{
	font-style: italic;
	font-weight: bold;
	color: #0183fe;
}


#formation .date{
	font-size: 20px;
	font-weight: bold;
}


#formation .mention{
	color: purple;
	font-weight: bold;
}


/*-----------------------EXPERIENCES-----------------------*/

#experiences{
	margin-top: 100px;
}


#experiences .fleche-chronologique{
	width: 25px;
}


#experiences .date{
	color: purple;
	font-size: 28px;
	font-weight: bold;
	margin-left: -10px;
}


#experiences .poste{
	color: #fcba03;
	font-size: 24px;
	font-weight: bold;
	margin-left: -10px;
}


#experiences p{
	color: white;
	margin-left: 30px;
}


#experiences .acquis-pro{
	font-weight: bold;
	text-decoration: underline;
}


#experiences .ville{
	font-weight: bold;
	color: black;
	font-size: 22px;
}


#experiences .eplj-juillet-2021{
	display: flex;
	margin-bottom: 0px;
	margin-left: 30px;
}


#experiences .mcdo-ete-2022{
	display: flex;
	margin-bottom: 0px;
	margin-left: 30px;
}


#experiences .ecobes-avril-2023{
	display: flex;
	margin-bottom: 0px;
	margin-left: 30px;
}


#experiences .maif-alternance{
	display: flex;
	margin-bottom: 0px;
	margin-left: 30px;
}


#experiences .lisi{
	display: flex;
	margin-bottom: 0px;
	margin-left: 30px;
}

/*-----------------------INTERETS-----------------------*/

#interets{
	margin-top: 100px;
	color: white;
}


#interets h1{
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 20px;
	font-size: 18px;
	font-weight: bold;
	text-decoration: underline;
	color: #750000;
}


#interets p{
	margin-left: 40px;
	font-size: 17px;
}


#interets .infos{
	font-style: italic;
	font-weight: bold;
	color: orange;
}