@charset "UTF-8";

@font-face {
    font-family: 'vieuxfour';
    src: url('../fonts/vieuxfour.eot');
    src: url('../fonts/vieuxfour.eot?#iefix') format('embedded-opentype'),
         url('../fonts/vieuxfour.woff') format('woff'),
         url('../fonts/vieuxfour.ttf') format('truetype'),
         url('../fonts/vieuxfour.svg#vieuxfour') format('svg');
    font-weight: normal;
    font-style: normal;

}
html, body{

	margin:0;
	padding:0;
	height:100%;
	width:100%;
	min-width: 1300px;
	font-family: 'Trocchi', serif, Helvetica,Arial,Tahoma,Sans-Serif;
	font-size:14px;
	background:#616161;
	
	
}
h2 {
	font-family: 'Alegreya SC', Georgia, serif;
	letter-spacing:0px;
	font-size: 3.5em;
	color: #616161;
	text-align:left;
	margin-top:20px;
}

h3 {
	font-family: 'Alegreya SC', Georgia, serif;
	letter-spacing:0px;
	font-size: 2em;
	color: #616161;
	text-align:left;
	margin-top:20px;
}
strong {
	color:#414141;
}
#navbar  {
	position:absolute;
	margin:0;
	bottom:0;
	width:100%;
	min-width: 1300px;
	height:75px;
	background:#616161;
	z-index:1000;
	opacity:1;
}

.nav ul {
	 height:75px;
	width: 1240px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	font-size: 1.5em;
	font-weight: 300;
}

.nav li span {
	display: block;
	height:55px;
	padding:23px 20px 0 20px;
	font-family: 'Alegreya SC', Georgia, serif;
	font-size:20px;
	color:#FFF;
}

.nav li:nth-child(6n+4) {
	width:250px;
	/*background: #FFF2CB;*/
}

.nav a {
		display: block;
		width: auto;
		height:75px;
		text-decoration:none;
			}
	.nav a:hover span,
	.nav a:active span,
	.nav a:focus span{
		background:#C1C0C2;
		color:#616161;
		height:65px;
		
	}
	.nav a:hover:after {
		content: '';
		float:right;    
	  top: 62px;
	  margin: -13px -13px 0 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 13px 13px 0 0;
	border-color: #A3A2A3 transparent transparent transparent;
	}

.nav li {
		float: left;
		width: 15%;
		text-align: center;
		-webkit-transition: border .5s;
		-moz-transition: border .5s;
		-o-transition: border .5s;
		-ms-transition: border .5s;
		transition: border .5s;
	}
	#navbar_scroll .nav li {
		width: 13%;
	}
	#navbar_scroll .nav li:nth-child(6n+2) {
	width:170px;
	/*background: #FFF2CB;*/
}
	#navbar_scroll .nav li:nth-child(6n+5) {
	width:250px;
	/*background: #FFF2CB;*/
}
#navbar_scroll {
	position:fixed;
	width:100%;
	height:75px;
	background:rgba(97,97,97,.9);
	opacity:0;
	z-index:10000;
	color: rgba(59,48,1, .9);
}
#logo{
	background:url(../images/logo.png) center no-repeat;
	position:relative;
	height:20%;
	padding-bottom:50px;
	
}
#horaire{
	background:url(../images/horaire.png);
	position:absolute;
	top:0;
	left:0;
	width:400px;
	height:398px;
	z-index:1000;
	
}

#content_slide{
	position:relative;
	margin-top:10px;
}
#accueil{
	height: 100%;
	width: 100%;
	min-width: 1240px;
	background:url(../images/fd.jpg) center repeat-x;
	overflow-x: hidden;
	  background-attachment:fixed;

}
#mention{
	height: 100%;
	width: 100%;
	min-width: 1240px;
	background:url(../images/fd.jpg) center repeat-x;
  	background-attachment:fixed;
	padding-bottom:150px;

}
#fond{
position:absolute;
background:url(../images/fd-d.png) center 50% no-repeat fixed;
margin:0;
padding:0;
width:100%;
height:100%;
 -webkit-background-size: auto; /* pour Chrome et Safari */
  -moz-background-size: auto; /* pour Firefox */
  -o-background-size: auto; /* pour Opera */
  background-size: auto; /* version standardisée */
}
#fondfm{
position:absolute;
background:url(../images/fm.jpg) center 50% no-repeat fixed;
margin:0;
padding:0;
width:100%;
height:100%;
 -webkit-background-size: auto; /* pour Chrome et Safari */
  -moz-background-size: auto; /* pour Firefox */
  -o-background-size: auto; /* pour Opera */
  background-size: auto; /* version standardisée */
}


#presentation, #cuisine, #resa{
	height: 100%;
	width: 100%;
	min-width: 1240px;
	background:#CCC;
		overflow:hidden;
	background-size:cover;
	z-index:1001;

}
#photo, #diapo, #contact, #actualite{
	height: 100%;
	width: 100%;
	min-width: 1240px;
	background:#FFF;
	z-index:1000;
		overflow:hidden;

	

}
#actualite {
	background:url(../images/encart_fd.jpg) center 0 repeat-x ;
	background-attachment:fixed;
}
#diapo {
	background:url(../images/encart2_fd.jpg) center 0 repeat-x ;
	background-attachment:fixed;
}
#photo {
	height: 480px;
	background:url(../images/PS.jpg) 0 bottom repeat-x;
	-webkit-background-size:cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment:fixed;
}

#footer{
	position:relative;
	/*margin-top:-75px;*/
	height:55px;
	background:#616161;
	padding:20px 20px 0 20px;
	font-family: 'Alegreya SC', Georgia, serif;
	font-size:14px;
	font-weight: 100;
	color:#FFF;
}
#footer a{
	text-decoration:none;
	color:#C1C0C2;
}

.slide_inside {
	width: 1240px;
	margin: 0 auto;
	height:100%;

}
.content_visible {
	position:absolute;
	width: 1240px;
	margin: 0 auto;
	overflow:hidden;
	height:100%;
}
.fixed{
	position:fixed;
	z-index:10000;
	color: rgba(59,48,1, .9);
}
.nofixed{
	position:absolute;
	bottom:0;
}
 .select a span{
	 background:#C1C0C2;
	color:#616161;
	height:65px;

}
.select a:after {
	content: '';
	float:right;    
	top: 62px;
	margin: -13px -13px 0 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 13px 13px 0 0;
	border-color: #A3A2A3 transparent transparent transparent;
	}
 .select a i{
	 padding-top:0.5em;
	font-size: 0.5em;
	

}
#map-canvas{
	margin-top:calc(25% + 55px);
	float:right;
	width:750px;
	height:550px;
	background:#0C3;
}
#formulaire, #gallery  ,#box_pres_1  ,#box_cuis_2{
	position:relative;
	padding-top:calc(25% - 55px);
	width:450px;

}

#box_pres_2 ,#box_cuis_1{
	position:relative;
	padding-top:calc(25% - 55px);
	width:600px;

}
#seminaire{
	position:relative;
	padding-top:calc(25% - 55px);
}
#groupe{
	
	width:900px;
	
} 
#groupe_image{

	width:900px;
}
.slide_inside p{
padding-left:20px;
border-left:5px solid  #FFF;
text-align:justify;
}
#formulaire p {
	border-left:5px solid  #616161;
}
#box_pres_1 ,#box_cuis_1, #event{
	float:left;
}
#box_pres_2 ,#box_cuis_2, #newletter{
	float:right;
}
#event {
	position:relative;
font-family: 'Oleo Script', cursive;
font-size:60px;
color:#FFF;
text-align:center;

width:650px;
height:100%;
}
#newletter{
	position:relative;
	width:450px;
	height:100%;
}
#newletter div{
	
	
}
#event p{
	position:relative;
	vertical-align: middle; display: inline;
	top:50%;
}
#event img{
	position:relative;
	vertical-align: middle; display: inline;
	top:50%;
	margin-top:-337px
}
#event img:before, #event img:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: rgba(0, 0, 0, 0.7);
  -webkit-box-shadow: 0 15px 10px rgba(0,0,0, 0.7);
  -moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}

#event img:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}
#box_new {
	position:relative;
	background:url(../images/box.png) center center no-repeat;
	border-radius:5px;
	width:350px;
	padding:60px 20px 20px 20px;
	height: 270px;
	top:calc(50% - 135px);
	
	z-index:0;
}


#box_new h2 {
	font-family: 'Alegreya SC', Georgia, serif;
	letter-spacing:0px;
	font-size: 2em;
	color: #616161;
	text-align:center;
	margin:0;
}
#box_new p {
	padding-left:0px;
	border-left:0px solid  #FFF;
	text-align:justify;
}
#box_new i {
	color:#C1C0C2;
}



.label {
    background: none repeat scroll 0 0 #C1C0C2;
    border: 1px solid #717071;
    color: #616161;
    display: inline-block;
    height: 16px;
    margin-bottom: 10px;
    margin-right: -5px;
    padding: 8px 5px;
    text-align: left;
    vertical-align: top;
    width: 100px;
}
.labelMessage {
    background: none repeat scroll 0 0 #C1C0C2;
    border: 1px solid #717071;
    color: #616161;
    display: inline-block;
    height: 192px;
    margin-bottom: 10px;
    margin-right: -5px;
    padding: 8px 5px;
    text-align: left;
    vertical-align: top;
    width: 100px;
}

input:not(.bouton):not(.radioform):not(#validcode) {
	
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
  	border-color: #D1D1D1 #D1D1D1 #D1D1D1 -moz-use-text-color;
    border-image: none;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    height: 30px;
    outline: medium none;
    padding-left: 5px;
    padding-right: 25px;
    width: 275px;
}
input[type="radio"] , input[type="checkbox"] {
	-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
  	border-color: #D1D1D1 #D1D1D1 #D1D1D1 -moz-use-text-color;
    border-image: none;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    background: #FFFFFF;
    height: 34px;
    outline: medium none;
    padding-left: 5px;
    padding-right: 25px;
    width: 30px;
}
#box_new input:not(.bouton):not(.radioform) {
	  -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
  	border-color: #D1D1D1;
    border-image: none;
    border-style: solid;
    border-width: 1px;
    height: 30px;
	padding-left: 5px;
    padding-right: 0px;
	margin:10px 0 10px 0;
    width: calc(100% - 5px);
}
select:not(.bouton):not(.radioform) {

    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
  	border-color: #D1D1D1 #D1D1D1 #D1D1D1 -moz-use-text-color;
    border-image: none;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    height: 34px;
    outline: medium none;
    padding-left: 5px;
    padding-right: 25px;
    width: 225px;
	margin-left:-4px;
}
textarea {
    border-color: #D1D1D1 #D1D1D1 #D1D1D1 -moz-use-text-color;
    border-image: none;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    font-family: Helvetica,Verdana;
    height: 200px;
    margin-bottom: 10px;
    outline: medium none;
    overflow: hidden;
    padding: 8px 25px 0 5px;
    resize: none;
    transition: height 500ms ease 0s;
    width: 275px;
}
textarea:focus {
    border: 1px solid #616161;
    height: 200px;
    width: 275px;
}
input:required, textarea:required {
    background: url("../images/icons/required.png") no-repeat scroll 98% center #FFFFFF;
}
input:focus:valid:not(.bouton), textarea:focus:valid {
    background: url("../images/icons/valid.png") no-repeat scroll 98% center #FFFFFF;
}
input:focus:invalid:not(.bouton), textarea:focus:invalid {
    background: url("../images/icons/invalid.png") no-repeat scroll 98% center #FFFFFF;
}
input:required:valid:not(.bouton), textarea:required:valid {
	-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: url("../images/icons/valid.png") no-repeat scroll 98% center #FFFFFF;
	border-color: #58B1FC #58B1FC #58B1FC -moz-use-text-color;
    border-image: none;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
	height: 34px;
}
#validcode{
	position:absolute;
  	border: 1px solid #D1D1D1 ;
    height: 30px;
	margin-top:0;
	margin-left:150px;
    width: 150px;
}

#vcd{
		position:absolute;
		float:left;
		margin-top:7px;
		color:#FFF;
	}
.bouton {
	margin-left:333px;
    background: none repeat scroll 0 0 #C1C0C2;
    border: 1px solid #717071;
    color: #616161;
    height: 30px;
    padding: 0;
    width: 80px;
	
}

a.bouton{
	display:block;
	font-size:12px;
	padding: 5px 5px 13px;
	height: 10px;
	width: 60px;
	text-align: center;
}
.bouton:hover {
    cursor: pointer;
	text-decoration:none;
	color:#FFF;
}
.bouton:active {
    left: 1px;
    position: relative;
    top: 1px;
}
#box_new .bouton {
		margin-left:0;

    background: none repeat scroll 0 0 #C1C0C2;
    border: 1px solid #717071;
    color: #616161;
    height: 30px;
    padding: 0;
    width: 100%;
	
}

.mh-menu{
	height: 385px;
	width: 600px;
	
	margin-left:-220px;
	position: relative;
}
.mh-menu li{
	width: 140px;
	list-style:none;
}
.mh-menu li a{
	color: #6C6B6C;
	text-decoration: none;
	display: block;
	width: 160px;
	padding: 0px 9px;
	text-align: left;
	position: relative;
	z-index: 10;
	/*height: 97px;
	height: 87px;*/
	height: calc( 619px / 9 );
	border-bottom: 2px solid #6C6B6C;
	background: rgba(255,255,255, 0.8);
}
.mh-menu li a:hover {
	background: rgba(108,107,108, 0.4);
	color: #FFF;
}
.mh-menu li a span{
	display:block;
}

.mh-menu li a span:first-child{
	font-weight: 700;
	font-size: 16px;
	color: #6C6B6C;
	padding-top: 10px;
	font-family: 'Alegreya SC', Georgia, serif;
}
.mh-menu li a span:nth-child(2){
	font-weight: 400;
	font-style: italic;
	font-size: 28px;
	font-family: 'Alegreya SC', Georgia, serif;
	-webkit-transition: color 0.2s linear;
	-moz-transition: color 0.2s linear;
	-o-transition: color 0.2s linear;
	-ms-transition: color 0.2s linear;
	transition: color 0.2s linear;
}
.mh-menu li:nth-child(1):hover span:nth-child(2){
	color: #6C6B6C;
}
.mh-menu li:nth-child(2):hover span:nth-child(2){
	color: #6C6B6C;
}
.mh-menu li:nth-child(3):hover span:nth-child(2){
	color: #6C6B6C;
}
.mh-menu li:nth-child(4):hover span:nth-child(2){
	color: #6C6B6C;
}
.mh-menu li div.div_content{
	position: absolute;
	z-index: 1;
	left: 0px;
	top: 0px;
	opacity: 0;
	-webkit-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;
	-moz-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;
	-o-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;
	-ms-transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;
	transition: left 0.4s ease-in-out, opacity 0.6s ease-in-out;
}
.mh-menu li a:hover div.div_content{
	left: 220px;
	opacity: 1;
}
.mh-menu li a i {
	cursor:pointer;
	font-size: 20px;
}
.mh-menu li.mh-menu-active a {
	background: rgba(108,107,108, 0.4);
	}
.mh-menu li.mh-menu-active a span{
	color: #FFF;
	}
.mh-menu li.mh-menu-active div.div_content{
	left: 220px;
	opacity: 1;
	
}

  
 
@media all and (max-height: 700px) {
html, body{
	font-size:12px;
}
#map-canvas{
	margin-top:calc(10% + 35px);
	height:400px;
}


#formulaire, #gallery, #box_pres_1 ,#box_pres_2 ,#box_cuis_1 ,#box_cuis_2, #newletter, #seminaire{
	position:relative;
	padding-top:calc(10% - 55px);

}

#box_cuis_1 img, #box_pres_2 img{
width:70%;
height:70%;
}
#groupe_image img{
	width:75%;
	height:75%;
}
div.div_content img{
	height:450px;
}
.mh-menu li a{
	
	height: calc( 432px / 9 );
	
}
#event img{
	height:450px;
	margin-top:-225px
	
}
.labelMessage {
    height: 102px;
}
textarea {
    height: 110px;
}
textarea:focus {
    height: 110px;
}
h2 {
	margin-top:30px;
	margin-bottom:5px;
}

} 
@media all and (min-height: 700px) and (max-height: 800px) {
#map-canvas{
	margin-top:calc(10% + 55px);
	height:450px;
}


#formulaire, #gallery, #box_pres_1 ,#box_pres_2 ,#box_cuis_1 ,#box_cuis_2, #newletter, #seminaire{
	position:relative;
	padding-top:calc(10% - 35px);

}
#box_cuis_1 img, #box_pres_2 img{
width:75%;
height:75%;
}
div.div_content img{
	height:500px;
}
.mh-menu li a{
	
	height: calc( 482px / 9 );
	
}
#e
#event img{
	height:500px;
	margin-top:-250px
}
.labelMessage {
    height: 142px;
}
textarea {
    height: 150px;
}
textarea:focus {
    height: 150px;
}
h2 {
	margin-top:30px;
	margin-bottom:5px;
}

}

@media all and (min-height: 800px) and (max-height: 1100px) {
#map-canvas{
	margin-top:calc(15% + 55px);
	height:500px;
}

#formulaire, #gallery, #box_pres_1 ,#box_pres_2 ,#box_cuis_1 ,#box_cuis_2, #seminaire{
	position:relative;
	padding-top:calc(15% - 55px);

}

#box_cuis_1 img, #box_pres_2 img{
width:85%;
height:85%;
}
.labelMessage {
    height: 162px;
}
textarea {
    height: 170px;
}
textarea:focus {
    height: 170px;
}
h2 {
	margin-top:50px;
	margin-bottom:5px;
}
} 


