/*******************************************************************************************/
/********************************************************************** Balises généralles */
/*******************************************************************************************/
html {
	overflow-y: scroll;
}

body {
	margin: 0;
	padding: 0;
	margin-left: auto;
	margin-right: auto;
	background-color: #B0C4DE;					/* lemonchiffon */
	width: 790px;
	font: normal 90% "Trebuchet MS", Verdana, "Lucida Grande", Tahoma, Helvetica, Sans-Serif;
	line-height: 1.2em;
}

hr {
	width: 80%;
	line-height: 1px;
	color: #DEB887;								/* burlywood */ 
}

a {
	text-decoration: none;
	color: #B8860B;								/* darkgoldenrod */
	font-weight: bold;
}

i {
	font-weight: bold;
	font-size: 1.1em;
	color: 	#228B22;							/* greenforest */
}

p {
	margin: 0 0 1em 0;
	padding: 0;
	text-indent: 30px;
}

h1, h2 {
	font-family: Georgia;
}

input, select, textarea {
     font-size: 0.8em;
     font-family: arial;
}

input[type="reset"],input[type="submit"]  {
     font-size: 1em;
     font-family: arial;
}

img, a {
	border-color: transparent;
}
/** Gestion de la transparence   */
img, div { behavior: url("../Images/Transparence/iepngfix.htc") }

.strong {
	font-weight: bold;
}
/*******************************************************************************************/
/**************************************************************************** Mise en page */
/*******************************************************************************************/
header, footer, section, nav, hgroup, h1, h2, aside, article {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align: baseline;
    background: transparent;
}

header {
	text-align: center;
	height: 250px;  
	width: 790px;   
	display: block;
	background-image: url("../Images/ssmenu.jpg");
	background-position: top;
	background-repeat: no-repeat; 			
}

nav {
    list-style: none; 
}

hgroup {
	height: auto;
}

aside {
	display: block;
	margin: 0;
	padding: 0px 50px 15px 0px;
	text-align: right; 
	height: 50px;
}


article {
	width: 790px; 
	display: block;
	height: inherit;
	_height: 350px;								/* hack IE */
	min-height: 350px;
	background-color: #FFFFFF;    				
	overflow: hidden;
	background-image: url("../Images/fond-commun.jpg");
	background-position: top;
	background-repeat: repeat-y;
}


footer {
	display: block;		
	height: 50px;
	width: 790px; 
	padding-top: 60px;   				/* coral */
	text-align: center;  
	background-image: url("../Images/pied.jpg");
	background-position: top;
	background-repeat: no-repeat;
	color: #6d662d;
	overflow: hidden;
}

/*******************************************************************************************/
/********************************************************************************* Bandeau */
/*******************************************************************************************/
figure#bandeau { 
	display: block;
	text-align: left;
	z-index: 1000;
	margin-right: 100px;
} 

figure#bandeau img {
	position: relative; 
	top: 30px;
	left: 30px;
	z-index: 1000;
	height: 130px; 
	width: 130px;
	float: left;
}

header h1 {
	position: relative;
	padding-top: 50px;
	padding-left: 120px;
	font-size: 2.9em; 
	color: #ADFF2F;							/* greenyellow */
	text-shadow: 0px 2px 3px green;
	z-index: 1000;
}

figure a {
	color: #DCDCDC; 						/* Gainsboro - HTML5 génère une bordure sinon */
}

header p {
	position: relative; 
	top: -330px; 
	left: 80px;
	line-height: 1.5em; 
	color: 	#F4A460; 						/* sandybrown */
	font-size: 0.8em; 
	font-weight: 900; 
	font-family: "Comic Sans MS"; 
	text-indent: 0px; 	
	z-index: 0; 
}

.imagebandeau {
	margin-top: 10px;
}

/*******************************************************************************************/
/************************************************************************** Menu principal */
/*******************************************************************************************/
#menunavigation ul { 
	position: relative;
	top: -10px;
	left: 130px;  
	z-index: 1000;
}

#menunavigation li { 
    display: inline; 							/* Affichage horizontal */  
}


/**************************************  Gestion des survol
/**************************************  */
.btn_presentation a {
	display: block;
	width: 220px;
	height: 80px;
	background:url("../Images/presentation.jpg") no-repeat;
	float: left;
}
.btn_presentation a:hover {
	background:url("../Images/presentation_survol.jpg") no-repeat;
}
.btn_parcours a {
	display: block;
	width: 180px;
	height: 80px;
	background:url("../Images/parcours.jpg") no-repeat;
	float: left;
}
.btn_parcours a:hover {
	background:url("../Images/parcours_survol.jpg") no-repeat;
}
.btn_contact a {
	display: block;
	width: 180px;
	height: 80px;
	background:url("../Images/contact.jpg") no-repeat;
	float: left;
}
.btn_contact a:hover {
	background:url("../Images/contact_survol.jpg") no-repeat;
}

/*******************************************************************************************/
/******************************************************************************* Sous-Menu */	 
/*******************************************************************************************/
ul.sousMenu {
    margin: 0; 
    padding: 0;
	margin-left: 500px; 
    list-style: none;
}

ul.sousMenu li {
	display: inline; /* affichage horizontal */
	width: 110px;
}

aside i {
	line-height: 50px;
	display: block;
	vertical-align: bottom;
}

aside img {
	border-color: transparent;
}
/**************************************  Gestion des survol
/**************************************  */
.btn_cv a {
	display: block;
	width: 75px;
	height: 75px;
	background:url("../Images/cv.jpg") no-repeat;
	float: left;
}
.btn_cv a:hover {
	background:url("../Images/cv_survol.jpg") no-repeat;
}
.btn_competences a {
	display: block;
	width: 75px;
	height: 75px;
	background:url("../Images/computer.jpg") no-repeat;
	float: left;
}
.btn_competences a:hover {
	background:url("../Images/computer_survol.jpg") no-repeat;
}
.btn_competences_imp a {
	display: block;
	width: 75px;
	height: 75px;
	background:url("../Images/imprimante.jpg") no-repeat;
	float: left;
}
.btn_competences_imp a:hover {
	background:url("../Images/imprimante_survol.jpg") no-repeat;
}
/*******************************************************************************************/
/********************************************************************** Section principale */	 
/*******************************************************************************************/
#fadeIn {
	width: 740px;
	padding: 10px 25px 0 25px;
	height: auto;
	_height: 450px;								/* hack IE */
	min-height: 450px;
}

/*******************************************************************************************/
/******************************************************************* Formulaire de contact */	 
/*******************************************************************************************/
dl.table-display {
	margin: 0;
	padding: 0;
	height: 43em;
}

.table-display dt#premiere, dd#premiere {
	border-top: 0px;
}

.table-display dt {
	margin: 0 0 0 0;
	padding: .5em;
	border-top: 1px solid #999;
	font-weight: bold;
	width: 35%;
	float: left;
	height: auto;
}

/* hack de commentaire avec un antislash pour ie5 mac \*/
dt { clear: both; }
/* end hack */

.table-display dd {
	margin: 0 0 0 0;
	padding: .5em;
	border-top: 1px solid #999;
	width: 60%;
	float: right;
}

.champObligatoire {
	background-color: #FFD700;						/* Gold */
}

.erreurFormulaire {
	background-color: #4B0082;						/* Indigo */
	color: white;
}

/*******************************************************************************************/
/************************************************************************************** CV */	 
/*******************************************************************************************/
dl.table-CV {
	width: 100%;
	margin-top: 5px;
	margin-bottom: 5px;
}

.table-CV dt {
	margin-top: 15px;
	margin-bottom: 5px;
	width: auto;
	font-weight: bold;
}

/* hack de commentaire avec un antislash pour ie5 mac \*/
dt { clear: both; }
/* end hack */

.table-CV dd {
	margin: 5px 0;
	padding: 0;
	width: auto;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 0;
	font-size: 0.8em;
}


ul.liste-CV {
	margin:  0;
	padding: 0;
}

ul.liste-CV li{
	margin:  0;
	padding: 0;
	width: auto;
	margin-bottom: 5px;
	padding-left: 20px;
	list-style-type: none;
	background-image:url("../Images/puce2.gif");
	background-position: left;
	background-repeat: no-repeat;
}


h2.CV-Comp {
	margin: 1em 0 0.8em 0;
	padding: 0;
	font-size: 1.5em;
	border-radius: 10px 0px 0px 0px; 
	-moz-border-radius: 10px 0px 0px 0px; 			/* Hack moz */
	background-color: 		#F4A460;				/* lightslategray */ 
	padding: 0.5em;
	width: auto;
}

hr.table-CV {
	margin-top: 0.5em;
	margin-bottom: 1em;
}
/*******************************************************************************************/
/***************************************************************************** Compétences */	 
/*******************************************************************************************/
dl.table-COMP {
	width: 100%;
	margin: 0 0 1.5em 0;
	padding: 0;
	line-height: 1.3em;
}


.table-COMP dt {
	width: 40%;
	float: left;
	margin: 0;
	padding: 0 0 0 0.4em;
	font-weight: bold;
	border-bottom: 1px solid #999;
}

/* hack de commentaire avec un antislash pour ie5 mac \*/
dt { clear: both; }
/* end hack */

.table-COMP dd {
	width: 100%;
	margin: 0;
	padding: 0 0 0 0.4em;
	font-size: 0.8em;
	border-bottom: 1px solid #999;
}
/*******************************************************************************************/	  
/********************************************************************************** Textes */	  
/*******************************************************************************************/
.retrait {
	margin-left: 15px;
}

i.msgErreur {
	margin-left: 2em;
	color: red;
	font-weight: bold;
} 
/*******************************************************************************************/	  
/********************************************************************************** Pop-up */	  
/*******************************************************************************************/

a.info {
  position:relative;
}
a.info:hover {
   background: none; 
   z-index: 500; 
}
a.info span {display: none;}
a.info:hover span {
   display: inline; 
   position: absolute;
   white-space: nowrap;
   font-size: 0.8em;
   font-weight:normal;
   width:350px;
   top: 40px; 
   left: 50px;
   background: black;
   color: white;
   padding: 3px;
   border: 1px solid #5D779A;
   border-top: 4px solid #5D779A;
}

a.info img {
	margin-left: 1em;
	vertical-align: baseline;
}