h1,h2,h3,p,a,ul,li{
margin: 0;
padding: 0;
text-decoration: none;
}

body{
margin: 0;
/* font-family: sans-serif;   Verdana;*/
font-family: 'Verdana';
font-size: 13px;
}
header{
background: #F2F2F2;
height: 110px;
border-bottom: 1px solid #c0c0c0;
margin: 0 0 20px 0;
}
section{
min-height: 653px;
/* padding: 20px 0 0 0; */
}
.conteneur{
width: 1300px;
margin: 0 auto;

/*background: #ff65f3;*/
}
.clear{
clear: both;
}
/********* Menu Nav ********/
nav{
width: 1000px;
 
/*background: #f98f32;*/
height: 30px;
margin-left:20%;
}
nav   a{
line-height: 30px;
color: #000000;
float: left;
padding: 0 35px;
border: 1px solid;
border-radius:10px;
border-color:#afaeae;
}
nav   a:hover{
color: #ffffff;
background: #8daab7;
border-radius: 10px;
-webkit-transition: padding .2s;
-moz-transition: padding .2s;
-o-transition: padding .2s;
-ms-transition: padding .2s;
transition: padding .2s;
/* font-weight: bold; */
}
/********* Menu Nav ********/
/******** Haut Gauche ********/
.haut-gauche{
/* float: left; */
 margin:0 auto;
width: 700px;
height: 75px;
}
.haut-gauche   h1{
color: #000000;
font-size: 25px;
margin: 10px 0 0 55px;
text-shadow: 1px 1px 1px;
}
.haut-gauche   h2{
margin: 5px 0 0 0;
font-size: 15px;
letter-spacing: 3px;
}
.haut-gauche   h2   span{
color: #8daab7;
}
/******** Haut Gauche ********/
/******** Haut Droit ********/
.haut-droit{
float: left;
width: 300px;
height: 75px;
/*background: #98ff98;*/
}
.haut-droit a{
color: #8daab7;
display: block;
text-align: right;
/* border: 1px solid; */
}
.haut-droit    a:first-child{
margin: 10px 0 0 0;
}
.haut-droit   a:hover{
text-decoration: underline;
}
/******** Haut Droit ********/
/******** milieu-gauche ******/
.milieu-gauche{
float: left;
width: 800px;
/*background: #f12f65;*/
}
.milieu-gauche  h1{
color: #8daab7;
margin: 0 0 7px 0;
}
.milieu-gauche  .fiche{
float: left;
margin: 0 7px 0 0;
}
.milieu-gauche  .graphique{
margin: 20px 0 0 150px;
}
.milieu-gauche  ul  li{
list-style-type: none;
/* none, circle, square, disc */
background: url(img/fleche.jpg) left center no-repeat;
padding: 0 0 0 30px;
margin: 10px 0;
}
.milieu-droit{
float: right;
width: 500px;
/*margin-top: 100px; */
/*background: #3298ff;*/
}
.italic{
font-style: italic;
}
/****** Milieu Centre (a la place de milieu gauche) ********/
.milieu-centre{
	width:50%; margin:0 auto;
	
	/*background: #f12f65;*/
	}
	.milieu-centre  h1{
	color: #8daab7;
	margin: 0 0 7px 0;
	margin-top: 70px;
	}
	.milieu-centre  .fiche{
	float: left;
	margin: 0 7px 0 0;
	}
	.milieu-centre  .graphique{
	margin: 20px 0 0 150px;
	}
	.milieu-centre  ul  li{
	list-style-type: none;
	/* none, circle, square, disc */
	background: url(img/fleche.jpg) left center no-repeat;
	padding: 0 0 0 30px;
	margin: 10px 0;
	}
	
	.italic{
	font-style: italic;
	}


/****** Milieu Droit *******/
.milieu-droit   .cadre{
border: 1px solid #c0c0c0;
border-radius: 10px;
width: 300px;
float: right;
margin: 15px 0;
}
.milieu-droit   .cadre  h2{
color: #333333;
font-size: 15px;
text-align: center;
padding: 5px 10px;
background: #f2f3f3;
border-bottom: 1px solid #c0c0c0;
border-radius: 10px 10px 0 0;
}
.milieu-droit   .cadre  p{
padding: 10px;
}
.milieu-droit   .cadre  ul  li{
margin: 10px 0 0 30px;
}
/****** Milieu Droit *******/
footer{ /* zone du bas */
background: #F2F2F2; /* fond */
height: 70px; /* hauteur */
border-top: 1px solid #c0c0c0; /* bordure en haut */
margin: 20px 0 0 0; /* marge du dessus */
text-align: center; /* centrer le texte */
padding: 20px 0 0 0; /* marge intérieur */
}
footer  a{ /* lien du footer */
color: #8daab7; /* couleur */
}
footer  a:hover{ /* en cas de survol */
text-decoration: underline; /* soulignement */
}
footer  p{
margin: 7px 0 0 0; /* marge */
}

/********* Menu Nav ********/
nav{
	width: 1000px;
	height: 30px;
	margin-left: 20%;
	}
	nav   a{
	line-height: 30px;
	color: #000000;
	float: left;
	padding: 0 35px;
	}
	nav   a:hover{
	color: #ffffff;
	background: #8daab7;
	border-radius: 10px;
	-webkit-transition: padding .2s;
	-moz-transition: padding .2s;
	-o-transition: padding .2s;
	-ms-transition: padding .2s;
	transition: padding .2s;
	/* font-weight: bold; */
	}



/****** Mes Projets *******/
.mesprojets-milieu-haut{
/*background: #ff5412;*/
text-align: justify;
}
.mesprojets-milieu-haut  h2{
margin: 0 0 20px 0;
color: #8daab7;
}
.mesprojets-milieu-bas{
/*background: #336663;*/
}
#mesprojets  h2{  }
/****** Mes Projets *******/
.mesprojets-milieu-bas  h2{
margin: 50px 0 20px 0;
color: #8daab7;
}
/****** Mes Projets *******/
/****** CV *******/
.cv-gauche{
float: left;
/*background: #ff2123;*/
width: 200px;
}
.cv-gauche  ul  li{
list-style-type: none;
margin: 10px 0;
background: url(img/fleche2.png) left center no-repeat;
padding: 0 0 0 39px;
}
.cv-gauche  ul  li  a{
color: #8daab7;
font-weight: bold;
}
.cv-gauche  ul  li  a:hover{
color: #000000;
}
.cv-droit{
float: left;
/*background: #ff8792;*/
width: 800px;
}
#slide{
width: 700px; /* largeur */
height: 500px; /* hauteur */
position: relative; /* postionnement */
overflow: hidden; /*ascenceur */
}
#defilement{
width: 700px; /* largeur */
position: absolute; /* postionnement */
top: 0px; /* 0px du haut */
left: 0px; /* 0px de la gauche */
-moz-transition: all 0.9s; /* transition Firefox */
-webkit-transition: all 0.9s; /* transition  Chrome & Safari */
-ms-transition: all 0.9s; /* transition IE */
-o-transition: all 0.9s; /* transition Opéra */
}
article{ width: 700px; }
.competences-slide{ position: absolute; left: 700px; }
.activite-slide{ position: absolute; top: 0px; left: 1400px; } /* décalage */
.experience-slide{ position: absolute; top: 0px; left: 2100px; } /* décalage */
.logiciel-slide{ position: absolute; top: 0px; left: 2800px; } /* décalage */
.langues-slide{ position: absolute; top: 0px; left: 3500px; } /* décalage */
.loisirs-slide{ position: absolute; top: 0px; left: 4200px; } /* décalage */
#competences:target  #defilement{ left: -700px; } /* rétablie la position afin que le texte s'affiche */
#activite:target  #defilement{ left: -1400px; } /* rétablie la position afin que le texte s'affiche */
#experience:target  #defilement{ left: -2100px; } /* rétablie la position afin que le texte s'affiche */
#logiciel:target  #defilement{ left: -2800px; } /* rétablie la position afin que le texte s'affiche */
#langues:target  #defilement{ left: -3500px; } /* rétablie la position afin que le texte s'affiche */
#loisirs:target  #defilement{ left: -4200px; } /* rétablie la position afin que le texte s'affiche */

.github{
	/**font-size: 18px;
	text-decoration: underline;**/
}
.git{
	/**font-size: 18px;**/
	text-decoration: none;
}

textarea{
	width: 670px; 
	height: 573px;
}

.commentaires{
	font-size: 17px;
	width: 550px;
	height: 500px;
	overflow-y: scroll;
	scrollbar-color: rebeccapurple green;
	scrollbar-width: thin;
}
.marge{
	height:80px;
}
.lien{
	text-decoration-color: rgb(0, 102, 204)
}
li:hover {
	color: green;
	font-weight:600;
  }
.haut-gauche :hover{
	transform: rotateY(60deg);
	color: darkturquoise;
}
pre{
	overflow-y: scroll;
	scrollbar-color: rebeccapurple green;
	scrollbar-width: thin;
	width: 600px;
	height: 500px;
	background-color: rgb(229, 236, 234);
}