/* reset.css */

/* Initialise les marges des elements bloc */
body, div, 
dl, dt, dd, ul, ol, li, 
h1, h2, h3, h4, h5, h6, 
pre, form, fieldset, input, 
p, blockquote, th, td { margin: 0; padding: 0; }

/* Initialise la taille des titres */
h1,h2,h3,h4,h5,h6 { font-size: 100%; }

/* Enleve les puces aux listes */
ol, ul { list-style: none; }

/* Initalise le style du texte */
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }

/* Enleve les bordures aux images et aux fieldset */
fieldset, img { border: 0; }

/* --------------- Fin du reset.css --------- */



html {background: url(../images/bg.jpg); font-family:Verdana, Geneva, sans-serif; font-size: 12px; color: #909090;}

body {width: 900px; margin: 50px auto; position: relative; background:#1b1b1b; }

/* ---- Contenant avec tout le texte ----- */
#contenu {width: 856px; margin: 0 auto; position: relative; /*border: solid 1px #666;*/}

/* ---- Logo ----- */
#logo {padding-top: 45px; padding-left: 5px;}

/* ---- Image avec du code dedans ----- */
#code {position: relative; margin: 20px 0;}
#code img {position: relative; top: 2px; border: solid 1.5px #333; padding: 4px 5px;}


/* ---- Menu ----- */
#menu {position: absolute; top: 80px; left: 480px; font-size: 16px; color: #FFF;}
#menu li {display: inline; padding: 0 5px;}
.active a {color: #62bd2a; outline: none;}
.active a:visited {color: #62bd2a; outline: none;}

/* ---- Liens ----- */
a {color: #FFF; text-decoration: none; outline: none;}
a:visited {color: #FFF; text-decoration: none; outline: none;}
a:hover {color: #62bd2a; text-decoration: none; outline: none;}

h2 {color: #FFF; font-size: 20px; padding-bottom: 25px;}
.barre_sous_h2 {position: relative; top: 30px;}

h3 {color: #FFF; font-size: 14px; padding: 10px 0;}

/* ---- Pied de page ----- */
#pied_page {clear: both; height: 30px; text-align: right; margin-right: 40px; color: #FFF; font-size: 10px; padding-top: 30px;}


#swf {position: relative; left: 28px; padding-top: 30px;}

#swf_pouapouh {position: relative; left: -22px; padding-top: 30px;}

#swf_video {position: relative; margin: 0, auto;}







/* --------------- Page d'index ------------------- */
.barre_separation {float: left;}

/* ---- div projets dans la page index ----- */
#projets {width: 244px; margin-left: 15px; margin-right: 25px; min-height: 420px; float: left;}
	.index_projet {clear:both;}
		.image_projet {width: 80px; height: 80px; background: #666666; float: left; margin-right: 5px;}
		.image_projet img {position: relative; top: 2.5px; left: 2.5px;}
		.date {color: #FFF; font-size: 14px; padding-bottom: 5px;}
		.description {padding-bottom: 5px;}
		.lien_projet {float: right; padding: 5px 0;}

/* ---- div qui_suis_je dans la page index ----- */
#qui_suis_je {width: 244px; margin-left: 15px; margin-right: 25px; min-height: 420px; float: left;}
	#description_moi {position:relative; font-size: 14px;}
	#description_moi li {color: #FFF;}
	#description_moi ul {margin: 20px 10px}

/* ---- div nouvelles dans la page index ----- */
#nouvelles {width: 245px; margin-left: 15px; margin-right: 25px; min-height: 420px; float: left; font-size: 12px;}
	.index_nouvelle {clear:both;}
		.date_nouvelle {width: 46px; height: 46px; background: url(../images/bg_date.jpg) no-repeat; float: left; margin-right: 5px; text-align: center; color: #FFF; font-size: 14px; padding-top: 5px;}
		.description {padding-bottom: 5px;}
		.lien_projet {float: right; padding: 5px 0;}

/* ---- Liens dans le bas de la page index ----- */
#lien_realisations {position: relative; left: 15px;}
#lien_a_propos {position: relative; left: 213px;}
#lien_nouvelles {position: relative; left: 417px;}

#liens_bas a{color: #62bd2a; font-size: 14px; text-decoration:underline;}
#liens_bas a:visited{color: #62bd2a; text-decoration:underline;}
#liens_bas a:hover{color: #62bd2a; text-decoration:underline;}








/* --------------- Page À propos ------------------- */
.barre_separation {float: left;}

/* ---- div parcours dans la page à propos ----- */
#parcours {width: 244px; margin-left: 15px; margin-right: 25px; min-height: 420px; float: left;}

/* ---- div competences dans la page à propos ----- */
#competences {width: 244px; margin-left: 15px; margin-right: 25px; min-height: 420px; float: left;}

/* ---- div objectifs dans la page à propos ----- */
#objectifs {width: 244px; margin-left: 15px; margin-right: 25px; min-height: 420px; float: left;}

#pdf {position: relative; left: 0; top: 80px; width: 150px; font-size: 12px;}
#pdf a {font-size: 12px;}
#pdf a:visited {font-size: 12px;}
#pdf a:hover {font-size: 12px;}
#pdf img {float:left; padding-right: 5px;}




/* --------------- Page Réalisations ------------------- */
#projet {position:relative; width: 567px; float: left;}
	#projet #image_projet {float:right; width: 200px; text-align: center; padding-left: 10px; padding-bottom: 10px;}
	#projet li {list-style: disc; margin-left: 20px;}
	#projet p {padding: 5px 0;}
	#projet #image_projet a {text-decoration: underline;}

#menu_realisations {width: 284px; min-height: 400px; float: right; /*position:relative; top: 20px;*/}









/* --------------- Page Contact ------------------- */

#formulaire_contact {position: relative; margin-top: 20px;}

.blanc {color:#FFF; font-size: 14px;}

/* ---- Les messages lors de l'envoie du formulaire ---- */
#envoye {color:#090;}
#erreur {color:#C00;}

/* ---- Formulaire ---- */

#prenom {position:relative; left: 21px;}
	#prenom .texte {margin-right: 5px; float:left;}

#nom {position: absolute; left: 280px; top: 0px;}
	#nom .champ {position: absolute; top: 0; left: 43px;}
	
#courriel {clear: both; position:relative; left: 8px; margin-top: 10px;}
	#courriel .texte {margin-right: 5px; float:left;}
	
#objet {clear: both; position:relative; left: 34px; margin-top: 10px;}
	#objet .texte {margin-right: 5px; float:left;}
	
#message {clear: both; margin-top: 10px;}
	#message .texte {margin-right: 5px; float:left;}
	
#btnEnvoyer {position: relative; left: 448px; margin-top: 5px;}