/* @override http://www.antonpsy.com/slide/style.css */

/* votre body, autant dire le fond de votre site, ici en background, c'est à dore contenu dans votre body, vous avez l'image de fond avec le ciel bleu et la montagne...  */




body	{
	background-image: url('http://www.antonpsy.com/slide/images/grotte.jpg') ;background-repeat: repeat;
	width: 3500px;
	height: 3000px;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Verdana, Arial, sans-serif;
	font-size: 13px;
	color: black;
	}

* {
	
}

/* p, comme paragraphe, le texte courant */
	


p	{
	color: #ffffee;
	
	line-height: 2.1;
	text-align: justify;
	}

/* les liens, a c'est pour les liens visitables, a:hover, c'est lorsque vous passez votre souris desssus, changement de couleurs par exemple ! et a:visited, c'est lorsque vous avez cliqué sur le lien */


a	{
	color: #445599;
	text-decoration: none;
	}
a:hover, a:visited:hover{
	color: #509bfb;
}

/* h1, h2, etc, ce sont les tailles de typos que vous allez utiliser dans votre document, plus bas, dans contact, je vous explique comment attribuer un style spécifique pour un espace, car si dans un espace particulier vous souhaitez par exemple une couleur spéciale et bien il faut l'indiquer dans la zone, donc voir dans menu j'en parle */




h1{
	color: black;
	font-size: 3.0em;
	font-family:Arial, Helvetica, sans-serif;
	padding:10px
	}
	
	
	h2{
	color: #000000;
	font-size: 2.0em;
	font-family:Arial, Helvetica, sans-serif;
	padding:10px
	}

/* spécifique à notre de mouvement dans la photo */


#canvas	{
	padding-top: 100px;
	padding-left: 200px;
	padding-right: 150px;
	}
	
	


	
	
	
	
	/*espace menu*/

/* son positionnement sa taille, les ul, qui ouvre les listes, les li qui donnent la liste et li a qui vont donner le look au menu lorsque'il est sélectionné. Et puis les h2 attribué au menu qui donnent une taille de typo différente spécifique à la zone menu */
	
	#menu	{
	position:fixed;
	width:150px;
	top: 400px;
	left: 30px;
	
	margin:0;
	padding-top: 20px;
	padding-bottom: 20px;
	
	padding-right: 10px;
	text-align: left;
	font-size: 1.4em;
	font-color: #ffffff;
	color: navy;
}
	
	
ul.menu2, ul.menu2 ul {
 list-style: none;
  margin: 10;
  padding: 15px;
  width: 950px;
  line-height: 1.6;
	text-align: justify;
}




ul.menu a {
  display: block;
  text-decoration: none;
  
  	
}

ul.menu li {
	list-style: none;
  margin-top: 2px;
 
  color: black;
  height: 100%;
  
 }

/* les images, elles aussi pêuvent avoir un style particulier dans une zone précise */
 
 
 ul.menu li img{
	float: right;
}
  ul.menu li p {
   width: 950px;
   height: 100%;
  line-height: 1.6;
	text-align: justify;
	padding: 5px;
	  color: #fff;	
	  font-size: 14px;
	   line-height:1.5em;
	   
  
}


 ul.menu li h2 {
  font-size:18px;
  line-height:1.125em;
  color: #ffffff;
  text-align: left;
  font-family: Arial;
  margin-bottom: 0px;
}

ul.menu li a {
  
  color: #fff;	
  padding: 0.5em;
  text-align: center;
  height: 20px;
  font-size: 1.5em;
  font-weight: bold;
  border-bottom: dotted 1px #ffffff;
   border-top: dotted 1px #ffffff;
}

ul.menu li a:hover {
  background: #509bfb;
  color: #509bfb;
}

ul.menu li ul li a {
  background: #ccc;
  color: #000;
  
}

ul.menu li ul li a:hover {
  background: #aaa;
  border-left: 5px #000 solid;
 
}
/* ici on rentre nas les espaces... le premier concerne la positon initiale de l'espace, le deuxième la position lorsque l'on clique sur le menu. Il y a un petit décalage entre les deux... */	








/*espace accueil*/
#espaceaccueil	{
	position: absolute;
	left: 280px;
	top: 200px;
	border: 5px groove #ffffff;
	width: 900px;
	height: 400px;
	
	}
	
	#espaceaccueilliendiv{
	position: absolute;
	left: 1px;
        top: 0px;
	}

	
	
	
	/*espace 1*/

#espace1	{
	position: absolute;
	top:1300px;
	left:400px;
	color: navy;
	border-style: double;
	border-width: 0px;
}

#espace1liensdiv	{
	position: absolute;
        top:1100px;
        left:0px;
	}
	
	
	
	

/*espace 2*/
	

#espace2	{
	position: absolute;
	left: 1980px;
        top: 1200px;
        width: 900px;
	height: 500px;
	border: 0px solid #ffffff;
            
	}
	
	#espace2liensdiv	{
	position: absolute;
        left: 1700px;
        top: 1100px;
	}
	
#espace2 p    {
	color: black;
	line-height: 2.1;
	text-align: justify;
	}
		/*espace 3*/
	
	
#espace3{
       
        position: absolute;
	left: 1980px;
	top: 170px;
	width: 900px;
	height: 500px;
	border: 0px solid #ffffff;
	}
	
	#espace3liensdiv	{
	position: absolute;
        left: 1700px;
        top: 100px;
	}
#espace3 p    {
	color: whitesmoke;
	line-height: 2.1;
	text-align: justify;
	}
	
	#espace3 h2{
	color: silver;
	font-size: 1.3em;
	text-align: center;
	
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Verdana, Arial, sans-serif;
line-height: 1.6;
}



/* contact  */

#espacecontact	{
	position: absolute;
	top:2500px;
	left:280px;
	border: 5px groove #CCC;
	padding: 15px;
	width: 800px;
	color: navy;
}

#espacecontact p	{
	color: silver;
	
	line-height: 1.6;
	text-align: justify;
	}
	
	#espacecontact h2{
	color: gray;
	font-size: 1.3em;
		text-align: left;
	
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Verdana, Arial, sans-serif;

line-height: 1.6;


}

	
	
#contactdiv	{
	position: absolute;
        top:2600px;
        left:20px;
	}

/* Fin contact  */

/* ici on a les css du javascript du slide de l'acceuil.  */


	


/* le slider sur l'accueil  */
ul.ppt {
	position: relative;
	}

.ppt li {
	list-style-type: none;
	position: absolute;
	top: 0;
	left: 0;
}

.ppt img {
	
margin: 30px;	
}