body,li, div{
	font-family: Gill Sans;
	font-size: 20px;
	color: #403232;
	
}

.tp {
	font-family: Gill Sans;
	font-size: 15px;
	color: #403232;
	text-align:center;
	
}


.DR {
	font-family: Gill Sans;
	font-size: 76px;
	color: #403200;
	text-align:center;
	
}

.bgi {
	background-image:url(../images/pvb.jpg);
	background-repeat:repeat;
   	background-size:cover 
}
.bgc {
	background-image:url(../images/1.jpg);
	background-repeat:repeat;
   	background-size:cover 
}

.bgv {
	background-image:url(../images/c.jpg);
	background-repeat:repeat;
   	background-size:cover 
}

.bgt {
	background-image:url(../images/4.jpg);
	background-repeat:repeat;
   	background-size:cover 
}
.mov_bunny {
 /* 
 width: 1000px;
  height: 1000px;
  background-color: red;
 */
  padding: 2px;
  position: relative;
  animation-name: mv_bn;
  animation-duration: 0.8s;
  animation-iteration-count: infinite;
  -webkit-face-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

@keyframes mv_bn {
  0%   {left:1px; top:0px;}
  25%  {left:2px; top:0px;}
  50%  {left:3px; top:0px;}
  75%  {left:2px; top:0px;}
  100% {left:1px; top:0px;}
}

  

	
	#Carousel {	
/* 
position: relative;
top: 200px;
left: 400px;
 */
}



.CA	{
	font-size:30px;
	text-align:center;
/* 	color:#641E16; */
	color:black;
	position: absolute;
	left:100px;
	top:500px;

/* 
	-moz-opacity: 1;
	opacity: 1;
 */
		}	
    	 
.Transparent 	{
	font-size:25px;
	text-align:center;
	color:#641E16;
	position: absolute;
	left:50%;
	top:10px;
				}

.bcf{
		font-family: Gill Sans;
		font-size: 25px;
		/* font-family: cursive; */
		color: red;
		animation: img_back 2s linear infinite;
		-webkit-backface-visibility: hidden;   
		backface-visibility: hidden;
					}

.bcb{
		font-family: Gill Sans;
		font-size: 25px;
		color: red;
	/* 
	animation: img_back 1s linear infinite;
		-webkit-backface-visibility: hidden;   
		backface-visibility: hidden;
 */
					}
					

@keyframes img_back{
/* 
0%{opacity: 0;}
 */
/* 50%{opacity: .5;} */
/* 100%{opacity: 1;} */
}

.divcoln{
	position: absolute;
	font-size:20px;
	color: #641E16;
	padding: 3px;
  	text-align: center;
	top:60% ;
 	height: 270px;
  	left: 10px; 
 	width: 420px;
   	background-color: #d7c295;
   	border-style: outset;
   	border-color:#641E16;
   	border-width:5px;
	}
	
.dccc{
	font-size:20px;
	color: #641E16;	
  	text-align: center;
	}
.divcolp {
  	position: absolute;
  	text-align: center;
	font-size:20px;
/* 	top: 20px ; */
 	height: 200px;
/*   	left: 300px;  */
 	width: 250px;
   	padding: 10px;   
   	background-color: #d7c295;
   	border-style: outset;
   	border-color:#641E16;
   	border-width:5px;
  }
  


#f1_container {
  	position: absolute;
	font-size:25px;
	color: #641E16;
  	text-align: center;
/* 	top: 70%; */
 	height:260px;
/*   	left:35%;  */
 	width: 260px;
   	padding: 2px;
   	background-color: #d7c295;
   	border-style: outset;
   	border-color:#641E16;
   	border-width:5px;
 	z-index: 1;
}

#f1_container {
  perspective: 1000;
}
#f1_card {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}
#f1_container:hover #f1_card {
  transform: rotateY(180deg);
}

#f2_container {
  	position: absolute;
	font-size:25px;
	color: #641E16;
/* 	padding: 12px; */
  	text-align: center;
/* 	top: 70%; */
 	height:220px;
/*   	left:35%;  */
 	width: 250px;
   	padding: 10px;
   	background-color: #d7c295;
   	border-style: outset;
   	border-color:#641E16;
   	border-width:5px;
 	 z-index: 1;
}
#f2_container {
  perspective: 1000;
}

#f2_card {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}
#f2_container:hover #f2_card {
  transform: rotateY(180deg);
/*   box-shadow: -10px 10px 10px #eeaaff; */
}

#f3_container {
  	position: absolute;
	font-size:25px;
	color: #641E16;
  	text-align: center;
/* 	top: 70%; */
 	height:60px;
/*   	left:35%;  */
 	width: 100 px;
   	padding: px;
   	background-color: #d7c295;
   	border-style: outset;
   	border-color:#641E16;
   	border-width:5px;
 	z-index: 1;
}

#f3_container {
  perspective: 1000;
}
#f3_card {

  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}
#f3_container:hover #f3_card {
  transform: rotateY(180deg);
}
.face {
  margin:0px;
  padding: 0px;
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.face.back {
  padding:0px;
  margin:0px;
  display: block;
  transform: rotateY(180deg);
  color: #641E16;
  text-align: center;
  background-color: #d7c295;
/* 
  -webkit-backface-visibility: hidden; 
  backface-visibility: hidden;
 */
}



.Img_Zoom img {
/* La transition s'applique à la fois sur la largeur et la hauteur, avec une durée d'une seconde. */
-webkit-transition: all 1s ease; /* Safari et Chrome */
-moz-transition: all 1s ease; /* Firefox */
-ms-transition: all 1s ease; /* Internet Explorer 9 */
-o-transition: all 1s ease; /* Opera */
transition: all 1s ease;
}
.Img_Zoom:hover img {
/* L'image est grossie de 15% */
-webkit-transform:scale(1.15); /* Safari et Chrome */
-moz-transform:scale(1.15); /* Firefox */
-ms-transform:scale(1.15); /* Internet Explorer 9 */
-o-transform:scale(1.15); /* Opera */
transform:scale(1.15);
} 
 
.D{
 /* 
 width: 400px;
  height: 300px;
 */
  position: absolute;
  animation: mymove 100s infinite;
  animation-direction:alternate;
}


@keyframes mymove {
0% { top: 0px; left: 0px; }
10% { top: 5px; left: 5px; }
20% { top: 10px; left: 10px; }
30% { top: 25px; left: 25px; }
30% { top: 30px; left: 30px; }
30% { top: 25px; left: 25px; }
60% { top: 20px; left: 20px; }
70% { top: 15px; left: 15px; }
80% { top: 10px; left: 10px }
90% { top: 5px; left: 5px; }
100% { top: 0px; left: 0; }
}

#logo img{
position: absolute;
display: block;
overflow: hidden;
margin-top: 3px;
margin-left: 13px;
top: 0px;
transition-duration: 1s;}
 
#logo img:hover{
top: -50px;
}


.lor:link {
	color: #403232;
	}

.lor:visited {
	color: #403232;
}

.lor:active {
	color: #403232;
}

.lor:hover {
	color:#641E16;
}


.tt {
	left:-5px
	padding:0px;
	margin:5px;
	font-size:25px;
	color: red;
	}


.tt:link {
/* 
	color: #641E16;
 */
color:red;	
	}


.tt:visited {
	color: red;
}

.tt:active {
	color: black;
}

.tt:hover {
	color: red;
}

.ttt {
font-size:25px;
text-align: center;
background-color:#d7c295;
}	

.parker {

position:relative;
left:-7px;
top:-31px;
}	

.f1 {
position:relative;
left:0px;
top:-12px;
}	

.sp{
font-size:35px;
font-weight: bold;
/* font-style: italic; */
text-align: center;
color: #641E16;
background-color:#d7c295;
}	

.tttt {
position:absolute;
font-size:25px;
text-align: center;
background-color:#d7c295;
top:10px;
left:50%;
width:300px;
}	

.ps {
	position: absolute;
	top 205px;
	left: 25px; 
}

.divimg {
	position:absolute;
	left: 0px;
	top: 0px;
	
}


.divimg2 {
	position:relative;
	text-align: center;
	left: 0px;
	top: 0px;
	}


.divcol{
	text-align: center;
	top: 500px ;
 	height: 400px;
  	left: 0px; 
 	width: 400px;
   	padding: 10px;
   	background-color: #d7c295;
   	border-style: solid;
   	border-color:#641E16;
   	border-width:3px;
}


/* b #d7c295 */

#Carousel {	
position: absolute;
top: 800px;
left: 100px;
width: 900px;
height: 300px;

}

img.superbg {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
}

.zoom {
  background-color: #d7c295;
  transition: transform 1s; /* Animation */
  width:250px;
  height: 220px;
  box-sizing: border-box;
  margin: 0 auto;
}

.zoom:hover {
  transform: scale(1.2); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}