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

body {
	background-color: #0F1F26;
	color: #9d9668;
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1em;
}

a.liens {
	color:#827c3e;
	font-weight:bolder;
	text-decoration:none;
	outline:none;
}

a.liens:hover {
	background-color:#403a2c;
}



.blockcontenu {
	position:absolute;
	margin-left:3%;
	margin-top:3%;
	padding:10px;
	border-color:#FFFFFF;
	border:dotted;
	width:90%;
	height:75%;
	overflow: scroll;
}


#fondcommand {
	position:absolute;
	width:600px;
	height:610px;
	left: 50%;
	top: 50%;
	margin-top: -300px; /* moitié de la hauteur */
	margin-left: -305px; /* moitié de la largeur */
	background-image:url(img/fond_commande.png);
}

#contact {
	position:absolute;
	width:800px;
	height:300px;
	left: 50%;
	top: 50%;
	margin-top: -150px; /* moitié de la hauteur */
	margin-left: -400px; /* moitié de la largeur */
	z-index:5;
}

#galeriephotoflickr {
	position:absolute;
	width:900px;
	height:600px;
	left: 50%;
	margin-top: 50px; /* moitié de la hauteur */
	margin-left: -450px; /* moitié de la largeur */
	z-index:4;
}


#conteneurtwitter {
	width:254px;
	position:absolute;
	left: 50%;
	top: 50%;
	margin-top: -220px; /* moitié de la hauteur */
	margin-left: 150px; /* moitié de la largeur */
	border: 0px solid #5E5E32;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	z-index:8;
	-moz-transform: rotate(-7deg);
	-webkit-transform: rotate(-7deg);
	-moz-box-shadow: 10px 10px 20px #0F1F26;  
    -webkit-box-shadow: 10px 10px 20px #0F1F26;  
    box-shadow: 10px 10px 20px #0F1F26; 
	
}

#conteneurtwitter:hover{	
  	-moz-transform: rotate(0deg);  
    -webkit-transform: rotate(0deg); 
} 

#conteneurmenu {
	position:absolute; 
	width:324px;
	left: 50%;  
    top: 50%; 
    margin-top: -160px; /* moitié de la hauteur */ 
    margin-left: -430px; /* moitié de la largeur */ 
    border: 0px solid #5E5E32;
	-moz-border-radius: 8px; 
	-webkit-border-radius: 8px; 
	border-radius: 8px;
	z-index:8;
  	-moz-transform: rotate(7deg);  
    -webkit-transform: rotate(7deg);
	-moz-box-shadow: 10px 10px 20px #0F1F26;  
    -webkit-box-shadow: 10px 10px 20px #0F1F26;  
    box-shadow: 10px 10px 20px #0F1F26; 
}

#conteneurmenu:hover{	
  	-moz-transform: rotate(0deg);  
    -webkit-transform: rotate(0deg); 
}


#conteneurmenu2 {
	position:fixed; 
	width:64px;
	left: 0%;
	top: 50%;
    margin-top: -150px; /* moitié de la hauteur */ 
    margin-left: -30px; /* moitié de la largeur */ 
	-moz-border-radius: 8px; 
	-webkit-border-radius: 8px; 
	border-radius: 8px;
	z-index:8;
	-moz-box-shadow: 10px 10px 20px #0F1F26;  
    -webkit-box-shadow: 10px 10px 20px #0F1F26;  
    box-shadow: 10px 10px 20px #0F1F26; 
}

#conteneurmenu2:hover{	
    margin-left: 8px; /* moitié de la largeur */ 
}

#titrepage{
	position:fixed; 
	width:300px;
	left: 0%;  
    margin-top: 10px;
    margin-left: 40px;
	z-index:2;
}

#logo{
	position:fixed; 
	right: 0%;  
	bottom: 0%;
    margin-bottom: 30px;
    margin-right: 50px;
    border: 0px solid #5E5E32;

	z-index:2;
}


#menu {
	width:310px;
	height:265px;
    border: 2px solid #5E5E32;
	background-color:#403a2c;
	padding:5px;
	-moz-border-radius: 8px; 
	-webkit-border-radius: 8px; 
	border-radius: 8px;
	z-index:10;
}

#menu2 {
	width:50px;
	height:265px;
    border: 2px solid #5E5E32;
	background-color:#403a2c;
	padding:5px;
	-moz-border-radius: 8px; 
	-webkit-border-radius: 8px; 
	border-radius: 8px;
	z-index:10;
}

#portfolio3d {
	position:absolute; 
	visibility:hidden;
	width:300px;
	height:238px;
    margin-top: -210px; /* moitié de la hauteur */ 
    margin-left: 125px; /* moitié de la largeur */ 
	z-index:15;
}

#portfoliowebdesign {
	position:absolute; 
	visibility:hidden;
	width:300px;
	height:238px;
    margin-top: -150px; /* moitié de la hauteur */ 
    margin-left: -150px; /* moitié de la largeur */ 
	z-index:15;
}

#portfoliophoto {
	position:absolute; 
	visibility:hidden;
	width:300px;
	height:200px;
    margin-top: -85px; /* moitié de la hauteur */ 
    margin-left: 200px; /* moitié de la largeur */ 
	z-index:15;
}

#portfolio3d2 {
	position:absolute; 
	visibility:hidden;
	width:300px;
	height:238px;
    margin-top: -220px; /* moitié de la hauteur */ 
    margin-left: -10px; /* moitié de la largeur */ 
	z-index:15;
}

#portfoliowebdesign2 {
	position:absolute; 
	visibility:hidden;
	width:300px;
	height:238px;
    margin-top: -160px; /* moitié de la hauteur */ 
    margin-left: -10px; /* moitié de la largeur */ 
	z-index:15;
}

#portfoliophoto2 {
	position:absolute; 
	visibility:hidden;
	width:300px;
	height:200px;
    margin-top: -100px; /* moitié de la hauteur */ 
    margin-left: -10px; /* moitié de la largeur */ 
	z-index:15;
}


#twitter {
	width:250px;
    border: 2px solid #5E5E32;
	-moz-border-radius: 8px; 
	-webkit-border-radius: 8px; 
	border-radius: 8px;
	z-index:10;
}
	
#clementchenedesign {
	background-image:url(img/logo_fond_transparent.png);
	width:200px;
	height:150px;
	position:absolute; 
	left: 50%;  
    top: 50%; 
	z-index:5;
    margin-top: 30px; /* moitié de la hauteur */ 
    margin-left: -75px; /* moitié de la largeur */ 
}


#pioupiou {
	background-image:url(img/twitter.png);
	width:100px;
	height:75px;
	position:absolute; 
	left: 50%;  
    top: 50%; 
	z-index:11;
    margin-top: 150px; /* moitié de la hauteur */ 
    margin-left: 50px; /* moitié de la largeur */ 
}

#fondpage {
	background-image:url(img/fond_fibre.png);
	width:1024px;
	height:589px;
	position:absolute; 
	left: 50%;  
    top: 50%; 
	z-index:0;
    margin-top: -100px; /* moitié de la hauteur */ 
    margin-left: -512px; /* moitié de la largeur */ 
}


/*galerie JS */
.galleria{list-style:none;width:200px;}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0; }
.galleria li a{display:none;}
.galleria li div{position:absolute;display:none;top:0;left:180px;}
.galleria li div img{cursor:pointer;}
.galleria li.active div img,.galleria li.active div{display:block; }
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto;}
.galleria li .caption{display:block;padding-top:.5em;}
* html .galleria li div span{width:400px;} /* MSIE bug */

/* début du style graphique pour l'affichage */
*{margin:0;padding:0;}
.caption{font-style:italic;color:#887;}
.demo{position:relative;margin-top:0em;}
.gallery_demo{width:900px;margin:0 auto;}
.gallery_demo li{width:80px;height:65px;border:none; margin: 3px; background:#0F1F26; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border:2px solid #5f5e32;}
.gallery_demo li div{left:240px;}
.gallery_demo li div .caption{font:italic 0.7em/1.4 georgia,serif;}
#main_image{margin:0 auto 60px auto;height:500px;width:900px;background:none;}
#main_image img{margin-bottom:10px; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; border:2px solid #5f5e32;  -moz-box-shadow: 10px 10px 20px #0F1F26; -webkit-box-shadow: 10px 10px 20px #0F1F26; box-shadow: 10px 10px 20px #0F1F26;}
.nav{padding-top:15px;clear:both;font:80% 'helvetica neue',sans-serif;letter-spacing:3px;text-transform:uppercase; }
.info{text-align:left;width:700px;margin:30px auto;border-top:1px dotted #221;padding-top:30px; }
.info p{margin-top:1.6em;}