/* VARIABLES */
/* BASE */
html,
body {
  font-family: 'Roboto', sans-serif;
  font-size: 1em;
  line-height: 1.4;
  height: 100%;
  margin: 0;
  padding: 0;
  background:url(../images/HD/html_fond_2.png) no-repeat;
}/**/

a {
  text-decoration: none;
  color: inherit;
}

.container {
  overflow: hidden;
  *zoom: 1;
  margin: 0 20px;
}

.site-content {
  padding-top: 127px; overflow:auto;
}

/* HEADER */
.header {
  position: fixed; /*  relative; fixed;*/
  left: 0;
  right: 0;
 /* text-align:left;*/
  height: 127px;
  line-height: 60px;
  color: #fff;
  float:left;
  /*background-color: #3f51b5;*/
}

.header__logo {
  font-weight: 700;
  padding: 0 0px;
  float: left;
  height:121px;
}

/* MENU */
.menu {
  float: left;
}
.menu a {
  padding: 0 10px;
}
.menu a:hover {
  color: #c5cae9;
}

/* RESPONSIVE */
@media only screen and (max-width: 768px) 
{
	html,body {
	  font-family: 'Roboto', sans-serif;
	  font-size: 1em;
	  line-height: 1.4;
	  height: 100%;
	  margin: 0;
	  padding: 0;
	}
  	.site-pusher,
  	.site-container 
	{
    	height: 100%;
  	}

  	.site-container 
	{
    	overflow: hidden;
		background:url(../images/768/html_fond_3.png) #666 no-repeat;
  	}

  	.site-pusher 
	{
    	-webkit-transition-duration: 0.3s;
   		transition-duration: 0.3s;
    	-webkit-transform: translateX(0px);
    	transform: translateX(0px);
  	}

  	.site-content 
	{
    	position: absolute;
    	top:42px;
    	right: 0;
    	left: 0;
   		bottom: 0;
    	padding-top: 0;
    	overflow-y: scroll;
    	-webkit-overflow-scrolling: touch;
  	}

  	.header 
	{
    	position: static;
		background:url(../images/768/frise2_03.png) no-repeat  top;
  	}
  	.slogan{  display:none;  }

  	.header__icon 
	{
    	position: relative;
    	display: block;
    	float: left;
    	width: 20px;
    	height: 42px;
    	cursor: pointer;
		bottom: 10px;
  	}
  	.header__icon:after 
	{
    	content: '';
		position: absolute;
		display: block;
		width: 1rem;
		height: 0;
		top: 16px;
		left: 5px;
		box-shadow: 0 10px 0 1px #fff, 0 16px 0 1px #fff, 0 22px 0 1px #fff;
  	}
  	.header__logo 
	{
  		font-weight: 700;
  		padding: 0 0px;
  		float: left;
  		height:42px;
	}

  .menu {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    background-color: #3849a2;
    /*    overflow-y: scroll;
        -webkit-overflow-scrolling: touch;*/
    width: 150px;
    -webkit-transform: translateX(-150px);
    transform: translateX(-150px);
  }
  .menu a 
  {
		display: block;
		height: 40px;
		text-align: center;
		line-height: 40px;
		border-bottom: 1px solid #3f51b5;
  	}
  	.menu a:hover, .menu a.current {
  		color: #c5cae9;
	}

	.menu img{ display:none;}

  	.with--sidebar .site-pusher 
	{
    	-webkit-transform: translateX(150px);
    	transform: translateX(150px);
  	}
  	.with--sidebar .site-cache 
	{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.6);
  	}
  	#caption1
	{ /*display: table-footer-group;*/
		position: absolute ;
		right:-100px;
		top:720px;
		bottom:10px;
		width:600px;
		height:210px;
		background-color: rgba(200,250,255,0.6);
		z-index:7;
		float:right;/**/
	}
	#capt1
	{ table-footer-group;/**/
		position:relative;/* absolute ;  */
		right:0px;
		/*padding-bottom:650px;*/
		top:200px;
		/*bottom:50px;
		bottom:-200px;*/
		width:100%;
		height:200px;
		/*background-color: rgba(200,250,255,0.6);*/
		/*z-index:7;*/
		float:right;
	}
	
	#caption2
	{/*
		position: absolute ;
		right:-100px;
		top:720px;
		bottom:10px;
		width:600px;
		height:210px;
		background-color: rgba(200,250,255,0.6);
		z-index:7;
		float:right;*/
	}
	#capt2
	{
		position: relative ;
		/*right:-100px;
		top:720px;
		bottom:10px;*/
		width:100%;
		/*height:200px;
		background-color: rgba(200,250,255,0.6);
		float:right;/**/
	}
	  /* TITRE CUISINE */
	.caption3
	{ 
		position: relative; 
		top: 0px; 
		left: 0px;
		 width: 100%; 
		 height: 30px; 
		 font-size: 24px; 
		 line-height: 30px;
		filter:alpha(opacity=60.0);
		background-color: rgba(10,10,10,0.6);
		 text-align:center;
		 z-index:8;/**/
	}
	.capt3
	{ /*display:none;*/
		position: relative; 
		top: 0px; 
		left: 0px;
		 width: 100%; 
		 height: 20%; 
		 font-size: 14px;
		 color:#FFF;
		 line-height: 20px;
		filter:alpha(opacity=60.0);
		background-color: rgba(10,10,10,0.6);
		 text-align:center;
	}
	
	/* DESCRIPTIF CUISINE */
	.caption4
	{ /*display:none;*/
		/*position: relative; 
		top: 0px; 
		left: 0px; 
		width: 100%; 
		height: 40px; 
		font-size: 13px; */
		/*line-height: 15px; 
		text-align: left;"	
		z-index:8;*/
	}
	.capt4
	{ display:none;*/*/
		/*position: relative; 
		top: 0px; 
		left: 0px; 
		width: 100%; 
		height: 40px; 
		font-size: 13px; 
		line-height: 25px; 
		text-align: left;"	
		z-index:8;*//**/
	}
	/* FOOTER*/
	#footer
	{
		height:25px;
		/*width:1200px;
		margin:0;*/
		width:100%;
		background: url(../images/768/ombre_Bas.png) #666 repeat top;/**/
		font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif,"din_lightregular"; 
		font-size:7px;
		font-weight:bold;
		color:#FFF;
		/*margin: 15px 0px 0px 0px;
		padding-top:25px;*/
		text-align:center;
		position:fixed;/*IMPORTANT pour que le footer RESTE en BAS*/
		bottom:0px; /*le footer reste ne bas à ZERO*/
		width : 100%;  /*FORCER le footer à rester à la taille de la FENETRE*/
		left:0px;
	}

	#footer_texte
	{
		float:left;
		height:25px;
		/*width:85%;*/
		padding-left:5px;
		overflow:hidden;
	}
	/* FACEBOOK */
	#footer_fb
	{
		position:absolute;
		width:51px;
		height:15px;
		float:right;
		right:0px;
		bottom:3px;
		background:url(../images/768/facebook_off.png) right no-repeat;
	}
	
	#footer_fb:hover
	{
		/*width:128px;
		height:37px;
		float:right;*/
		background:url(../images/768/facebook_on.png) right no-repeat;
	}
	#footer_fb_texte
	{
		text-align:center;
		/*height:15px;*/
		line-height:1em;
		text-shadow: 3px 2px 2px rgba(0, 0, 0, 0.9);
		color: #F9F2F4;
		font-size: 7px;
		text-decoration: none ;
	}	
	#map_canvas
	{	width:100%;
		height:100%;
		padding-top:10px;
	}
}
@media only screen and (min-width: 769px) and (max-width: 850px) 
{
	html,body {
	  font-family: 'Roboto', sans-serif;
	  font-size: 1em;
	  line-height: 1.4;
	  height: 100%;
	  margin: 0;
	  padding: 0;
	}
  	.site-pusher,
  	.site-container {
    	height: 100%;
 	 }

  	.site-container {
		overflow: hidden;
		background:url(../images/769-850/html_fond_3.png) #666 no-repeat;
  	}

  	.site-pusher {
    	-webkit-transition-duration: 0.3s;
    	transition-duration: 0.3s;
    	-webkit-transform: translateX(0px);
    	transform: translateX(0px);
  	}
  	.site-content 
	{
    	position: absolute;
    	top:60px;
    	right: 0;
    	left: 0;
   		bottom: 0;
    	padding-top: 0;
    	overflow-y: scroll;
    	-webkit-overflow-scrolling: touch;
  	}

  	.header {
	  position: fixed; /*  relative; fixed;*/
	  left: 0;
	  right: 0;
	 /* text-align:left;*/
	  height: 80px;
	  background:url(../images/769-850/frise2_03.png) left no-repeat;
	  color: #fff;
	  float:left;
  }
  .slogan{
	  	font-size:12px; 
	  	text-shadow: 3px 3px 7px rgba(44, 172, 247, 0.75);
		color: #FFF;
		font-weight:bold;
		line-height: 40px;
  }

  	.header__icon 
	{
		display:none;/*
    	position: relative;
    	display: block;
    	float: left;
    	width: 20px;
    	height: 42px;
    	cursor: pointer;
		bottom: 10px;*/
  	}
  	.header__icon:after 
	{/*
    	content: '';
		position: absolute;
		display: block;
		width: 1rem;
		height: 0;
		top: 16px;
		left: 5px;
		box-shadow: 0 10px 0 1px #fff, 0 16px 0 1px #fff, 0 22px 0 1px #fff;*/
  	}
  	.header__logo 
	{
  		font-weight: 700;
  		padding: 0 0px;
  		float: left;
  		height:75px;
	}

  .menu {
		position: absolute;
	  	float: left;
	  	font-size:10px;
		left:155px;
		line-height: 42px;
		
	}
	.menu a {
	  /*	padding: 0 20px;*/
	  	display: inline-block;
    	text-align: center;
		/*background:url(../images/769-850/ombre_Bouton2.png) no-repeat right;*/
	}
  .menu a:hover, .menu a.current {
  color: #c5cae9;
}
	.menu img{
		padding-top:5px;
	}
	#frise_separation{background:url(../images/769-850/ombre_Bouton2.png) no-repeat right; float:left;}
  .with--sidebar .site-pusher {
   /* -webkit-transform: translateX(150px);
    transform: translateX(150px);*/
  }
  	.with--sidebar .site-cache 
	{
		/*position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.6);*/
  	}
  	
	
	.with--sidebar .site-pusher {
    	-webkit-transform: translateX(150px);
    	transform: translateX(150px);
  	}
  	.with--sidebar .site-cache {
   		 position: absolute;
    	top: 0;
    	left: 0;
    	right: 0;
    	bottom: 0;
    	background-color: rgba(0, 0, 0, 0.6);
  	}
  	#360_h
  	{
	  	height:600px;
	}
	#map_canvas
	{	width:100%;
		height:100%;
		padding-top:20px;
	}

}
@media only screen and (min-width:851px) and (max-width: 1024px) 
{
	html,body 
	{
	  font-family: 'Roboto', sans-serif;
	  font-size: 1em;
	  line-height: 1.4;
	  height: 100%;
	  margin: 0;
	  padding: 0;
	}
  	.site-pusher,
  	.site-container {
    	height: 100%;
 	 }

  	.site-container {
		overflow: hidden;
		background:url(../images/851-1024/html_fond_2.png) #666 no-repeat;
  	}

  	.site-pusher {
    	-webkit-transition-duration: 0.3s;
    	transition-duration: 0.3s;
    	-webkit-transform: translateX(0px);
    	transform: translateX(0px);
  	}

  	.site-content {
    	position: absolute;
    	top: 96px;
    	right: 0;
    	left: 0;
    	bottom: 0;
    	padding-top: 0;
    	/*overflow-y: scroll;*/
    	-webkit-overflow-scrolling: touch;
  	}

  	.header {
	  	position: fixed; /*  relative; fixed;*/
	  	left: 0;
	  	right: 0;
	 	/* text-align:left;*/
	 	 height: 110px;
	  	line-height: 60px;
	  	color: #fff;
	  	float:left;
		background:url(../images/851-1024/frise2_03.png) left no-repeat;
  	}
  	.slogan{
	  	font-size:16px; 
	  	text-shadow: 3px 3px 7px rgba(44, 172, 247, 0.75);
		color: #FFF;
		font-weight:bold;
		line-height: 55px;
  	}/**/

  	.header__logo {
  		font-weight: 700;
  		padding: 0 0px;
  		float: left;
  		height:108px;
	}

	  /* MENU */
	.menu {
		position: absolute;
	  	float: left;
	  	font-size:11px;
		left:250px;
		line-height: 52px;
	}
	.menu a {
	  	padding: 0 10px;
	  	display: inline-block;
    	/*height: 10px;*/
    	text-align: center;
    	/*line-height: 10px;*/
	}
	.menu a:hover, .menu a.current {
  color: #c5cae9;
}
 
  	.with--sidebar .site-pusher {
    	-webkit-transform: translateX(150px);
    	transform: translateX(150px);
  	}
  	.with--sidebar .site-cache {
   		 position: absolute;
    	top: 0;
    	left: 0;
    	right: 0;
    	bottom: 0;
    	background-color: rgba(0, 0, 0, 0.6);
  	}
  	#360_h
  	{
	  	height:600px;
	}
	#map_canvas
	{	width:100%;
		height:100%;
		padding-top:20px;
	}
  
}
@media only screen and (min-width: 1025px) 
{
	html,body 
	{
	  font-family: 'Roboto', sans-serif;
	  font-size: 1em;
	  line-height: 1.4;
	  height: 100%;
	  margin: 0;
	  padding: 0;
	}
  	.site-pusher,
  	.site-container {
    	height: 100%;
 	 }

  	.site-container {
		overflow: hidden;
		background:url(../images/HD/html_fond_2.png) #666 no-repeat;
  	}

  	.site-pusher {
    	-webkit-transition-duration: 0.3s;
    	transition-duration: 0.3s;
    	-webkit-transform: translateX(0px);
    	transform: translateX(0px);
  	}

  	.site-content {
    	position: absolute;
    	top: 106px;
    	right: 0;
    	left: 0;
    	bottom: 0;
    	padding-top: 0;
    	/*overflow-y: scroll;*/
    	-webkit-overflow-scrolling: touch;
  	}

  	.header {
	  	position: fixed; /*  relative; fixed;*/
	  	left: 0;
	  	right: 0;
	 	/* text-align:left;*/
	 	 height: 127px;
	  	line-height: 60px;
	  	color: #fff;
	  	float:left;
		background:url(../images/HD/frise2_02.png) left no-repeat;
  	}
  	.slogan{
	  	font-size:18px; 
	  	text-shadow: 3px 3px 7px rgba(44, 172, 247, 0.75);
		color: #FFF;
		font-weight:bold;
		line-height: 70px;
  	}/**/

  	.header__logo {
  		font-weight: 700;
  		padding: 0 0px;
  		float: left;
  		height:118px;
	}

	  /* MENU */
	.menu {
		position: absolute;
	  	float: left;
	  	font-size:13px;
		left:250px;
		line-height: 52px;
	}
	.menu a {
	  	padding: 0 15px;
	  	display: inline-block;
    	/*height: 10px;*/
    	text-align: center;
    	/*line-height: 10px;*/
	}
	.menu a:hover, .menu a.current {
  color: #c5cae9;
}
 
  	.with--sidebar .site-pusher {
    	-webkit-transform: translateX(150px);
    	transform: translateX(150px);
  	}
  	.with--sidebar .site-cache {
   		 position: absolute;
    	top: 0;
    	left: 0;
    	right: 0;
    	bottom: 0;
    	background-color: rgba(0, 0, 0, 0.6);
  	}
  	#360_h
  	{
	  	height:600px;
	}
	#map_canvas
	{	width:100%;
		height:100%;
		padding-top:20px;
	}
  
}
.jssora02l, .jssora02r 
{
	display: block;
	position: absolute;
	/* size of arrow element */
	width: 55px;
	height: 55px;
	cursor: pointer;
	background: url('img/a02.png') no-repeat;
	overflow: hidden;
}
.jssora02l { background-position: -3px -33px; }
.jssora02r { background-position: -63px -33px; }
.jssora02l:hover { background-position: -123px -33px; }
.jssora02r:hover { background-position: -183px -33px; }
.jssora02l.jssora02ldn { background-position: -3px -33px; }
.jssora02r.jssora02rdn { background-position: -63px -33px; }

        /* jssor slider thumbnail navigator skin 03 css */
        /*
        .jssort03 .p            (normal)
        .jssort03 .p:hover      (normal mouseover)
        .jssort03 .pav          (active)
        .jssort03 .pdn          (mousedown)
        */
/* REGLAGE DES PETITES IMAGES */ 
       
/* CONTENAIRE PETITES IMAGES*/
#thumbnav
{
	position: relative;
	left:100px;
	top:810px;
	bottom:10px;
	width:1750px;
	height:120px;
	z-index:4;
}
/* FIN CONTENAIRE PETITES IMAGES*/
/* TAILLES DES PETITES IMAGES*/
.jssort03 .p 
{
	position: absolute;
	top: 0;
	left: 0;
	width: 190px;
	height: 100px;
}
        
.jssort03 .t 
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
        
.jssort03 .w, .jssort03 .pav:hover .w 
{
	position: absolute;
	width: 200px;
	height: 120px;
	border: white 1px dashed;
	box-sizing: content-box;
}
        
.jssort03 .pdn .w, .jssort03 .pav .w 
{
	border-style: solid;
}
        
.jssort03 .c 
{
	position: absolute;
	top: 0;
	left: 0;
	width: 200px;
	height: 120px;
	background-color: #000;
	filter: alpha(opacity=45);
	opacity: .45;
	transition: opacity .6s;
	-webkit-transition: opacity .6s;
	-o-transition: opacity .6s;
}
        
.jssort03 .p:hover .c, .jssort03 .pav .c 
{
	filter: alpha(opacity=0);
	opacity: 0;
}
        
.jssort03 .p:hover .c 
{
	transition: none;
	-moz-transition: none;
	-webkit-transition: none;
	-o-transition: none;
}
        
* html .jssort03 .w 
{
	width /**/: 200px;
	height /**/: 120px;
}
/* FIN TAILLES DES PETITES IMAGES*/
/* FIN REGLAGE DES PETITES IMAGES */ 		
		
	
.jssor_1
{
	/*background:#666;*/
	position: relative; 
	margin: 0 auto; 
	/*top: 0px; 
	left: 0px; */
	text-align:center;
	width: 1900px; 
	height: 930px; 
	/**/overflow: hidden; 
	visibility: hidden;
	/*z-index:1;*/
}

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

.loading1
{
	filter: alpha(opacity=70); 
	opacity: 0.7; 
	position: absolute; 
	display: block; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%;
}

.loading2
{
	position:absolute;
	display:block;
	background:url('img/loading.gif') no-repeat center center;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}

/* ESPACE D'AFFICHAGE DU SLIDE */
.slides
{
	position: relative; 
	margin:0 auto; 
	margin-left:100px;
	margin-right:100px;/**/
	width: 1700px; 
	height: 947px; 
	z-index:2;
}

.zone-image
{
	 display: none;
}

/* TAILLE DE L'IMAGE DU SLIDER */
#image
{
	width:1700px;
	height:920px;
	z-index:2;
}


#thumbnav2
{
	position: relative;
	left:800px;
	top:200px;
	bottom:10px;
	width:400px;
	height:180px;
	z-index:4;
}
.thumbnav1
{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height:100%; 
	background-color: #000; 
	filter:alpha(opacity=30.0); 
	opacity:0.3;
	z-index:3;
}

.thumbnav3
{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height:100%; 
	background-color: #FFF; 
	filter:alpha(opacity=30.0); 
	opacity:0.3;
	z-index:3;
}

#thumb-image
{
	position:relative;
	width:100px;
	height:60px;
	z-index:6;	
}

/* CONTENAIRE DESCRIPTIF CUISINE */
#caption1
{
	position: relative; /**/
	margin-left: 1090px;
	top: -340px; 
	width: 600px; 
	height: 250px;
	filter:alpha(opacity=30.0);
	background-color: rgba(200,250,255,0.6);/* rgba(40,177,255,0.6);
	margin-right:10px;*/
	z-index:7;
}

#caption2
{
	position: absolute ;
	right:-100px;
	top:720px;
	bottom:10px;
	width:600px;
	height:250px;
	background-color: rgba(200,250,255,0.6);
	z-index:7;
	float:right;
}
/* TITRE CUISINE */
.caption3
{
	position: relative; 
	top: 0px; 
	left: 0px;
	 width: 100%; 
	 height: 60px; 
	 font-size: 24px; 
	 line-height: 30px;
	filter:alpha(opacity=60.0);
	background-color: rgba(10,10,10,0.6);
	 text-align:center;
	 z-index:8;
}

/* DESCRIPTIF CUISINE */
.caption4
{
	position: relative; 
	top: 20px; 
	left: 10px;
	padding-right:10px;
	/*margin-right:10px;
	right:20px;*/
	width: 98%; 
	height: 100px; 
	font-size: 15px; 
	line-height: 15px; 
	text-align: left;	
	z-index:8;
}