@charset "utf-8";
/* CSS Document */

/* ---------- ---------- proprietes sur l'ensemble du site ---------- ---------- */
body {
	margin:0px;
	font-family: Arial, Helvetica, Sans-Serif;
	font-size:12px;
	line-height:14px;
	background-image:url(../picture/background.png);
	background-repeat:repeat-x;
	background-position:left top;
	background-color:#FFFFFF;
	color:#3E3E40;
}

/* ---------- ---------- proprietes sur l'ensembles des balises generales  ---------- ---------- */
img {border:0px;margin:0px;padding:0px;}
form {padding:0px;margin:0px;}
table {text-align:left;}
td{vertical-align:top;}


a {outline:0}
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}

p {margin-top:10px;margin-bottom:10px}

h1 {
margin-bottom:10px;
margin-top:10px;
height:24px;
color:#3399CC;
font-size:24px;
font-weight:normal;
}

/* ---------- ---------- ---------- ---------- CONTENER ---------- ---------- ---------- ---------- */
#wrapper {
	position:relative;
	width: 975px;
	margin: 0px;
	margin-right: auto;
	margin-left: auto;
}

#conteneur {
	position:relative;
	float:left;
	width: 100%;
	margin: 0px;
	padding: 0px;
	text-align:left;
}

#page {
	position:relative;
	float:left;
	width:975px;
	margin:0px;
	padding:0px;
	color:#3E3E40;
	text-align:justify;
}

#header {
position:relative;
float:left;
width:975px;
height:240px;
background-image:url(../picture/bienvenue.png);
background-repeat:no-repeat;
margin:0;
padding:0;
}

#header p {
	position:relative;
	float:left;
	width:550px;
	margin:0;
	margin-top:-54px;
	margin-left:285px;
	line-height:17px;
	padding:0;
	text-align:left;
	color:#FFFFFF;
	font-size:12px;
}


/* ---------- ---------- LOGO ---------- ---------- */
#logo {
	position:relative;
	float:left;
	width:200px;
	height:210px;
	margin:0;
	padding:0;
	background:url(../picture/logo.png) no-repeat;
	background-position:center center;
	background-repeat:no-repeat;
	background-color:transparent;
}

/* ---------- ---------- ---------- ---------- MENU ---------- ---------- ---------- ---------- */

#menu {
	position:relative;
	float:right;
	width:680px;
	height:60px;
	list-style:none;
	margin:0px;
	padding:0px;
	padding-left:70px;
	display:inline;
}

#menu ul {
margin:0px;
padding:0px;
list-style-type:none;
list-style-position:outside;
}

#menu ul li {
float:left;
list-style-type:none;
}

#menu ul li a {
position:relative;
display:block;
margin:0;
padding:0;
} 	 	
/*
#menu ul .selected {
background-color:#F5F5F5;
}*/
#menu ul .selected a{
color:#3399CC;
}

#menu ul li a:hover {
color:#3399CC;
}


#droite {
position:relative;
float:left;
width:975px;
margin-top:50px;
padding:0px;
padding-top:30px;
}

.cadre {
float:left;
position:relative;
width:955px;
background-color:#FFFFFF;
margin:0;
margin-bottom:40px;
padding:10px;
font-size:12px;
line-height:18px;
color:#555555;
}

.langages {
list-style-type:none;
overflow:auto;
}
.langages li {
float:left;
width:200px;
margin-bottom:20px;
}

.logiciels {
list-style-type:none;
overflow:auto;
}
.logiciels li {
float:left;
width:120px;
margin-bottom:20px;
}

.social_media {
list-style-type:none;
overflow:auto;
}
.social_media li {
float:left;
width:200px;
margin-bottom:20px;
}
.social_media li a>h2 {
color:#3399CC;
margin:0;
margin-bottom:4px;
padding:0;
padding-top:8px;
}
.social_media li>p {
color:#3E3E40;
margin:0;
padding:0;
}

.cadre_cv {
background-color:#F5F5F5;
margin:0;
margin-bottom:10px;
padding:4px;
}

.titre {
float:left;
position:relative;
width:100%;
height:24px;
background-image:url(../picture/fleche-cadre.png);
background-repeat:no-repeat;
margin:0;
padding:0;
padding-top:8px;
padding-bottom:0px;
padding-left:40px;
color:#3E3E40;
font-size:20px;
font-weight:normal;
}

.interieur {
margin:0;
padding:10px;
color:#3E3E40;
background-color:#FFFFFF;
}

.bleu{
	color:#3399CC;
}
.orange {
	color:#FF6000;
}
.rose {
	color:#FF0060;
}
.gras {
	font-weight:bold;
}


/* ---------- ---------- PORTFOLIO ---------- ---------- */

#right-book {
position:relative;
float:right;
width:975px;
margin-top:80px;
}

#right-book .projet {
float:left;
position:relative;
width:100%;
height:130px;
margin:0;
margin-bottom:40px;
background:url(../picture/fond-projet.png);
background-repeat:no-repeat;
background-position:center bottom;	
background-color:#F5F5F5;
}

#right-book .projet img{
float:left;
position:relative;
margin:0;
padding:6px;
background-color:#F5F5F5;
}

#right-book .description {
float:left;
position:relative;
margin:0px;
margin-top:-100px;
margin-left:492px;
padding:10px;
padding-top:2px;
background-color:#F5F5F5;
font-size:11px;
}

#right-book .titre_description {
	font-size:13px;
	font-family:Georgia, "Times New Roman", Times, serif;
	/*font-weight:bold;*/
	color:#FF0060;
}


/* ---------- ---------- CONTACT ---------- ---------- */
.contact-gauche {
float:left;
position:relative;
width:530px;
margin:0px;
padding:0px;
margin-right:5px;
}

.contact-droit {
float:right;
position:relative;
width:418px;
margin:0px;
padding:0px;
padding-left:1px;
padding-right:1px;
}

.td-texte {
text-align:left;
font-weight:bold;
vertical-align:top;
color:#3E3E40;
}

.td-input input {
border:1px solid #AFE3FF;
color:#3B3B3B;
font-size:14px;
padding:4px;
padding-top:1px;
padding-bottom:1px;
/*background:url(../picture/fond-input.jpg) repeat-x;*/
background-color:#FFFFFF;
margin:0px;
}

.td-input textarea {
border:1px solid #AFE3FF;
color:#3B3B3B;
font-size:14px;
font-family: Arial, Helvetica, sans-serif;
padding:4px;
/*background:url(../picture/fond-input.jpg) repeat-x;*/
background-color:#FFFFFF;
margin:0px;
}

.td-input2 input {
width:149px;
height:28px;
background-image:url(../picture/envoyer.jpg);
margin:0px;
margin-left:80px;
padding:0px;
border:0;
cursor:pointer;
}


.ok {
margin-top:10px;
margin-bottom:20px;
font-weight:bold;
color:#BAFF00;
}

.erreur {
margin-top:10px;
margin-bottom:20px;
font-weight:bold;
color:#FF0060;
}



/* ---------- ---------- PIED DE PAGE ---------- ---------- */
#bas {
position:relative;
float:left;
width:550px;
margin-top:100px;
margin-bottom:20px;
color:#3E3E40;
text-align:right;
font-size:10px;
}