/* --- DÃ©but > Navigation haut de page --- */
ul#quick-nav
{
	background-color: black;
	color: white;
	left: 0;
	line-height: 1.6em;
	list-style: none;
	margin: 0;
	padding-left: 1%;
	position:absolute;
	height: 1.7em;
	top: 0;
	width: 99%;
}
ul#quick-nav li
{
	float: left;
	margin-right: 5px;
}
ul#quick-nav li a
{
	color: white;
	text-decoration:none;
}
/* --- Fin > Navigation haut de page --- */
/* --- DÃ©but > Conteneur global page --- */
#wrapper
{
	background: #2d2d2d url("images/bg_top.png") repeat-x 0px 22px;
	width: 100%;
}

/* --- Logo --- */
#wrapper h1
{
	float:left;
	margin:1em 1em 0;
}
#wrapper h1 a
{
	background: transparent url("images/logo_julien_dubois.fr.png") no-repeat 0px 0px;
	display:block;
	height: 76px;
	outline: none;
	text-indent: -5000px;
	width: 329px;
}

#wrapper #last_tweet 
{
	color: white;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:18px;
	font-style:italic;
	padding-top:32px;
	width: 84%;
}

#wrapper #last_tweet small
{
	font-style:normal;
}

#wrapper #content
{
	background-color: #f8f5ee;
	clear:both;
	margin: auto;
	padding: 1em;
	position:relative;
	width: 900px;
	overflow: auto;
}
/* --- Fin > Conteneur global page --- */
/* --- DÃ©but > Infos contact --- */
#wrapper #content #contact
{
	height: 133px;
	position: relative;
}
#wrapper #content #contact img#photo-julien
{
	float: left;
	height: 133px;
	margin-right: 2em;
	width: 129px;
}
#wrapper #content #contact #infos-contact
{
	background-color: #d20e0e;
	color: white;
	left: 145px;
	position:absolute;
	width: 397px;
}
#wrapper #content #contact #infos-contact #top-contact
{
	background: transparent url("images/top_contact.png") no-repeat 0px 0px;
	height: 6px;
	width: 397px;
}
#wrapper #content #contact #infos-contact ul
{
	line-height: 1.6em;
	list-style: none;
	margin: 0.4em 1em;
}
#wrapper #content #contact #infos-contact ul#first-part
{
	background: transparent url("images/separateur_vertical.png") no-repeat 160px 7px;
	margin-left: 1em;
}
#wrapper #content #contact #infos-contact ul#first-part li#name
{
	background: transparent url("images/picto_name.png") no-repeat 0px 3px;
	padding-left: 18px;
}
#wrapper #content #contact #infos-contact ul#first-part li#age
{
	background: transparent url("images/picto_age.png") no-repeat 0px 3px;
	padding-left: 18px;
}
#wrapper #content #contact #infos-contact ul#first-part li#status
{
	background: transparent url("images/picto_couple.png") no-repeat 0px 3px;
	padding-left: 18px;
}
#wrapper #content #contact #infos-contact ul#second-part
{
	position:absolute;
	left: 150px;
	margin: 0.9em 0em 0em 3em;
	top: 0px;
	height: 100px;
}
#wrapper #content #contact #infos-contact ul#second-part li#email
{
	background: transparent url("images/email_juliendubois.png") no-repeat 0px 5px;
	height: 20px;
	text-indent: -5000px;
	width: 191px;
}
#wrapper #content #contact #infos-contact ul#second-part li#address
{
	background: transparent url("images/picto_address.png") no-repeat 0px 3px;
	padding-left: 18px;
}
#wrapper #content #contact #infos-contact ul#second-part li#phone
{
	background: transparent url("images/picto_phone.png") no-repeat 4px 3px;
	padding-left: 18px;
}
#wrapper #content #contact #infos-contact #bottom-contact
{
	background: transparent url("images/bottom_contact.png") no-repeat 0px 0px;
	height: 7px;
	width: 397px;
}
#wrapper #content #contact #profils-socials
{
	margin-left:560px;
	padding-top:20px;
	vertical-align:middle;
}
#wrapper #content #contact #profils-socials p
{
	margin: 0px;
}
#wrapper #content #contact #profils-socials span
{
	background: transparent url("images/picto_reseaux.png") no-repeat 0px 1px;
	float:left;
	margin-right: 10px;
	padding-left: 20px;
}
#wrapper #content #contact #profils-socials a#social-linkedin
{
	background: transparent url("images/btn_linked_in.png") no-repeat 0px 2px;
	display: block;
	float: left;
	height: 16px;
	margin-right: 10px;
	outline: none;
	text-indent: -5000px;
	width: 48px;
}
#wrapper #content #contact #profils-socials a#social-viadeo
{
	background: transparent url("images/btn_viadeo.png") no-repeat 0px 2px;
	display: block;
	float: left;
	height: 16px;
	margin-right: 10px;
	outline: none;
	text-indent: -5000px;
	width: 47px;
}
#wrapper #content #contact #profils-socials a#social-flickr
{
	background: transparent url("images/btn_flickr.png") no-repeat 0px 2px;
	display: block;
	float: left;
	height: 16px;
	margin-right: 10px;
	outline: none;
	text-indent: -5000px;
	width: 36px;
}
/* --- Fin > Infos contact --- */
/* --- DÃ©but > Twitter --- */
#wrapper #content #twitter
{
	position: absolute;
	left: 570px;
	top: 1em;
	width: 243px;
}
#wrapper #content #twitter blockquote
{
	background-color: #48b8de;
	color: white;
	margin: 0;
}
#wrapper #content #twitter blockquote #top-twitter
{
	background: #F8F5EE url("images/top_twitter.png") no-repeat 0px 0px;
	height: 6px;
	width: 243px;
}
#wrapper #content #twitter blockquote p
{
	font-size:0.9em;
	height:65px;
	margin:0 0.2em 0 0.3em;
}
#wrapper #content #twitter blockquote p small
{
	background: transparent url("images/picto_fleche.png") no-repeat 0px 5px;
	color: black;
	font-size: 1em;
	left: 0px;
	padding-left: 10px;
	position:absolute;
	top: 78px;
}
#wrapper #content #twitter blockquote #bottom-twitter
{
	background: #F8F5EE url("images/bottom_twitter.png") no-repeat 0px 0px;
	height: 6px;
	width: 243px;
}
#wrapper #content #twitter a#follow-me
{
	background: transparent url("images/bg_follow_me.png") no-repeat 0px 0px;
	color: white;
	display: block;
	font-size:0.9em;
	height: 32px;
	left: 138px;
	outline: none;
	padding-right: 14px;
	position: absolute;
	text-align:center;
	text-decoration: none;
	top: 61px;
	width: 86px;
}
#wrapper #content #twitter #twitter-bird
{
	background: transparent url("images/logo_twitter.png") no-repeat 0px 0px;
	position: absolute;
	height: 57px;
	left: 241px;
	top: 62px;
	width: 60px;
}
/* --- Fin > Twitter --- */
/* --- DÃ©but > PrÃ©sentation --- */
#wrapper #content #presentation
{
	position: relative;
}
/* --- DÃ©but > Message bienvenue --- */
#wrapper #content #presentation #welcome-message
{
	margin-top: 1em;
}
#wrapper #content #presentation #welcome-message #top-message
{
	background: transparent url("images/top_message.png") no-repeat 0px 0px;
	height: 6px;
	width: 306px;
}
#wrapper #content #presentation #welcome-message p
{
	background: #eafb8c url("images/picto_info.png") no-repeat 8px 2px;
	margin: 0px;
	padding: 0 8px;
	text-indent: 18px;
	width: 290px;
}
#wrapper #content #presentation #welcome-message #bottom-message
{
	background: transparent url("images/bottom_message.png") no-repeat 0px 0px;
	height: 6px;
	width: 306px;
}
/* --- Fin > Message bienvenue --- */
/* --- DÃ©but > Situation actuelle --- */
#wrapper #content #presentation #situation
{
	height: 16px;
	position: absolute;
	left: 320px;
	top: 0px;
}
#wrapper #content #presentation #situation #title-situation
{
	z-index: 10;
}
#wrapper #content #presentation #situation #title-situation #left-title
{
	background: #abc516 url("images/left_situation.png") no-repeat 0px 0px;
	float: left;
	height: 20px;
	width: 6px;
}
#wrapper #content #presentation #situation #title-situation h3
{
	background-color: #abc516;
	color: white;
	display: inline;
	float: left;
	font-size: 1.1em;
	font-weight: normal;
	height: 20px;
	margin:	0px;
}
#wrapper #content #presentation #situation #title-situation #right-title
{
	background: #abc516 url("images/right_situation.png") no-repeat 0px 0px;
	float: left;
	height: 20px;
	width: 6px;
}
#wrapper #content #presentation #situation #content-situation
{
	color: black;
	position: absolute;
	top: 16px;
	width: 270px;
	z-index: 20;
}
#wrapper #content #presentation #situation #content-situation #top-content-situation
{
	background: transparent url("images/top_situation.png") no-repeat 0px 0px;
	height: 5px;
	width: 270px;
}
#wrapper #content #presentation #situation #content-situation p
{
	background-color: #eafb8c;
	margin: 0px;
	padding: 2px 10px;
}
#wrapper #content #presentation #situation #content-situation #bottom-content-situation
{
	background: transparent url("images/bottom_situation.png") no-repeat 0px 0px;
	height: 5px;
	width: 270px;
}
/* --- Fin > Situation actuelle --- */
#wrapper #content #presentation a#btn-contact
{
	background: transparent url("images/btn_me_contacter.png") no-repeat 0px 0px;
	color: white;
	display: block;
	left: 600px;
	line-height: 47px;
	height: 51px;
	outline: none;
	position: absolute;
	text-decoration: none;
	text-indent: 34px;
	top: 13px;
	width: 117px;
}
#wrapper #content #presentation a#btn-cv
{
	background: transparent url("images/btn_telecharger_cv.png") no-repeat 0px 0px;
	color: white;
	display: block;
	left: 727px;
	line-height: 16px;
	height: 50px;
	outline: none;
	padding: 8px 0px 0px 44px;
	position: absolute;
	text-align: center;
	text-decoration: none;
	top: 13px;
	width: 91px;
}
/* --- Fin > PrÃ©sentation --- */

/* --- Début > Drupal Blog --- */
#wrapper #content #cv #btn_drupal_blog
{
	background: transparent url("images/btn_drupal_blog.png") 0px 0px no-repeat;
	color: white;
	display:block;
	height: 41px;
	line-height: 37px;
	margin: 1em auto;
	text-indent: 39px;
	width: 223px;
}
/* --- Fin > Drupal Blog --- */

/* --- DÃ©but > CV --- */
#wrapper #content #cv
{
	float:left;
	width: 73%;
}
/* --- DÃ©but > Section CV --- */
#wrapper #content #cv .part
{
	margin: 1em 0em;
	position: relative;
}
#wrapper #content #cv #scolarite
{
}
#wrapper #content #cv #experience
{
	top: 80px;
}
#wrapper #content #cv #technologie
{
	top: 535px;
}
#wrapper #content #cv #extra
{
	top: 875px;
}

#wrapper #content #cv .part .title-part
{
	height: 30px;
	z-index: 10;
}
#wrapper #content #cv .part .title-part .left-title
{
	background: #ffae00 url("images/left_part.png") no-repeat 0px 0px;
	float: left;
	height: 20px;
	width: 6px;
}
#wrapper #content #cv .part .title-part h3
{
	background-color: #ffae00;
	color: white;
	display: inline;
	float: left;
	font-size: 1.1em;
	font-weight: normal;
	height: 20px;
	margin:	0px;
}
#wrapper #content #cv .part .title-part .right-title
{
	background: #ffae00 url("images/right_part.png") no-repeat 0px 0px;
	float: left;
	height: 20px;
	width: 6px;
}
#wrapper #content #cv .part .content-part
{
	color: #835f0f;
	position: absolute;
	top: 17px;
	z-index: 20;
}
#wrapper #content #cv .part .content-part .top-content-part
{
	background: transparent url("images/top_part.png") no-repeat 0px 0px;
	height: 6px;
	width: 591px;
}
#wrapper #content #cv .part .content-part dl
{
	background-color: #f9e4b6;
	margin: 0px;
	padding-top:0.5em;
	width: 591px;
}
#wrapper #content #cv .part .content-part dl dt
{
	background-color: #ffae00;
	color: white;
	font-size: 1.1em;
	padding-left: 1em;
}
#wrapper #content #cv .part .content-part dl dd
{
	margin-left: 0px;
}
#wrapper #content #cv .part .content-part dl dd#list-languages dl
{
	position: relative;
	height: 80px;
}
#wrapper #content #cv .part .content-part dl dd#list-cms dl
{
	position: relative;
	height: 80px;
}
#wrapper #content #cv .part .content-part dl dd#list-competences ul
{
	line-height: 1.4em;
	padding: 0.5em 0em 0em 0em;
}
#wrapper #content #cv .part .content-part dl dd dl dt
{
	background-color: transparent;
	color: #835f0f;
	float: left;
	font-size: 1em;
	font-weight: bold;
	margin-left: 2em;
	width: 22%;
}
#wrapper #content #cv .part .content-part dl dd#list-languages dl dt
{
	height: 25px;
	text-indent: 17px;
}
#wrapper #content #cv .part .content-part dl dd#list-cms dl dt
{
	height: 23px;
	line-height: 23px;
	text-indent: 17px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#php
{
	background: transparent url("images/picto_php.png") no-repeat 4px 1px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#html
{
	background: transparent url("images/picto_html.png") no-repeat 1px 1px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#actionscript
{
	background: transparent url("images/picto_actionscript.png") no-repeat 0px 1px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#javascript
{
	background: transparent url("images/picto_jquery.png") no-repeat 0px 1px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#sql
{
	background: transparent url("images/picto_sql.png") no-repeat 1px 1px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#drupal
{
	background: transparent url("images/picto_drupal.png") no-repeat 1px 1px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#ez
{
	background: transparent url("images/picto_ez.png") no-repeat 1px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#wp
{
	background: transparent url("images/picto_wp.png") no-repeat 1px 3px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#spip
{
	background: transparent url("images/picto_spip.png") no-repeat 1px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#cms-ms
{
	background: transparent url("images/picto_cmsms.png") no-repeat 1px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dt#magento
{
	background: transparent url("images/picto_magento.png") no-repeat 1px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dd
{
	float:left;
	height: 16px;
	line-height: 16px;
	margin-right: 3em;
	text-indent: -5000px;
	width: 84px;
}
#wrapper #content #cv .part .content-part dl dd dl dd.more-infos
{
	position: absolute;
	left: 344px;
	text-indent: 0px;
	top: 48px;
	width: 21%;
}
#wrapper #content #cv .part .content-part dl dd dl dd.note-1
{
	background: transparent url("images/note_1.png") no-repeat 0px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dd.note-2
{
	background: transparent url("images/note_2.png") no-repeat 0px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dd.note-3
{
	background: transparent url("images/note_3.png") no-repeat 0px 2px;
}
#wrapper #content #cv .part .content-part dl dd dl dd.note-4
{
	background: transparent url("images/note_4.png") no-repeat 0px 2px;
}
#wrapper #content #cv .part .content-part ul
{
	background-color: #f9e4b6;
	list-style-image: url("images/puce_liste.png");
	margin: 0px;
	padding-top: 0.5em;
	width: 591px;
}
#wrapper #content #cv .part .content-part ul li
{
	margin-left:2.5em;
	padding: 0em 0em 0.5em 0em;
}
#wrapper #content #cv .part .content-part ul li a
{
	background: transparent url("images/anchor.png") no-repeat 0px 5px;
	color: #bb3c6c;
	display: block;
	font-size: 0.85em;
	outline: none;
	text-decoration: none;
	text-indent: 17px;
}
#wrapper #content #cv .part .content-part .bottom-content-part
{
	background: transparent url("images/bottom_part.png") no-repeat 0px 0px;
	height: 6px;
	width: 591px;
}
/* --- Fin > Section CV --- */
/* --- DÃ©but > Section Projets --- */
#wrapper #content dl#projets
{
	margin-left: 650px;
	width: 220px;
}
#wrapper #content dl#projets dt
{
	background-color: #d9e6fa;
	font-size: 1.2em;
	font-weight: bold;
	margin-top: 1.5em;
	padding: 0px 0px 3px 10px;
	width: 189px;
}
#wrapper #content dl#projets dd
{
	background-color: #d9e6fa;
	margin-left: 0px;
	width: 199px;
}
#wrapper #content dl#projets dd.illustration
{
	position: relative;
	text-align: center;
}
#wrapper #content dl#projets dd.illustration .top-projet
{
	background: transparent url("images/top_projet.png") no-repeat 0px 0px;
	height: 6px;
	left: -6px;
	position:absolute;
	top: -30px;
	width: 205px;
}
#wrapper #content dl#projets dd.illustration img
{
	border:solid 1px #bbbec0;
	margin-left: 0em;
}
#wrapper #content dl#projets dd.url
{
	line-height:9px;
	text-align: center;
}
#wrapper #content dl#projets dd.url a
{
	background: transparent url("images/separateur_horizontal.png") no-repeat 36px 17px;
	color: #3c75bb;
	display: block;
	font-size: 0.85em;
	outline: none;
	padding-bottom:1.5em;
	text-decoration: none;
}
#wrapper #content dl#projets dd.infos-comp
{
	background: #d9e6fa url("images/puce_liste.png") no-repeat 10px 3px;
	line-height: 15px;
	padding: 0px 5px 3px 25px;
	width: 169px;
}
#wrapper #content dl#projets dd.last
{
	padding-bottom: 4px;
}
#wrapper #content dl#projets dd.en-cours
{
	background-color: #da0063;
	color: white;
	position: relative;
	text-align: center;
}
#wrapper #content dl#projets dd.termine
{
	background-color: #1790c2;
	color: white;
	position: relative;
	text-align: center;
}
#wrapper #content dl#projets dd.status .bottom-projet
{
	background: transparent url("images/bottom_projet.png") no-repeat 0px 0px;
	height: 6px;
	left: 0px;
	position:absolute;
	top: 18px;
	width: 199px;
}
#wrapper #content #test
{
clear: both;
}
/* --- Fin > Section Projets --- */
/* --- Fin > CV --- */
