﻿@charset "utf-8";
/** 全局CSS定义 **/

html { height:100%; margin:0; padding:0; width:100%; border:0; }
body { margin:0 auto; font-size:12px; font-family:Arial, Helvetica, sans-serif; line-height:1.5; background-color:#ffffff; }
ul,li,dl, dd, h1, h2, h3, h4, h5, h6, form { padding:0; margin:0; color:#fff; }
p { padding:0; margin:0; color:#000; height:40px; line-height:24px; }
ul { list-style:none; }
img { border:0px; }
table { border-collapse:collapse; }
td { border:#ccc solid 1px; color:#e2af21; }

a:link { color:#ed752b; text-decoration:none; }
a:visited { color:#ed752b; text-decoration:none; }
a:hover { color:#00483a; text-decoration:none; }
a:active {outline:none;blr:expression(this.onFocus=this.blur());}

/* head */
#head { 	
	width:100%;
	height:100px;
	padding:10px 0 10px 0; 
	/*background-color:#c3c9cc;
	border-bottom: #c3c9cc solid 0.5px!important; 
	background:transparent;
	background-color:rgba(192,233,177,0.15); 	
	*/
	position:fixed;
	color:#fff;
	top:0;
	left:0;
	font-size:14px;
	z-index:999;
	background:linear-gradient(to bottom, rgba(173, 245, 224, 0.54) 60%,rgba(232, 105, 14, 0.26) 100%) !important;
}

#logo { width:30%;  float:left; margin-left:2%; }

#link { width:15%;  float:left; }
/*#link a:hover { background-color:#fff; }*/


#menu { display: block; width:36%; float:left; height:40px; line-height:40px; background-color:#2aa738; border-radius:10px 0 0 10px; }
#menu a { float:left; text-align:center; padding-left:20px; padding-right:20px; color:#fff; }
#menu a:hover { color:#e4b51f; border-bottom: #e4b51f solid 2px!important;}

#menu_mobile { display:none; }

#tel { width:16%; height:20px; line-height:20px; float:left; text-align:right; padding:10px 1% 10px 0; font-size:16px; background-color:#33322f; }
#tel span { font-size:14px; font-weight:bold; color:#e4b51f; }
#tel a { color:#fff; font-size: 20px;}
#tel a:hover { color:#fff; }

/* end head */

/* common */

.clear { clear:both; height:0; font-size:1px; line-height:0px; }
.oneline { clear:both; height:30px; font-size:1px; line-height:10px; }
.highline { clear:both; height:60px; font-size:1px; line-height:10px; }
.ligne { clear:both; height:20px; font-size:1px; line-height:20px; border-bottom:1px dotted #ccc; margin-bottom:10px; }

/* end common */

/* index */

#main { width:100%; height:100%; height: auto !important; margin:0 auto; }
.masthead { width:99.999%; overflow:hidden;}
.masthead .bx-wrapper { position: relative; }
.masthead .bxslider { padding: 0; list-style:none; margin:0; }
.masthead .bxslider li img { width:100%; z-index:0;	}

#index_pub
{
	margin:20% 0 0 2%;
	text-align:left;
	/*line-height:150%;
		font-size:16px;	
	*/
	overflow:hidden;
	word-break: break-all; 
	position:absolute;
	top:0;
	z-index:100;
    background-color: rgba(51, 50, 47, 0.52);
	padding: 20px 25px;
	height:100%; 
	height: auto !important;
}

#index_pub p {color:#fff;}

.hr { display: block; text-align: left; padding-left: 45px; overflow: hidden; white-space: nowrap; }

.hr>span { font-family: Light; text-transform: uppercase; color: #e4b51f; position: relative; display: inline-block; font-size: 30px; letter-spacing: 3px; }

.hr>span:after, .hr>span:before { content: ""; position: absolute; top: 50%; width: 9999px; height: 1px; background: rgba(255,255,255,.8); }

.hr>span:before { right: 100%; margin-right: 15px; }

.hr>span:after { left: 100%; margin-left: 15px; }

#index_pub_panel{
	margin-top: -23px;
    padding: 20px 25px;
    border: 1px solid rgba(102,181,158,.8);
    border-top-color: transparent;
	color:#e4b51f;
	line-height:150%;
	/*font-family: Helvetica,Arial,sans-serif;
	font-weight:lighter;
	*/
}
#index_pub_panel p { color:#e4b51f; }

/* end index */

/* footer */

#footer { padding:10px 1% 10px 1%; background-color:rgb(181, 220, 208); font-size:14px; color:#000; height:30px; line-height:30px; }
#footer .footer_left { width:70%; height:30px; line-height:30px; float:left; text-align:left; }
#footer .footer_right { width:28%; height:30px; line-height:30px; float:right; text-align:right; }

/* end footer */

/* contact */ 
#contact_bg { width:100%; height:100%; height: auto !important; margin-top:120px; background-image:url("../images/bg.jpg"); background-attachment:fixed; background-repeat:no-repeat; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover; }
#contact_panel { width:980px; min-height:780px; _height:780px; height:100%; height: auto !important; background-color:rgba(173, 245, 224, 0.54); margin:0 auto; padding:10px; }
#contact_banner { width:980px; height:100%; height: auto !important; margin:0 auto; }
#contact_banner img { width:100%; }
#contact_right { width:660px; float:left; height:450px; height:100%; height: auto !important; margin-top:10px; }
#contact_left  { width:300px; min-height:430px; _height:430px; height:100%; height: auto !important; float:right; margin-top:10px; padding:10px; }
#logorestaurant { width:98%; margin:0 auto; }
#logorestaurant img { width:100%; }
#nomrestaurant { width:90%; margin:0 auto; font-size:20px; font-weight:bold; text-align:center; padding:20px 0; text-transform:uppercase; }
#addresse { width:90%; margin:0 auto; padding-bottom:5px; text-align:center; font-size:16px; }
#phone { width:90%; margin:0 auto; padding-bottom:20px; text-align:center; font-size:16px;}
#horaire { width:90%; margin:0 auto; padding-bottom:20px; text-align:center; font-size:16px;}
#inforesto { width:90%; margin:0 auto; padding-bottom:20px; text-align:center; font-size:16px;}

/* end contact */ 

/* famille list */

.dropdown { display: inline-block; position: relative;}
.dropdown-famille-panel { display:none; position:fixed; top:50px; left:50%; z-index:1000; width:200px; background-color: rgba(5, 111, 77, 0.86); }
.dropdown-famille-list { margin-right:1px !important; padding-left:2%; color:#fff; font-size:12px; }
.dropdown-famille-list ul { width:100%; }
.dropdown-famille-list li  { line-height:30px; width:100%; border-bottom:1px solid #e4b51f; }
.dropdown-famille-list a  { color:#fff;}
.dropdown-famille-list a:hover { display:block; background-color: rgba(8,8,8,0.65); color:#fff; }
.activcatgegory { display:block; background-color: rgba(8,8,8,0.65); color:#fff; }

/* end famille list */

/* produit */ 

#product_panel { width:100%; height:100%; height: auto !important; margin:120px 0 0 0; }
.banner { width:100%; position:relative; }
.banner img { width:100%; }
.nomfamille { width:99%; height:40px; line-height:40px; z-index:1; padding-left:1%; background-color:rgba(13, 175, 11, 0.8); font-size:18px; color:#fff; }

.product_table { width:100%; min-height:410px; _height:410px; height:100%; height: auto !important; }
.product_table ul { width:100%; float:left; }
.product_table ul li { width:17.92%; height:100%; float:left; padding:1%; border:1px solid #E6E6E6; border-style:none solid solid none;  position:relative; }

.product_img { position: relative; overflow:hidden; }
.product_img img {
	position: relative;
   -webkit-transition: all 0.8s ease-in-out;
   -moz-transition: all 0.8s ease-in-out;
   -o-transition: all 0.8s ease-in-out;
   -ms-transition: all 0.8s ease-in-out;
   transition: all 0.8s ease-in-out;
   width:100%;
}
.product_img:hover img {		
   -webkit-transform: scale(1.2) rotate(2deg);
   -moz-transform: scale(1.2) rotate(2deg);
   -o-transform: scale(1.2) rotate(2deg);
   -ms-transform: scale(1.2) rotate(2deg);
   transform: scale(1.2) rotate(2deg);
}

.product_name { font-size:14px; height:26px;	 line-height:30px; overflow:hidden; margin-top:10px; }
.product_name a { color:#00483a; }
.product_price  { left: 6px; top: 6px; z-index: 1; color: #fff; padding: 3px 5px; position: absolute; background-color:rgba(0,102,51,0.6); font-size:1.2em;}

/* end produits */

/* detail */

.detail_box { width:1000px; margin:0 auto; position:absolute; top:30%; left:15%; background-color:#fff; z-index:10000; box-shadow: 5px 10px 5px #00483a; padding-bottom:10px; }
.fermer { width:100%; height:30px; line-height:30px; background-color:rgba(0,102,51,0.6); margin-bottom:10px; }
.fermer a { float:right; color:#fff; font-size:10px; font-weight:lighter; margin-right:10px; }
.detail_image { width:60%; float:left; }
.detail_right { width:35%; float:right; }
.detail_name { width:100%; height:40px; line-height:40px; color:#00483a; font-size:16px; margin-bottom:10px; }
.detail_content { width:100%; height:100%; color:#e2af21; word-break: break-all; overflow:hidden;  }
.detail_prix { width:100%; height:40px; line-height:40px; color:#00483a; font-size:20px; position:absolute; bottom:20px; }

/* article sans photo*/
#article_bg { width:100%; height:100%; height: auto !important; margin-top:120px; background-image:url("../images/bg.jpg"); background-attachment:fixed; background-repeat:no-repeat; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover; }
#article_panel { width:980px; min-height:747px; _height:747px; height:100%; height: auto !important; background-color:rgba(173, 245, 224, 0.54); margin:0 auto; }
#article_banner { width:980px; height:100%; height: auto !important; margin:0 auto; }
#article_banner img { width:100%; }
#article_left { width:40%; float:left; }
#article_right { width:60%; float:right; }
#photo_table { width:98%; margin:0 1%; }
#photo_table p { margin: 0; padding: 10px 0; }
#photo_table a { outline: none; }
#photo_table a img { border:0; padding:0; margin: 0; width:100%; }

/*

#photo_table a img {
   -webkit-transition: all 0.8s ease-in-out;
   -moz-transition: all 0.8s ease-in-out;
   -o-transition: all 0.8s ease-in-out;
   -ms-transition: all 0.8s ease-in-out;
   transition: all 0.8s ease-in-out;
}
#photo_table a :hover img {		
   -webkit-transform: scale(1.2) rotate(2deg);
   -moz-transform: scale(1.2) rotate(2deg);
   -o-transform: scale(1.2) rotate(2deg);
   -ms-transform: scale(1.2) rotate(2deg);
   transform: scale(1.2) rotate(2deg);
}
*/

.article_table { width:70%; margin-top:20px; padding:0 15%; }
.article_name { width:80%; float:left; font-size:14px; height:30px; line-height:30px; color: #000; border-bottom:1px solid #BBB; }
.article_prix { width:20%; float:right; font-size:14px; height:30px; line-height:30px; text-align:right; color: #000; border-bottom:1px solid #BBB; }
.article_content { width:100%;  height:100%; height: auto !important; word-break: break-all; overflow:hidden; margin-bottom:20px; }

/* galerie */
#galerie_bg { width:100%; height:100%; height: auto !important; margin-top:120px;  background-image:url("../images/bg.jpg") ;background-attachment:fixed; background-repeat:no-repeat; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover;  }
#galerie_panel { width:980px; min-height:726px; _height:726px; height:100%; height: auto !important; background-color:rgba(47, 29, 5, 0.02); margin:0 auto; padding:10px; }
#galerie_table { width:95%; margin:20px 0 0 5%; }
#galerie_table p { margin: 0; padding: 10px 0; }
#galerie_table a { outline: none; }
#galerie_table a img { border: 1px solid #e4b51f; padding: 2px; margin: 10px 1% 10px 0; width:23%;  }


/******************************************* mobile ****************************************/
@media only screen and (max-width: 1000px){
/* head */
#logo { width:50%;  float:left; margin-left:10px; }
#link { width:35%;  float:right; margin-bottom:15px; }
#menu { display:none; }
#menu_mobile { display: block; width:100%; top:auto; bottom:0; position:fixed; height:40px; line-height:40px; border-radius:0; border:0.3vw solid #33322f; border-style:solid solid solid none; font-size:4vw; }
/*#menu a { float:left; display:block; width:30%; height:40px; line-height:40px; border-left:0.3vw solid #e4b51f; margin-right:2.5%; text-align:center; padding:0; background-color:#e2af21; }*/
#menu_mobile a { float:left; display:block; width:24.7%; height:40px; line-height:40px; color:#fff; border-left:0.3vw solid #fff; text-align:center; padding:0; background-color:#33322f; }
#menu_mobile a:hover { color:#fff; }
#tel { width:45%;  float:right; height:20px; line-height:20px; text-align:center; padding:3px 1% 8px 0; border-radius: 10px 0 0 10px; font-size:4.5vw; background-color:#33322f; }
#tel span { font-size:4vw; font-weight:bold; color:#000; }
#tel a { color:#fff; }
#tel a:hover { color:#fff; }

/* index */
#main { margin-top: 120px; }
#index_pub {	width:100%; float:none; position:relative; margin:1px 0; font-size:3.5vw; padding: 10px 2%; height:100%; height: auto !important; }

/* footer */
#footer { font-size:2.5vw; z-index:999; }

/* contact */
#contact_bg { width:100%; height:100%; height: auto !important; margin-top:120px; }
#contact_panel { width:100%; min-height:100px; _height:100px; height:100%; height: auto !important; padding:0px; }
#contact_banner { width:100%; height:100%; height: auto !important; margin:0 auto; }
#contact_left { width:100%; min-height:50px; _height:50px; height: auto !important; margin-top:0px; box-shadow: 0px 10px 5px rgba(63, 66, 64, 0.17); border:0px; background-color:rgba(173, 245, 224, 0.27); }
#contact_right{ width:100%;  height:200px; height:100%; height: auto !important; margin-top:20px;  }


/* famille list */
.dropdown-famille-panel { display:none; position:fixed; z-index:1000; width:60%; left:25%; top:auto; bottom:41px; background-color: rgba(5, 111, 77, 0.86); }
.dropdown-famille-list {  width:99%; padding-left:1%; color:#fff; font-size:4vw; }
.dropdown-famille-list ul { width:100%; }
.dropdown-famille-list li  { line-height:25px; width:100%; border-bottom:1px solid #e4b51f; }

/* product */
.banner { width:100%; position:relative;  background-color: rgba(0,102,51,0.6); }
.banner img { display:none; }
.nomfamille { width: 95%; height:40px; line-height:40px; padding-left:5%; bottom:auto; position:relative; font-size:4.5vw; color:#fff; background-color:rgba(13, 175, 11, 0.8);; }
.product_table { width:100%;  min-height:310px; _height:310px; height:100%; height: auto !important; }
.product_table ul { width:100%; float:left; }
.product_table ul li { width:47.5%; height:100%; float:left; padding:1%; border:1px solid #E6E6E6; border-style:none solid solid none;  position:relative; }

/* detail */
.detail_box { width:100%; position:absolute; left:0; background-color:#fff; z-index:10000; box-shadow: 0px 10px 5px #00483a; }
.fermer { width:100%; height:30px; line-height:30px; background-color:rgba(0,102,51,0.6); margin-bottom:10px; }
.fermer a { float:right; color:#fff; font-size:10px; font-weight:lighter; margin-right:10px; }
.detail_image { width:100%; }
.detail_image img{ width:100%;}
.detail_right { width:98%; margin:0 auto; }
.detail_name { width:98%; height:40px; line-height:40px; color:#00483a; font-size:16px; margin-bottom:10px; }
.detail_content { width:98%; height:100%; color:#e2af21; word-break: break-all; overflow:hidden; }
.detail_prix { width:98%; height:40px; line-height:40px; color:#00483a; font-size:20px;  position:relative; margin-top:30px; }

/* article */
#article_panel { width:100%; min-height:100px; _height:100px; height:100%; height: auto !important; padding:0px; }
#article_banner { width:99%; height:100%; height: auto !important; margin:0 auto; padding-left:1%; }
#article_banner  img { display:none; }
#article_left { width:100%; margin-top:0; }
#article_right{ width:100%; height:100%; height: auto !important; margin-top:20px; }
#photo_table { width:100%; margin:0; }
#photo_table p { margin: 0; height:100%; height: auto !important;padding: 10px 0; }
#photo_table a img { border: 1px solid #e4b51f; padding:0; margin:10px 1%; width:45%; }
.article_table { width:90%; padding:0 5%; }
.article_name { width:80%; float:left; font-size:13px; height:30px; line-height:30px; border-bottom:1px solid #BBB; }
.article_prix { width:20%; float:right; font-size:16px; height:30px; line-height:30px; text-align:right; border-bottom:1px solid #BBB; }
.article_content { width:100%;  height:100%; height: auto !important; word-break: break-all; overflow:hidden; margin-bottom:20px; }

/* galerie */
#galerie_bg { width:100%; height:100%; height: auto !important; margin-top:120px; background-color:#e4b51f; }
#galerie_panel { width:100%; min-height:200px; _height:200px; height:100%; height: auto !important; background-color:rgba(255, 255, 255, 0); margin:0 auto; padding:0px; }
#galerie_table { width:99%; margin:0 0 0 1%; }
#galerie_table p { margin:0; height:100%; height:auto !important; padding:10px 0; }
#galerie_table a { outline:none; }
#galerie_table a img { border: 1px solid #BBB; padding:0; margin:10px 1%; width:30%; }

}

