@font-face {
	font-family: 'relief';
	src:url('Esquisito.ttf');
}


body {
	background-image: url(fond3.jpg);
}

#liens {
	/*background-color: white;*/
	
}

corp {
	margin: 0 auto; 
}
	
}

#background {
	width: 1200px;
}
#textehaut {
	font-size: 9px;
	font-family: "Courier New", Courier, monospace;
} 
header {
	margin-left: auto;
	margin-right: auto;
	position: absolute;
}



ul{
	display: table;
	z-index: 1000;
	width: 950px;
	padding: 0;
	background: -webkit-linear-gradient(grey,cleargrey);
	margin: 0 auto;
	font-family: arial;
	border-radius: 3px;
   box-shadow: 0 1px 3px rgba(0, 0, 0, .3),
               0 3px 5px rgba(0, 0, 0, .2),
               0 5px 10px rgba(0, 0, 0, .2),
               0 20px 20px rgba(0, 0, 0, .15);
			   
}
ul li{
   display: table-cell;
}

ul li a{
   display: block;
   text-align: center;
   color: black; 
   text-decoration: none;
   padding: 8px 8px 17px 8px;
      text-shadow: 0 1px 0 rgba(218, 218, 255, .4)
}

ul li a:hover, 
ul li a:focus{
	background: #dadada);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset, 
               0 -1px 0 teal inset, 
               0 -2px 0 silver inset, 
               0 -3px 0 hsl(210, 100%, 54%) inset, 
               0 -4px 0 hsl(210, 100%, 60%) inset, 
               0 -5px 0 hsl(210, 100%, 70%) inset;

}
/*
#haut {
	border-top-color: #009966;
	margin-left: 300px;
	height: 50px;
	width: 950px;
	border-top: 2px;
}
#accueil {
	width:316px;
	display: inline-block;
	background-color: #009966;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
}
#créa {
	width: 316px;
	display: inline-block;
	background-color: #99FF00;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
}
#parcours {
	width:310px;
	display: inline-block;
	background-color: #CC6600;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center; 
} */
#conteneur {
	width: 950px;
	margin: 0 auto;
	display: block;
	height: 550px;
	border-radius: 3px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .3),
               0 3px 5px rgba(0, 0, 0, .2),
               0 5px 10px rgba(0, 0, 0, .2),
               0 20px 20px rgba(0, 0, 0, .15);
	padding: 0;
	/*
	background: -webkit-linear-gradient(grey,cleargrey);
	background-color:#333333;
	*/
	margin-top: 35px;
	position:relative;
	
}
#fondGris{

position:absolute;
z-index:-1;
width: 950px;
	height: 550px;
	background: -webkit-linear-gradient(grey,cleargrey);
	background-color:#FEFCD8;

opacity:0.8;

}
div#navBar {
height:30px;
width:950px;
potition :relative;
margin:auto;

}

img#imageNav {

display:block;
width:950px;
position:absolute;
z-index: -1;
margin-top:-30px;


}

ul#liens {
position :absolute;

}


div#enteteZone {
width:950px;
margin:auto;
}

/* code pour portefolio*/
div#porteFolio {
position : relative;

}


div#porteFolio p{
position : absolute;
}



div#porteFolio p {
position : absolute;
}


div#porteFolio p#infographie {
left:30px;
top:350px;
}

div #porteFolio p#audiovisuel {
	left:195px;
	top:170px;
}

div #porteFolio p#illustration {
left:670px;
top:245px;
}

div #porteFolio p#animation {
left:700px;
top:70px;
}

div #porteFolio p#photographie {
	left:35px;
	top:26px;
}
div#porteFolio a {
text-decoration:none;
color:#333333;
font-size:44px;
font-family: 'relief';
}


img#img-carte{
	position : absolute;
	left: 9px;
}

#frise{
	position: absolute;
	bottom: 0px;
}
#frise2{ 
	position: absolute;
	bottom: 0px;
	}

#frise3{	position: absolute;
	bottom: 0px;}

#bandeauvidéos{
	font-family: "Comic Sans MS", cursive;
	font-size:22px;
	font-stretch:condensed;
	text-align:center;
	text-shadow:#FFF;
	margin-top:20px;
	font-color:#000;
	position:absolute;
	margin-left: 290px;

	
}

#bandeauvidéos a:link, #bandeauvidéos a:visited {
padding-left:30px;

color:#000000;

}

#bandeauvidéos a:focus, #bandeauvidéos a:hover{

color:#666666;

}

a:link{
	color:#000;
	text-shadow:#FFF;}

#motcentre {
	margin-left: 20px;
	margin-right: 20px;}
#title {
	font-size: 50px;
	margin-left: 25px;
}

.relieftypo {
	font-family: 'relief';
}

#presentation{
	
	margin-left: 400px;
	position:absolute;
	margin-top:100px;
	margin-right:50px;
border-radius: 3px;
	box-shadow: 0 1px 3px rgba(0, 0, 4, .3),
               0 3px 5px rgba(0, 0, 4, .2),
               0 5px 10px rgba(0, 0, 4, .2),
               0 20px 20px rgba(0, 0,4, .15);
	padding: 10px;
-moz-transform: scale(1) rotate(-10deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
-webkit-transform: scale(1) rotate(-10deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
-o-transform: scale(1) rotate(-10deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
-ms-transform: scale(1) rotate(-10deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
transform: scale(1) rotate(-10deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
background-color:#009966;
opacity:1;
}
.presentation{
  opacity:0.5;
}

#text{
	text-align:justify;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;

	
}

#text2{
	text-align:justify;
	font-size: 12px;
	font-family: "Times New Roman", Times, serif;
color:#333333
	
}

#photo{
	width:350px;
 	position:absolute;
	float:left;
	margin-left:30px;
	margin-top:0px;

}

#photomention {
	width:200px;
 	position:absolute;
	float:left;
	margin-left:30px;
	margin-top:0px;
}
	

table {
	position: absolute;
	border-color: #009999;
}

#cursus{
	padding: 20px;
	width: 50%;
	text-align: justify;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	border-right: 2px solid;
	border-right-color:#00CC99;
	color:#333333;
	padding-top:20px;
}

#img1 {;
	margin-left: 50px;
}
#xp {
	padding: 20px;
	width: 50%;
	text-align: justify;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#333333;
}

#competences {
	display:block;
	width: 500px;
	margin-left: 200px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	padding-top: 10px;
	text-align: center;
	position: absolute;
	margin-top: 300px;
	color: #009966;
}

#lecteur {
	position:absolute;
	margin-left:150px;
	margin-top:50px;
	}
	
#lecteur2 {
	position:absolute;
	margin-left:240px;
	margin-top:50px;
	}
#lecteur3 {
	position:absolute;
	margin-left:200px;
	margin-top:80px;}

#fleche_droite{
display:inline-block;
	position:absolute;
	margin-top:230px;
	margin-left:780px;
	}
	
#fleche_gauche{
display:inline-block;
	position:absolute;
	margin-top:230px;
	margin-left:65px;
	}
#fleche_droite_z{display:inline-block;
	position:absolute;
	margin-top:230px;
	margin-left:780px;}


#fleche_gauche_z{display:inline-block;
	position:absolute;
	margin-top:230px;
	margin-left:65px;}	


#fleche_droite_3d{display:inline-block;
	position:absolute;
	margin-top:230px;
	margin-left:780px;}	

#fleche_gauche_3d{display:inline-block;
	position:absolute;
	margin-top:230px;
	margin-left:65px;}	


#mozaik {
position:relative;
	margin-right:10px;
	margin-top:50px;
	}
	
	
/* Gallerie photo */

#visu{
top:10px;
left:420px;
position:absolute;

display:none;
margin-right:0px;
}

#en_tete{
display:inline;
position:relative;
width:160px;
height:40px;
margin-top:20px;
left:320px;
margin-right:10px;
}


#retour{
display:block;
top:20px;
left:20px;
margin-right:10px;
}

#container{
	/*display:block;*/
	background-color:#000000;
	position:relative;
	top:60px;
	padding-right:500px;
	margin-right:10px;
}

#Gallery{
display:inline;
position:relative;	
top:40px;
left:40px;
background-color:#FFFFFF;
margin-right:10px;
}

#cc{
	position:relative;	
	display:block;
	top:820px;
}

/*CSS FORMULAIRE*/

body {
 font-family:"trebuchet ms",sans-serif;
 font-size:90%;
 }
form {
 background-color:#FAFAFA;
 padding:10px;
 width:280px;
 }
fieldset {
 padding:0 20px 20px 20px;
 margin-bottom:10px;
 border:1px solid #DF3F3F;
 }
legend {
 color:#DF3F3F;
 font-weight:bold
 }
label {
 margin-top:10px;
 display:block;
 }
label.inline {
 display:inline;
 margin-right:50px;
 }
input, textarea, select, option {
 background-color:#FFF3F3;
 }
input, textarea, select {
 padding:3px;
 border:1px solid #F5C5C5;
 border-radius:5px;
 width:200px;
 box-shadow:1px 1px 2px #C0C0C0 inset;
 }
select {
 margin-top:10px;
 }
input[type=radio] {
 background-color:transparent;
 border:none;
 width:10px;
 }
input[type=submit], input[type=reset] {
 width:100px;
 margin-left:5px;
 box-shadow:1px 1px 1px #D83F3D;
 cursor:pointer;
 }
 
/*css gallerie jquery*/

#textemention { 
margin-left: 100px;
	position:absolute;
	margin-top:110px;
	margin-right:50px;
border-radius: 3px;
	box-shadow: 0 1px 3px rgba(0, 0, 4, .3),
               0 3px 5px rgba(0, 0, 4, .2),
               0 5px 10px rgba(0, 0, 4, .2),
               0 20px 20px rgba(0, 0,4, .15);
	padding: 10px;
-moz-transform: scale(1) rotate(-5deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
-webkit-transform: scale(1) rotate(-5deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
-o-transform: scale(1) rotate(-5deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
-ms-transform: scale(1) rotate(-deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
transform: scale(1) rotate(-5deg) translateX(0px) translateY(1px) skewX(0deg) skewY(2deg);
background-color:#009966;
opacity: 0.5;

 }

#mentions {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
}


.borderMe {
border:solid 2px white;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

#formulaireMail {
width:200px;
margin:auto;


}