@font-face {
    font-family: "Flat";
    src: url('font/circula-medium.otf');
}
@font-face {
    font-family: "Flatt";
    src: url('font/NexaLight.otf');
}



html, body {
	margin: 0;
	padding: 0;
	height: 100%;
}
body {
font-family:Flat;
  border: 0;
  font-size: 1em;
  vertical-align: baseline;
  text-align:left;
  background:white;
}
a,a:hover,a:focus,a:visited {
  text-decoration: none;
}

img {
  border: 0 none;
  margin: 0;
}
a,img,*:hover,*:select,*:focus,*:visited {	
  border: 0 none;
  outline: 0 none;
}

#BlockHeader{
	padding:0;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	background:#F87217;
	text-align:center;
	position:absolute;
	top:50%;
    /* margin-top = -(height/2) */
    margin-top:-200px;
    height: 400px;
    line-height: 400px;
	}
header {
    background: #FAEBD7; /* rose très pale */
	margin:auto;
	color:black;
	min-height:100%;
	height:100%;
	width:100%;

	text-align:center;
	position: relative;
	height:632px;
    outline: 1px solid #ccc;
    position: relative;
}

.Title{
	margin:auto;
    line-height:1.2;
    display: inline-block;
    vertical-align: middle;
    /* Coucou IE */
    *display: inline;
    *zoom: 1;
}
.Name{font-size:4em;}
.SubName{font-size:2em;}
.Quote{position:absolute; bottom:100px ; left:0; right: 0; font-size:1.5em;}
.QuoteA{position:absolute; bottom:50px ; left:0; right: 0; font-size:1.5em;opacity:0.2;}
.Title img{margin-top:100px;}

#BlockNav{
	background: white;
	text-align:center;
	vertical-align:middle;
	margin:auto;
	min-height:10px;
	line-height:10px;
		z-index:1000;
}
nav {
	margin:auto;
	display:inline;
	color:black;
	width:600px;
	font-size:1.5em;
	z-index:1000;
}
nav ul { list-style:none; padding:0;}
nav ul li {margin:auto;display:inline;padding:0;padding-right:20px;padding-right:20px}
nav ul li a {color:black;}
nav ul li a:hover, #sticky_navigation ul li a.selected {color:black; border-bottom: 1px solid black;}

.navupR{float:right;margin-left:10%;height:10px;}
/* _________________________
Passage dans la page
_________________________ */
.BlockIn {width:800px;margin:auto;padding-top:30px;padding-bottom:80px;}
.BlockIn h1 {margin-bottom:0px;margin-left:-50px;font-size:3em;}
.BlockIn h2 {margin-top:0px;margin-bottom:-5px;margin-left:-50px;font-size:2em;}
.BlockIn h3 {margin-top:0px;font-size:1.5em}
.BlockIn p {margin-top:0px;font-size:1.5em}

#ResumeTimeline {
background:#363b48;
color:white;
}
#ResumeTimeline #table {width:100%;text-align:left;}
#ResumeTimeline .line {
	min-height:100px;
	background-image:url('img/verticalr.png'),url('img/rond.png');
	background-position:67px 0px,60px 10px;
	background-repeat:repeat-y,no-repeat;}

.TableYear{display:inline-block;min-width:100px;text-align:left;font-size:1.5em;vertical-align:middle;}
.TableStuff img{vertical-align:middle; margin-right:10px;}
.TableStuff{display:inline-block;min-width:340px;text-align:left;font-family:Flatt;vertical-align:middle}
#ResumeTimeline a span{
    position:absolute;
	text-align:justify;
	margin-top:10px;
    margin-left:30px;
	padding:20px;
	color:white;
	width:20%;
    background:rgba(0,0,0,.9);
    border-radius:3px;
    box-shadow:0 0 2px rgba(0,0,0,.5);
	display:none;
}
#ResumeTimeline a,#ResumeTimeline a:hover,#ResumeTimeline a:focus,#ResumeTimeline a:visited {
	color:white;
	text-decoration: none;
}

#ResumeTimeline a:hover span, a:focus span{
	display:block;
} 
.DownloadCV{min-height:150px;text-align:center;margin-top:50px;background-image:url('img/CVDown.png');background-repeat:no-repeat;background-position:center;font-size:1.2em;}
#ResumeSkills {
background:#F17C72;
color:white;
}

#ResumeSkills img{position:absolute;margin-left:-40px}

.toptop {background-color:#E95855;font-weight:bold;width:700px;padding:5px;margin:8px;z-index:0;}
.top {background-color:#E95855;font-weight:bold;width:500px;padding:5px;margin:8px;}
.moyen {background-color:#E95855;font-weight:bold;width:300px;padding:5px;margin:8px;}
.debutant {background-color:#E95855;font-weight:bold;width:100px;padding:5px;margin:8px;}
.debutant {background-color:#E95855;font-weight:bold;width:100px;padding:5px;margin:8px;}

#ResumeSkills .vert{margin-bottom:20px}

#Hobbies {
background:#32AC97;
color:white;
}
#Hobbies #tableH {width:100%;text-align:center;}
 .lineHob {}
 .cell {display:inline-block;width:265px;font-size:2.9em;vertical-align:middle;}


#Write {
background:#FDBC5E;
color:white;
}

#Write #ecrit img{float:left;vertical-align:middle; margin-right:30px;}
#Write #ecrit {height:128px;line-height:128px;text-align:left; }
  
#Write #ecrit .TitleT{width:500px; 
  vertical-align:middle;
  display:inline-block;
  font-size:1.7em;
  line-height:1.2; /* on rétablit le line-height */
  text-align:left; /* ... et l'alignement du texte */
}
#Write #ecrit .STT{font-size:0.8em;}


#Contact {
background:#efece7;
color:black;
}
.SM img{margin:15px 55px;}
form .NameEmail input{width:43%;padding:10px;margin:10px;background:#d9d0c1;border:0px;outline:none;}
form .NameEmail input:focus{background: #e8e0d2;}
form .FSubject input{width:91.5%;padding:10px;margin:10px;background:#d9d0c1;border:0px;outline:none;}
form .FSubject input:focus{background: #e8e0d2;}
form .FMessage textarea{width:91.5%;padding:10px;margin:10px;height:200px;background:#d9d0c1;border:0px;outline:none;}
form .FMessage textarea:focus{background: #e8e0d2;}
form .FSubmit input{width:94%;padding:10px;margin:10px;background:#d9d0c1;border:0px;outline:none;font-family: "Flat"; font-size:1.5em;}
form .FSubmit input:hover{background: #e8e0d2;}