@font-face{
	font-family: "Copperplate Gothic";
	src: url("coprgtl-webfont.woff") format("woff");
	src: url("coprgtl-webfont.woff2") format("woff2");
}


/*@font-face{	
	font-family: "AdobeHeitiStd";
	src:url("AdobeHeitiStd-Regular.otf") format("otf");
}*/

*{
	font-family: "Copperplate Gothic";
}

body{
	background-image: url('img/tableau_nb_transparent2.png');
	background-attachment: fixed;
	background-size: 100%;
	background-repeat: no-repeat;
	background-color: rgba(0,0,0,0.8);
}

html, body {
  padding: 0;
  margin: 0;
  background-color: #ffffff;/*#f6dd80;*/
  /*font-family: arial, sans-serif;*/
}

header{
	background-color: rgba(255,255,255,0.8);
}

h1{
	font-family: "Copperplate Gothic";
	text-align: center;
	font-size: 3em;
	text-shadow: 0.1em 0.1em 0.2em black;
}

h2{
	font-family: "Copperplate Gothic";
	font-size: 2em;
	text-shadow: 0.1em 0.1em 0.2em black;
}
h3{
	font-family: "Copperplate Gothic";
	font-size: 1.5em;

}
h4{
	font-family: "Copperplate Gothic";
	font-size: 1.3em;
}






/****************/
/*MENU HAMBURGER*/
/* [ON BIG SCREEN] */
/* Wrapper */
#hamnav {
  width: 100%;
  background: #000000;
  /* Optional */
  position: sticky;
  top: 0;
  font-family: "Copperplate Gothic";
}

/* Hide Hamburger */
#hamnav label, #hamburger { display: none; }

/* Horizontal Menu Items */
#hamitems { display: flex; }
#hamitems a {
  width: 20%; /* 100% / 5 tabs = 20% */
  padding: 10px;
  color: white;
  text-decoration: none;
  text-align: center;
  font-family: "Copperplate Gothic";
}
#hamitems a:hover {
  background: #f5ce35;
  font-family: "Copperplate Gothic";
  color: black;
  font-weight: bold;
  transform: scale(1.2);
}

/* [ON SMALL SCREENS] */
@media screen and (max-width: 768px){
  /* Show Hamburger Icon */
  #hamnav label { 
    display: inline-block; 
    color: white;
    background: #f5ce35;
    font-style: normal;
    font-size: 1.2em;
    padding: 10px;
  }

  /* Break down menu items into vertical */
  #hamitems a {
    box-sizing: border-box;
    display: block;
    width: 100%;
    border-top: 1px solid #333;
  }

  /* Toggle Show/Hide Menu */
  #hamitems { display: none; }
  #hamnav input:checked ~ #hamitems { display: block; }
}

/* [DOES NOT MATTER] */
/*FIN MENU HAMBURGER*/
/********************/




/****************/
/*HEADER*/
.logo{
	width:100%;  

}
.imgLogo{
	width:60%;
	margin-left: 20%;
	margin-right: 20%;
}
@media screen and (max-width: 768px){
	.imgLogo{
	width:80%;
	margin-left: 10%;
	margin-right: 10%;
	}
}
/***FIN HEADER***/
/****************/



/****************/
/*FOOTER*/
footer{
	padding-bottom: 0%;
	
	background-color: #000000;
	text-align: center;
	color: white;
}
.afooter:link{
	color: white;
}
.afooter:visited {
	color: white;
}
.afooter:hover {
	color: white;}

.afooter:active {
	color: white;
}
.imgRS{
	width: 25px;
	height: 25px;
}
.pieddepage{
	display: flex;
}
.sspieddepage{
	width:33%;
}
.logoFranceNum{
	width: 50%;
	height: 50%;
	margin-left: auto;
    margin-right: auto;
    /*margin-top: 25%;
    margin-bottom:10%;
	vertical-align: middle;*/
}
@media screen and (max-width: 768px){
	.pieddepage{
		display: block;
	}
	.sspieddepage{
		width: 100%;
	}
}
/*FIN FOOTER*/
/****************/


.center{
	font-size: 1em;
	text-align: center;
	border : 1px solid black;
	border-radius: 15px;
	margin-left: 30%;
	margin-right: 30%;
	padding-left: 2%;
	padding-right: 2%;
	background-color: rgba(255,255,255,0.8);
	box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
}
@media screen and (max-width: 768px){
	.center{
		width:90%;
		margin-left: 5%;
		margin-right: 5%;
		padding-left: 2%;
		padding-right: 2%;
		box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
	}

}
.center2{
	font-size: 1em;
	text-align: center;
	border-radius: 15px;
	margin-left: 10%;
	margin-right: 10%;
	padding-left: 2%;
	padding-right: 2%;
}
@media screen and (max-width: 768px){
	.center2{
		width:90%;
		margin-left: 5%;
		margin-right: 5%;
		padding-left: 2%;
		padding-right: 2%;

	}

}

/****************/
/*PAGE INDEX*/

.horaires{
	text-align: center;
}
.lien_center{
	text-align: center;
	font-weight: bold;
	font-size: 1.2em;
}
/*.imgIndex{
	margin-left: 10%;
	margin-right: 10%;
	width: 80%;
	text-align: center;
}*/
.texte_index{
	text-align: center;
	margin-left: 10%;
	margin-right: 10%;
	font-weight: bold;
}
.imgIndex { 
	overflow: hidden; 
	/*position: relative;*/
	max-width: 80%;
	height: auto;
	/*left: 10%;
	right: 10%;*/
	display:flex;
	margin:auto;
	text-align: center;
}

div .imgIndex figure { 
  position: relative;
  /*width: 100%;*/
  margin: 0;
  left: 0;
  text-align: left;
  font-size: 0;

}
/*@media screen and (max-width: 768px){
	.imgIndex img{
		right: 10%;
		left: 10%;
		width: 80%;
    height: auto;
	}
}*/

/*FIN PAGE INDEX*/
/****************/



/********/
/*PAGES CARTES*/
.carte{
	text-align: center;
}
.cartes{
	display:flex;
}
.sscartes{
	/*display: inline;*/
	font-size: 1em;
	width:40%;
	text-align: center;
	border : 1px solid black;
	border-radius: 15px;
	margin-left: 5%;
	margin-right: 5%;
	padding-left: 2%;
	padding-right: 2%;
	background-color: rgba(255,255,255,0.8);
	box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
}

.conditions{
	font-size: 0.8em;
	text-align: center;
	margin-left: 10%;
	margin-right: 10%;
	padding-left: 2%;
	padding-right: 2%;
}

.img_menu{
	width: 230px;
	height: 230px;
}

.btn_carte{
    /*background-color: #c0984f;*/
    color: black;
    text-decoration: underline;
}

.carte_table{
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
}
.carte_table_alignRight{
	text-align: right;
}
@media screen and (max-width: 768px){
	.cartes{
		display: block;
	}
	.sscartes{
		width: 90%;
		text-align: center;
		border : 1px solid black;
		border-radius: 15px;
		margin-left: 5%;
		margin-right: 5%;
		padding-left: 2%;
		padding-right: 2%;
		background-color: rgba(255,255,255,0.8);
		box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
	}
	.center2{
		width: 90%;
		text-align: center;
		border : 1px solid black;
		border-radius: 15px;
		margin-left: 5%;
		margin-right: 5%;
		padding-left: 2%;
		padding-right: 2%;
		background-color: rgba(255,255,255,0.8);
		box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
	}
	.conditions{
		width:90%;
		text-align: center;
		border : 1px solid black;
		border-radius: 15px;
		margin-left: 5%;
		margin-right: 5%;
		padding-left: 2%;
		padding-right: 2%;
		background-color: rgba(255,255,255,0.8);
	}
	.img_menu{
		width: 50%;
	}
	.carte_table{
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
}
}
/********/
/*FIN PAGES CARTES*/



/****************/
/*FORMULAIRES*/
form {
 /*background-color:#FAFAFA;*/
 /*padding:10px;*/
 /*width:280px;*/
 }

input, textarea, select {
 padding:3px;
 border:1px solid #F5C5C5;
 border-radius:5px;
 /*width:200px;*/
 box-shadow:1px 1px 2px #C0C0C0 inset;
 }

 fieldset {
 	position: center;
 	width:50%;
 	border:1px solid black;
	border-radius: 15px;
	text-align: center;
	margin-left: 25%;
	margin-right: 25%;
	padding-left: 2%;
	padding-right: 2%;
	background-color: rgba(255,255,255,0.8);
	box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
 }

 legend {
 /*color:#DF3F3F*/;
 font-weight:bold
 }

 .itineraire{
 	text-align: center;
 }
 @media screen and (max-width: 768px){
 	fieldset {
	 	position: center;
	 	width:90%;
	 	border:1px solid black;
		border-radius: 15px;
		text-align: center;
		margin-left: 5%;
		margin-right: 5%;
		padding-left: 2%;
		padding-right: 2%;
		background-color: rgba(255,255,255,0.8);
		box-shadow: 6px 6px 12px 0 rgba(0,0,0,.5);
 }

 }
/*FIN FORMULAIRES*/
 /****************/


.avis_titre{
	text-align: left;
}
.avis_texte{
	text-align: justify;
}
/*.avis{
	text-align: center;
	align-content: center;
}*/

.etoile{
	max-width: 5%;
	height: auto;
	vertical-align:bottom;
	text-align: right;
	/*width:30px;height:30px;*/
}



/*carroussel*/
@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

/*body { margin: 0; }*/ 
div#slider { 
	overflow: hidden; 
	position: relative;
	width: 40%;
	left: 30%;
	right: 30%;
	text-align: center;
}
div#slider figure img { 
	width: 20%; 
	float: left; 
}
div#slider figure { 
  position: relative;
  width: 500%;
  margin: 0;
  left: 0;
  text-align: left;
  font-size: 0;
  animation: 30s slidy infinite; 
}

/****************/
/*GALERIE PHOTOS*/
/****************/
.row {
  /*display: flex;
  flex-wrap: wrap;*/
  padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.column {
  /*flex: 25%;
  max-width: 25%;*/
  padding: 0 4px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  /*width: 100%;*/
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    flex: 100%;
    max-width: 100%;
  }
}
/*FIN GALERIE PHOTOS*/


/*NON UTILISE*/
.container div{
	
	background-color: #ffffff;
	display: inline-block;
}

/* CSS MODAL */
.cModal {
  position: fixed;
  z-index: 99999;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(200, 200, 200, 0.8);
  opacity:0;
  pointer-events: none;
  overflow-y: scroll;
  /*scrollbar-color: rebeccapurple green;*/
  scrollbar-width: thin;
}
.cModal:target {
  opacity:1;
  pointer-events: auto;
}
.cModal > div {
  max-width: 1000px;
  position: relative;
  margin: 2% auto;
  padding: 8px 8px 8px 8px;
  border-radius: 2px;
  background: #fff;
}
.droite {
  float:right;
}