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

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #000;
	background:#000;
}

.appt{font-size: 24px;color: white;font-family: "Comic Sans MS";font-weight: normal; text-align: center;}

H1 {font-size: 24px;color: #CC9900;font-family: "Comic Sans MS";font-weight: normal;}
H2 {font-size: 22px;color: #669966;font-weight: normal;}
H3 {font-size: 21px;color: #CC9900;font-family: "Comic Sans MS";font-weight: normal;}
H4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #669966;
	font-weight: normal;
}
H5 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #CC9900;
	font-weight: normal;
}
.imghaut{
	position:absolute;
	left:0px;
	top:0px;
}
.imgbas{
	top:25%;
	position:relative;
}
.verticAlign {
top : 35%;
position : absolute;
}
P  {font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #669966;
	font-weight: normal;}
.Style9 {font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #FFFFFF;}
.lien {
	color: #000;
	text-decoration: none;
	font-weight: normal;
}
.lien:hover{
	color:#333;
	text-decoration:underline;
	font-weight: normal;
}

.lien1 {
	color: #CC9900;
	text-decoration: underline;
	font-weight: normal;
}
.lien1:hover{
	color:#669966;
	text-decoration:none;
	font-weight: normal;
}
.lien2 {
	color: #CC9900;
	text-decoration: none;
	font-weight: normal;
}
.lien2:hover{
	color:#669966;
	text-decoration:underline;
	font-weight: normal;
}
.alinea{text-indent:30px;}
.Style10 {font-size: 24px ; color:#669966}
.Style19 {font-size: 18px ; color:#669966}
.Style1 {
	font-family: Cocktail;
	font-size: 48px;
	color: #CC9900;
	font-weight: normal;
}
.Style4 {color: #FFFFFF; font-size: 24px; font-weight: bold; }
.Style6 {font-size: 18px; color: #FFFFFF;}
.Style3 {color: #FFFFFF; font-size: 24px; }
.Style2 {
	color: #FFFFFF;
	font-size: 18px;
}
.Style100 {color: #FF0000}
.Style20 {
	color: #669966;
	text-align: right;
	}
.Style15 {font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #669966;
	font-weight: normal;}
	
	
	
	.contenu {

    width:700px;

    margin:10px auto 25px;
	}
	
	
	
	.miniatures div:first-child  {

    margin-left: 0px;

}



.miniatures div{

    float:left;

    margin:10px 0px 0px 10px;

}

.photo {

    vertical-align: middle;

}

.image-principale {
    text-align: center;
}

.img_spirale {
    position: absolute;
    -moz-transition-property: -moz-transform, width;
    -moz-transition-duration: 0.3s, 1s;
    -moz-transform-origin: 50% 50%;
	 -webkit-transition-property: -moz-transform, width;
    -webkit-transition-duration: 0.3s, 1s;
    -webkit-transform-origin: 50% 50%;
	
   
}
.img_spirale:hover {
    position: absolute;
    -moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
    
    
    
}

.portrait:hover {
    width: 300px;
}
.paysage:hover {
    width: 570px;
}

.spirale1 {
    -moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
    margin-top:10px;
    width: 134px;
	z-index:4;
}
.spirale2 {
    -moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
   margin-left:144px;
   margin-top:10px;
    width: 134px;
	z-index:3;
}
.spirale3 {
    -moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	margin-top:10px;
    margin-left:288px;
    width: 134px;
	z-index:2;
}
.spirale4 {
    -moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	margin-top:10px;
    margin-left:432px;
    width: 268px;
	z-index:1;
}