.header {
	display: flex;
	position: relative;
	z-index: 2;
	padding: 20px 0;

	}


.logo {
	display: flex;
	flex: 1;

	}

.Bandeau {
	display: flex;
	flex: 1;
	justify-content: center; /*alignement*/

	}

.Bandeau button {
	border: none;
	margin-left: 4%;
	font-size: 20px;
	background-color: white;
	}

.main .backimage img { 
	
	opacity: 0.3;
	z-index: 1;
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
	}
	
.main {
	position: relative;
    height: 800px; 
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: helvetica;
    color: #222 ; 
    
	}

.BlocGauche {
	position: relative;
	z-index: 2;
	margin-bottom:200px;
	}


.logo img {
	float: left;
	width:70px;
	margin-left :50px;
	}

.bandeau button:hover {
	border-bottom: solid;
	}

.icone img {
	width: 20px;
	height: 20px;
	top: 15px;
	position: relative;
	margin-right: 15px;

	}
.main .BlocGauche .icone {
	display: flex;
	flex: 1;
	}

.social img {
	width: 15%;
	top: 30px;
	position: relative;
	margin-left: 10px;

	}	




.main .BlocGauche .Titre {
	font-size: 70px;
	font-weight: bold;
	font-family: Roboto;


	}
.main .BlocGauche .SousTitre {
	font-size: 40px;
	font-weight: bold;
	font-family: Roboto;

	}

.bonjour  {
	
    width: 110px;
    background-color: #0bceaf;
    color: white;
    border: 1px solid #0bceaf;
    border-radius: 20px ;
    border-bottom-left-radius: 0% ;
    height :25px;
    padding-top: 10px;
    margin-bottom: 6px;
    opacity:0.7;
    font-size: 14px;
    margin-left:0px;
    margin-top:100px;
    letter-spacing: 1px;
	}
   
.bonjour p {
	margin-top:0px;
	padding-left:20px ;
	}

.container {
    width: 90%;
    margin: 0 auto;
	}

.hero {
	
    position: absolute;
    top: 50%;
    left: 80%;
    transform: translate(-50%, -50%); /*Centrer l'image*/
    opacity:0.8;
	}

.hero1 img { 
	height:300px;
	width:300px;
 	}
.cercle1 {
	border: 20px solid rgba(212,212,212,1);
	width:300px;
	height:300px;
	border-radius: 50%;
	background: rgba(238,238,238,0.02);
	}
.cercle2 {
	border: 20px solid rgba(207,207,207,0.05);
	width:340px;
	height:340px;
	border-radius: 50%;
	background: rgba(0,0,0,0.07);
	}

.imagedessin img {
	width:40%;
	top: 30px;
	position: relative;
	margin-left: 10px;
	}


.BlocBasDroit {
	float : right;
	position: relative;
	bottom : 350px;
	font-family: helvetica;
    color: #222 ;
	}

a {
	text-decoration: none;
	color: black;
	}	

.cv-btn {
    display: inline-block;
    margin-top: 40px;
    padding: 10px 20px;
    background-color: #0bceaf;
    color: white;
    text-decoration: none;
    border-radius: 15px;
	}

h2 {
	font-size: 40px;
	font-weight: bold;
	font-family: Roboto;
	}

.skills button {
	
	background-color: white; /* Couleur intérieure blanche */
    border: 1px solid #0bceaf;
    margin-left: 4%;
    margin-bottom: 3%;
    height :30px;
    border-radius: 5px ;
    margin-top: 3%;

	}