#main_header {animation: header_anim 10s linear infinite; box-sizing: border-box; position: relative; min-height: calc(100% - 128px); padding: 64px 0px; border-bottom: 1px solid #ccc; background-image: url("../img/io.png"); box-shadow: 0px 0px 4px #777; text-align: center;}
	#main_header > h1 { font-size: 64px; color: red;}
	#main_header > p { font-size: 16px; color: #84bcb8;}
	#main_header > p.slogan #acc { margin-bottom: 10px; }
	#main_header > p.slogan { max-width: 600px; margin: 16px auto;}
		.samsung { font-size: 16px; padding: 10px; color: #92c4ce;}
	#main_header > div { display: block; width: 128px; height: 128px; margin: 64px auto 0px auto; background-color: #ccc; background-image: url(""); background-size: 128px 128px; box-shadow: 0px 0px 4px #333 inset;}
	#main_header > .cv { display: block; max-width: 300px; height: 64px; line-height: 64px; margin: 64px auto; border-bottom: 4px solid #c44; background-color: #c55; color: #fff; text-decoration: none;}
		#main_header > .cv .icon { display: inline-block; vertical-align: top; width: 64px; height: 64px; background-image: url("../img/cv.svg"); background-size: 42px 42px; background-position: 50% 50%; background-repeat: no-repeat;}
		#main_header > .cv .content { display: inline-block; vertical-align: top; box-sizing: border-box; width: calc(100% - 64px); height: 64px; border-left: 2px solid #c44; font-size: 16px;}
	#main_header > .git { display: block; max-width: 300px; height: 64px; line-height: 64px; margin: 64px auto; border-bottom: 4px solid #333; background-color: #333; color: #fff; text-decoration: none;}
		#main_header > .git .icon { display: inline-block; vertical-align: top; width: 64px; height: 64px; background-image: url("../img/social/git.svg"); background-size: 42px 42px; background-position: 50% 50%; background-repeat: no-repeat;}
		#main_header > .git .content { display: inline-block; vertical-align: top; box-sizing: border-box; width: calc(100% - 64px); height: 64px; border-left: 2px solid black; font-size: 16px;}
#main_nav { box-sizing: border-box; height: 128px; border-bottom: 1px solid #aaa; background-color: #e0e0e0;}
	#main_nav > a { display: inline-block; vertical-align: top; box-sizing: border-box; width: 24.59%; height: 128px; line-height: 128px; border-left: 1px solid #ccc; font-size: 20px; text-align: center; color: #333; text-decoration: none; transition: color 250ms ease;}
	#main_nav > a:hover { color: #c55;}
	#main_nav > a:first-child { border-left: none;}

section { padding: 32px 0px; text-align: center;}
	section > h2 { font-size: 42px;}

#skills_section { border-bottom: 1px solid #ccc;}
	#skills_section h2 { }
	#skills_section p { margin: 64px 0px; font-size: 16px;}
	#skills_section img { display: inline-block; vertical-align: top; width: 100px; margin: 20px; padding-bottom: 10px; border-bottom: 2px solid #ddd; cursor: pointer;}
	#skills_section img:hover { border-color: #c55;}

#bio_section {}
	#bio_section > #conference {}
		#bio_section > #conference > h3 { font-size: 25px; margin-bottom: 30px; }
		#bio_section > #conference > h4 { font-size: 20px; }
		#bio_section > #conference > h4:hover { color: #c55; }
		#bio_section > #conference > p { font-size: 16px; }
	#bio_section > #emploi {}
		#bio_section > #emploi > h3 { font-size: 25px; margin-bottom: 30px; }
		#bio_section > #emploi > h4 { font-size: 20px; }
		#bio_section > #emploi > h4:hover { color: #c55; }
		#bio_section > #emploi > p { font-size: 16px; }

#projects_section { border-bottom: 1px solid #ccc; background: #eee;}
	#projects_section > h2{ margin-bottom: 20px;}
	#projects_section > .project { max-width: 800px; height: 90px; margin: auto; border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; background-color: #fff; text-align: left;}
	#projects_section > .project:last-child { border-bottom: 1px solid #ccc;}
		#projects_section > .project > img { display: inline-block; vertical-align: top; box-sizing: border-box; width: 100px; height: 100%;border-bottom: 1px solid #ccc; border-right: 2px solid #ccc;}
		#projects_section > .project > div { display: inline-block; vertical-align: top; box-sizing: border-box; width: calc(100% - 200px); height: 100%; overflow: auto;}
			#projects_section > .project > div > p  { padding: 0px 10px;}
			#projects_section > .project > div > .title { margin-top: 8px; font-size: 16px;}
			#projects_section > .project > div > .technos { font-size: 12px; color: #777;}
			#projects_section > .project > div > .description { margin-top: 10px; font-size: 14px;}
		#projects_section > .project > a { display: inline-block; vertical-align: top; box-sizing: border-box; width: 100px; height: 100%; line-height: 100px; border-left: 1px solid #ccc; font-size: 16px; text-align: center; color: #333; text-decoration: none;}
		#projects_section > .project > a:hover { color: #c55;}

#contact_section { border-bottom: 1px solid #ccc; background: #fff;}
	#contact_section > form { max-width: 900px; margin: 20px auto 0px auto; padding: 0px 10px;}
		#contact_section > form > input { display: block; box-sizing: border-box; height: 40px; margin-bottom: 20px; padding: 0px; border: 1px solid #ccc; background-color: #eaeaea;}
		#contact_section > form > input[type=text] { width: 100%; padding: 0px 10px; background-image: url("../img/trav.png");}
		#contact_section > form > input[type=email] { width: 100%; padding: 0px 10px; background-image: url("../img/trav.png");}
		#contact_section > form > textarea { background-image: url("../img/trav.png"); background-position: center; background-size: 40%; display: block; box-sizing: border-box; width: 100%; min-height: 128px; margin-bottom: 20px; padding: 10px; border: 1px solid #ccc; background-color: #eaeaea; resize: vertical; font-size: 14px;}
		#contact_section > form > input[type=submit] { display: inline-block; vertical-align: top; width: calc(100% - 100px); margin-right: 20px; border: none; border-bottom: 4px solid #c44; cursor: pointer; background-color: #c55; color: #fff;}
		#contact_section > form > input[type=reset] { display: inline-block; vertical-align: top; width: 80px; border: none; border: 1px solid #ddd; border-bottom: 4px solid #ddd; cursor: pointer;}

#main_footer { background-color: #333; text-align: center;}
	#main_footer > p { color: #eee;}
	#main_footer > p.follow { padding: 20px 0px; font-size: 16px;}
	#main_footer > p.sign { padding: 20px 0px; font-size: 16px;}
	#main_footer > div {}
		#main_footer > div > a { display: inline-block; vertical-align: top; width: 64px; height: 64px; margin: 0px 20px;}
			#main_footer > div > a > img { width: 64px;}

.scrollup { width: 70px; height: 70px; position: fixed; bottom: 50px; right: 50px; display: none;  font-size: 20px; text-align: center; line-height: 37px; }
	.scrollup > img { width: 70px; height: 70px; }
	.scrollup > img:hover {  }

@keyframes header_anim
{
	from { background-position: 0px 0px}
	to { background-position: 300px 0px}
}

