@charset "ISO-8859-1";
/* CSS Document */

*{
margin:0;
padding:0;	
list-style-type:none;
border:none;
}

body{ width:100%; overflow-x:hidden;}

img{border:none;}


#Header{ width:100%; height:380px; background-image:url(../layout_img/Head.jpg); background-repeat:repeat-x; background-position:center; position:relative;text-align:center;}
#repeatTr{ background-image:url(../layout_img/repeatTr.png); width:100%; height:10px; background-repeat:repeat-x;margin-top: -8px; position:relative; z-index:5;}

#Footer{width:100%; background-color:#272727; padding:50px 0; text-align:center; position:relative;}
#Footer ul li{ list-style-type:none; display:inline-block; color:#FFF;}
#Footer ul li a{ color:#FFF; text-decoration:none;font-family: 'Montserrat', sans-serif; font-size:11px; padding:0 10px;}

#ContFoot{ width:840px; margin:auto;}

#repeatTr2{ background-image:url(../layout_img/repeatTrB.png); width:100%; height:10px; background-repeat:repeat-x;top: 3px; position:relative; z-index:5;}

#LogoMenu{pointer-events: none; margin:-125px auto 0;width:222px;}
#LogoFace{margin: auto; position: absolute; bottom: 66px; cursor:pointer;}

.Menu{ background-color: #fff;height: 40px;margin-top: 170px;position: absolute;width: 100%;}
#MenuInt{ width:1150px; margin:auto; text-align:center;}

#MenuGauche ul{display: inline;float: left;margin-top: -7px;padding: 19px 0;}
#MenuGauche li{display:inline-block; list-style-type:none;}
#MenuGauche a{ text-decoration:none;font-family: 'Montserrat', sans-serif; color:#67022a; font-size:12px; text-transform:uppercase;padding:16px 25px;}

#MenuDroite ul{display: inline;float: left;margin-top: -7px;padding: 19px 0;}
#MenuDroite li{display:inline-block; list-style-type:none;}
#MenuDroite a{ text-decoration:none;font-family: 'Montserrat', sans-serif; color:#67022a; font-size:12px; text-transform:uppercase;padding:16px 8px;}


#Cont{ width:100%; padding:50px 0; background-color:#FFF; position:relative; margin-top:-2px;}
#Content{ width:840px; margin:auto;}

h2{font-family: 'Montserrat', sans-serif; font-size:25px;color:#1c1c1c; text-transform:uppercase;}
h3{font-family: 'Raleway', sans-serif;font-size:20px;color:#1c1c1c; font-weight:lighter;}
p{ font-size:12px; color:#454545; font-family:Helvetica, sans-serif; font-weight:lighter;}

.BoutonTop{text-align:center; font-size:10px; color:#d24545; border:1px solid #d24545; border-left:0; padding:0 10px;font-family:Helvetica, sans-serif; float:left; height:28px;}
.Bouton{border: 1px solid #d24545;color: #d24545;float: left;font-family: Helvetica,sans-serif;font-size: 11px;margin-top: 30px;padding: 10px 20px;text-align: center; cursor:pointer; line-height:16px; text-decoration:none;
-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }
.Bouton2{border: 1px solid #d24545;color: #d24545;float: left;font-family: Helvetica,sans-serif;font-size: 10px;margin-top: 15px;padding:8px 15px;text-align: center; cursor:pointer; line-height:10px;
-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }

.Bouton:hover{border: 1px solid #d24545;color: #FFF; background:#d24545;-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }
.Bouton2:hover{border: 1px solid #d24545;color: #FFF;background:#d24545;-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }



#Apropos{float: right; line-height: 31px; width: 445px; position:relative; z-index:10;}
#Traiteur{width:375px; float:left;line-height: 31px; margin-top:90px;position:relative;z-index:10; width:290px;}
#Boucherie{float: right; line-height: 31px; width: 370px; text-align:right; margin-top:15px;position:relative;z-index:10; }
#Recette{width:390px; float:left;line-height: 31px; margin-top:40px;position:relative;z-index:10;}
#Recette p{ font-size:11px;}

#Contact{float: right; line-height: 35px; width: 445px; position:relative; z-index:10; margin-top:10px;}


#Img{ float:left; margin:10px 0 70px 0;}
.Det1{height:182px; width:182px; float: left;margin-right: 37px;position: relative; margin-top:20px; text-align:center; border-radius:150px; overflow:hidden; cursor:pointer;}
.Det1 img{top:200px; position:relative; z-index:2;-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }
.Det1:hover img{-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; top:79px;}
.Det1:hover .BlackH{ opacity:0.3;-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }

.BlackH{width:182px; height:182px; background-color:#000; position:absolute; opacity:0; top:0;-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease;border-radius:150px;  }


.animated { 
    -webkit-animation-duration: 1s; animation-duration: 1s; 
    -webkit-animation-fill-mode: both; animation-fill-mode: both; 
	-webkit-transform-origin: center right;
	-moz-transform-origin: center right;
	-o-transform-origin: center right;
	transform-origin: center right;
	
} 

.anim2 { 
    -webkit-animation-duration: 1s; animation-duration: 1s; 
    -webkit-animation-fill-mode: both; animation-fill-mode: both; 
	-webkit-transform-origin: center left;
	-moz-transform-origin: center left;
	-o-transform-origin: center left;
	transform-origin: center left;
	
} 


#Carte{ clear:both;  float:left;color: #454545;font-family: Helvetica,sans-serif;font-size: 13px;font-weight: lighter;line-height: 25px; width:100%;text-align:left; padding-top:20px;}
#Carte h4{ color: #1c1c1c;font-family:Helvetica, sans-serif;font-size: 12px;font-weight: bold; margin-bottom:5px; clear:both; margin-top:20px; float:left; width:100%;}

.MenG{ float:left; }
.Prix{ float:right; font-weight:bold;}

.Ligne{float:left; width:100%;}

#Carte h3{ margin-bottom:15px;}



@-webkit-keyframes bounceIn { 
    0% { opacity: 0; -webkit-transform: scale(.3); } 
    50% { opacity: 1; -webkit-transform: scale(1.05); } 
    70% { -webkit-transform: scale(.9); } 
    100% { -webkit-transform: scale(1); opacity: 1;} 
} 

@keyframes bounceIn { 
    0% { opacity: 0; transform: scale(.3); } 
    50% { opacity: 1; transform: scale(1.05); } 
    70% { transform: scale(.9); } 
    100% { transform: scale(1); opacity: 1; } 
} 

@-webkit-keyframes bounce2 { 
    0% { opacity: 0; -webkit-transform: scale(.3); } 
    50% { opacity: 1; -webkit-transform: scale(1.05); } 
    70% { -webkit-transform: scale(.9); } 
    100% { -webkit-transform: scale(1); opacity: 1;} 
} 

@keyframes bounce2 { 
    0% { opacity: 0; transform: scale(.3); } 
    50% { opacity: 1; transform: scale(1.05); } 
    70% { transform: scale(.9); } 
    100% { transform: scale(1); opacity: 1; } 
} 

#Img4:hover img { -webkit-animation-name: bounceIn; animation-name: bounceIn; }
#Img4 img{ opacity:0;transform: scale(0);-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }

#Img3:hover img { -webkit-animation-name: bounce2; animation-name: bounce2; }
#Img3 img{ opacity:0;transform: scale(0);-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }


#Img2:hover img { -webkit-animation-name: bounceIn; animation-name: bounceIn; }
#Img2 img{ opacity:0;transform: scale(0);-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }

#Img1:hover img { -webkit-animation-name: bounce2; animation-name: bounce2; }
#Img1 img{ opacity:0;transform: scale(0);-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease; }

#Carte{-webkit-transition:0.6s ease;-moz-transition:0.6s ease;-o-transition:0.6s ease;transition:0.6s ease;}






@media screen and (max-width: 1150px) {
	
.Menu{ background-color: #fff;height: 40px;margin-top: 170px;position: absolute;width: 100%;}
#MenuInt{ width:950px; margin:auto; text-align:center;}

#MenuGauche ul{display: inline;float: left;margin-top:0px;padding: 12px 0;}
#MenuGauche li{display:inline-block; list-style-type:none;}
#MenuGauche a{ text-decoration:none;font-family: 'Montserrat', sans-serif; color:#67022a; font-size:10px; text-transform:uppercase;padding:15px 12px 12px;}

#MenuDroite ul{display: inline;float: left;margin-top: 0px;padding: 12px 0;}
#MenuDroite li{display:inline-block; list-style-type:none;}
#MenuDroite a{ text-decoration:none;font-family: 'Montserrat', sans-serif; color:#67022a; font-size:10px; text-transform:uppercase;padding:15px 12px 12px;}	

#LogoMenu{pointer-events: none; margin:-135px auto; float:left; width:222px; margin-left:26px;}
#LogoFace{ display:none;}

	
}







