/*
----------------------------------------------------
fond d'ecran du site
*/

body{
	background-color: #e9e9e9;
	background-attachment: fixed;
	font-family: calibri,arial,serif;
	/* suppression des marges exterieures par defaut sur le body */
	margin-top: 0px;
	margin-bottom: 0px;
	margin-right: 0px;
	margin-left:  0px;
}

.souligne
{
	text-decoration: underline;
}

.italique
{
	font-style: italic;
}

/*
----------------------------------------------------
Formatage paragraphes
*/

p{
	font-size: 1em;
}

/*
----------------------------------------------------
mise en forme du header (entete)
*/

img.img_logo{
	max-width: 150px;
	float: left;
}

p.header_p{
	padding-left: 1%;
	padding-bottom: 0%;
	margin-top: 0%;
	height: 100%;
	margin-bottom: 0%;
}

a.title_header{
	display: inline-block;
	font-size: 2em;
	color: #333333;
	text-decoration: none;
	font-weight: bold;
	text-shadow: 2px 2px 4px #ccccff;
	padding-top: 2%;
	padding-left: 2%;
	max-width: 50%;
}

header{
	float: left;
	width: 100%;
	margin-left: 0%;
	margin-bottom: 2%;
}

/*
----------------------------------------------------
mise en forme du menu
*/


div.menu_div{
	float: left;
	background-color: #F2F2F2;
	box-shadow: 0em 0.3em #00ADB5, 0em -0.3em #00ADB5;
}

ul.menu{
	list-style-type: none;
	padding-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}

a.menu:hover{
	background-color: #393E46;
	color: white;
	border-bottom: 1px solid #00ADB5;
	border-top: 1px solid #00ADB5;
}

a.menu{
	display: block;
	padding-left: 4em;
	padding-right: 4em;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	text-decoration: none;
	color: #808cb3;
	font-weight: bold;
	border-bottom: 1px solid white;
	border-top: 1px solid white;
}

/*
----------------------------------------------------
mise en forme du contenu
*/

section{
	border: 0px solid gray;
	border-radius: 0px;
	padding-left: 1em;
	padding-bottom: 2em;
	color: #404040;
	float: left;
	width: 75%;
	margin-left: 15px;
	padding-right: 15px;
	word-wrap: break-word;
	background-color: #F2F2F2;
	box-shadow: 0.3em 5px 18px 0 rgba(0, 0, 0, 0.1), 0.3em 15px 100px 0 rgba(0, 0, 0, 0.19), 
	0em -0.3em #00ADB5, 0em 0.3em #00ADB5;
}

h1.title_section{
	font-weight: bold;
	color: black;
	background-color: #e9e9e9;
	padding-left: 1%;
	padding-right: 1%;
	display: inline-block;
	border-radius: 0px 0px 0px 0px;
	border-bottom: 1px solid white;
}

div.contact_left{
	padding-left: 5%;
	padding-top: 2%;
}

div.contact_right{
	float: right;
}

p.p_img{
	width: 100%;
	text-align: center;
	display: inline-block;
}

/* pour que l'image ne depasse pas du conteneur et soit redimensionnee*/
img.img_tn{
	max-width: 100%;
	display: inline-block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	box-shadow: 0.1em 0.1em black, -0.1em -0.1em black;
}

img.img_tn_2{
	max-width: 100%;
	display: inline-block;
	margin-right: 3em; /* centrage */
	margin-left: 3em; /* centrage */
	margin-bottom: 0px;
	box-shadow: 0.1em 0.1em black, -0.1em -0.1em black;
}

img.img_contact_tn{
	max-width: 100%;
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	box-shadow: 0.1em 0.1em black, -0.1em -0.1em black;
}

/* partie projets */

a.a_projets{
	text-decoration: none;
	color: #6666ff;
	font-weight: bold;
}
a.a_projets:hover{
	text-decoration: underline;
}

p.intro_projets{
	padding-left: 20px;
	padding-right: 20px;
}

p.p_projets{
	margin-bottom: 0.4em;
	margin-top: 1em;
}

table.table_projets{
	border-collapse: collapse;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
}

td.tablig_projets{
	border: 2px solid gray;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;
	max-width: 300px;
	vertical-align: top; /* pour que le contenu des cases soit colle en haut */
	text-align: center; /* centre le contenu des cases du tableau */
}

img.img_tn_portfolio{
	max-width: 60%;
	display: block;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
}

/* partie CV */

img.img_cv_logo{
	box-shadow: 0.1em 0.1em black, -0.1em -0.1em black;
	vertical-align: top;
}

img.img_cv_photo{
	max-width: 75%;
	box-shadow: 0.1em 0.1em black, -0.1em -0.1em black;
	vertical-align: top;
}

span.cv_text{
	display: inline-block;
	margin-left: 1em;
	margin-top: 1em;
	vertical-align: top;
}

span.cv_date{
	font-weight: bold;
}

span.cv_main{
	color: #8F809E;
	font-weight: bold;
	font-size: 1.3em;
}

span.cv_desc{
	display: inline-block;
	padding-top: 0.5em;
}

p.cv{
	padding-bottom: 2em;
	margin-top: 2em;
	margin-bottom: 2em;
	box-shadow: inset 0em -0.1em #d9d9d9;
}

a.a_cv{
	text-decoration: none;
	color: #6666ff;
	font-weight: bold;
}
a.a_cv:hover{
	text-decoration: underline;
}

h3.cv_h3{
	font-size: 1.5em;
	margin-bottom: 2em;
}

/*test hover tableau projets*/
/*
td.tablig_projets:hover{
	background-color: yellow;
}
*/
/*
----------------------------------------------------
mise en forme du footer (pied de page)
*/

div.footer_div{
	float: right;
	position: relative;
	margin-right: 20%;
}

p.text_footer{
	font-weight: bold;
	color: #6666ff;
	font-size: 0.9em;
}

/*
----------------------------------------------------
adaptation aux telephones et tablettes
*/

@media screen and (max-width: 980px)
{
	header{
		margin-left: 0%;
	}

	img.img_contact_tn{
		margin-bottom: auto;
		margin-right: 1em;
	}

	section{
		padding-left: 5%; /* marge interieure gauche */
		padding-right: 0px; /* corriger scrolling sur tel a cause de padding 15px sur section (ordi) */
		padding-bottom: 1em; /* bas de page reduit */
		width: 95%; /* largeur plus grande */
		margin-left: 0px; /* marge exterieure reduite */
	}

	table.table_projets{
	margin-right:5px; /* creer marge sur la droite */
	margin-left: 5px;
	}

	h1.title_section{
		padding-left: 0.5em; /* decalage du titre */
	}

	body{
	/* suppression des marges exterieures par defaut sur le body */
	margin-top: 0px;
	margin-bottom: 0px;
	margin-right: 10px;
	margin-left:  10px;
	}

	footer{
	text-align: center;
	}

	span.cv_text{
	/* suppression marge extérieure dans le texte du CV */
	margin-left: 0em;
	margin-top: 1em; /* ajout marge entre image et texte */
	}

	img.img_tn_2{
	max-width: 100%;
	display: inline-block;
	margin-right: auto; /* centrage */
	margin-left: auto; /* centrage */
	margin-bottom: 0px;
	box-shadow: 0.1em 0.1em black, -0.1em -0.1em black;
	}

}