/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	box-sizing:border-box;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}
/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    zoom: 1;
}

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
body{
  height:100%;
}

html{
	font-size:62.5%;
  font-weight: 400;

}

p{
  font-size: 1.8rem;
  font-family: 'Lato';
  line-height: 2.5rem;
  color: white;
}
h1{
  font-family: 'Lato';
  font-size: 4rem;
  font-weight: bold;
}
h2{
  font-family: 'Lato';
  font-size:3rem;
  font-weight: bold;
  color: #594A42;
  text-transform: uppercase;
}
h3{
  font-family: 'Lato';
  font-size:2rem;
  color: white;
}

.slider_p{
  text-transform: uppercase;
  font-weight: bold;
  font-size: 3rem;
}


.accueil{
  background: url(../img/header7.jpg) no-repeat;
  background-size:100%;
  max-height: 500px;

}
.wrapper{
  max-width: 1200px;
  margin: 0 auto;
}
.wrapper2{
  max-width: 1200px;
  margin: 0 auto;
  background-color: #483f37;
}
.wrapper3{
  max-width: 960px;
  margin: 0 auto;
}
.wrapper2 a img{
  padding-top: 1rem;
}
.wrapper4{
  max-width: 760px;
  margin: 0 auto;
}
.first{
  width: 100%;
  height: 74px;
  background-color: #483f37;
  position: fixed;
  top: 0;
  z-index: 3;
}

nav{
 height: 67px;
 background-color:#483f37;
 float: right;

}
nav ul li {
  float: left;
  display: block;
  

}

nav ul li a{
  font-family: 'Lato';
  display:block;
  padding-top:2rem;
  padding-bottom: 1.5rem;
  font-size: 2rem;
  margin-top: 1.9rem;
  text-decoration: none;
  text-transform: uppercase;
  color: white;
  transition: all 0.2s ease;
}
nav ul li:not(:nth-child(n+6)) a{
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
nav ul li:nth-child(6){
  padding-left: 1rem;
}
nav ul li:nth-child(7){
  padding-left: 0.5rem;
}
nav ul li:nth-child(7) a:hover{
  color:#C77932;
  transition: all 0.2s ease;
}
nav ul li:nth-child(6) a:hover{
  color:#C77932;
  transition: all 0.2s ease;
}

nav ul li:last-child{
  display: none;

}

nav ul li:not(:nth-child(n+6)) a:hover,nav ul li:not(:nth-child(n+6)).active a{
  color: #483f37;
  background-color: #C77932;
}








                                        /*/////////// 1 SECTION ///////////*/
main h1.premier{
  text-align: center;
  margin-top: 22rem;
  text-transform: uppercase;
  color: white;
}


.color{
  background-color: white;
}
main{
  width: 100%;
  /*background:  url(../img/grille-horizontale.png),url(../img/grille-verticale.png) center  top repeat-y;*/
}
.accueil1{
  margin-top: 13rem;
  padding-top: 5rem;
}
.accueil1 h1{
  text-align: center;
  text-transform: uppercase;
  color: #594A42;
  margin-bottom: 1rem;
 
}
.accueil1 h2{
  text-align: center;
  margin-bottom: 1rem;
}
.accueil1 p.textp{
  text-align: center;
  color: #594A42;
  padding: 1rem 28rem;
  margin-bottom: 4rem;
}

.premier{
  text-align:center;
  margin-bottom: 3rem;
  margin-top: 2rem;
  color: #EAE1D3;
}
.accueil1 .stalactites h2{
  margin-top: 3rem;
  margin-bottom: 0.5rem;
  padding: 1rem 3rem;
  text-transform: uppercase;
  text-align: center;
  color: white;

}
.accueil1 .stalactites p{
  padding: 0rem 2rem;
  margin-top: 4rem;
  text-align: center;
  color: white;
}
.accueil1 .cf div{
  float: left;
}
.accueil1 .cf div.stalactites1{
  width: 55.25%;
  margin-left: 2.1rem;
}
.accueil1 .cf div.stalactites{
  width: 38.75%;
}
.accueil1 .stalactites2{
  width: 38.75%;
  }

.accueil1 .cf div.stalactites3{
  width: 55.25%;
}
.accueil1 .cf div a img{
  width: 100%; 
}
.accueil1 .stalactites{
  background:#9B928E;
  margin-left: 3rem;
  padding-bottom:7.5rem;
}
.accueil1 .stalactites2{
  padding-bottom: 23px;
  background:#9B928E;
  margin-left: 2.1rem;
  margin-top: 1.5rem;
  margin-bottom: 2rem;
  padding-top:3rem;
  padding-bottom: 8.4rem;
}
.accueil .stalactites2 p:first-child{
  padding: 1rem 3rem;
  color: white;
  text-transform: uppercase;
  text-align: center;
  margin-top: 7rem;
  font-weight: bold;
}
.accueil .stalactites2 p:last-child{
  text-align: center;
}

.accueil1 .cf:last-child div a img{
  margin-left: 2.9rem;
  margin-top: 1.5rem;
  margin-bottom: 2rem;
}



                                      /*////////////// 2 SECTION //////////////*/

.button{
  color:white;
  text-transform: uppercase;
  text-decoration: none;
  display:inline-block; 
  font-size: 1.6rem;
  padding: 1rem 3rem;
  border-radius: 4px;
  background-color: #C77932;
  margin-top: 1rem;
}  

.button:hover{
  background: white;
  color: #594A42;
  transition: all 0.2s ease; 
}
.accueil2 h2{
  text-align: center;
  margin-top: 8rem;
  margin-bottom: 1rem;
}

.accueil2 p{
  color: #594A42;
  text-align: center;
  

}
.accueil2 .cf {
  margin-top: 5rem;
}

.accueil2 .cf div{
  position: relative;
  float: left;
  margin-left: 2.1rem;

}
.accueil2  .cf div.boutique h3{
  text-align: center;
  margin-top: 2rem;
  margin-bottom: 1rem;
}
.accueil2  .cf div:last-child h3{
  position: absolute;
  top: 29.5rem;
  left: 22rem;
  text-transform: uppercase;
  font-weight: bold;
}
.accueil2  .cf div:last-child p{
  position: absolute;
  text-align: center;
  top: 31.5rem;
  left: 16rem;
  padding: 1rem 3rem;
  color: white;
}

.accueil2  div:last-child{
  position: relative;
}
.boutique  h3{
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
}

.accueil2  .cf div:nth-child(2) img{
  width: 100%;
}
.accueil2  .cf div:nth-child(2){
  margin-left: 3rem;
  width: 47%;
}
.boutique{
  width: 47%;
  padding-bottom: 0.9rem;
  background-color: #9B928E;
  margin-left: 1.4rem;
  padding-bottom: 4.2rem;
}
.boutique a.image{
  display: inline-block;
  width: 90%;
}
.boutique img{
  width: 100%;
}

.accueil2 .cf .boutique a img{
  margin-left: 2.9rem;
  margin-top: 2rem;
}

.accueil3{
  background: #D4D1CD;
  padding-top: 3rem;
  padding-bottom: 14rem;
  margin-top: 9rem;
}
.accueil3 h2{
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 5rem;
}
.accueil3 div.icon{
  float: left;
  width: 17.5%;
  height: 168px;
  text-align: center;
}
.accueil3 div p{
  text-align: center;
  margin-bottom: 2rem;
  margin-top: 1rem;
  color: #594A42;
  font-weight: bold;
 
}
.accueil3 div.icon:first-child div p{
  padding:0rem 1.3rem;
}
.accueil3 div.icon:last-child{
   margin-left:10%;
}
.accueil3 div.icon:last-child div p{
  padding: 0rem 2rem;
}
.accueil3 div.icon:nth-child(2){
   margin-left:10%;
}
.accueil3 div.icon:nth-child(2) div p{
  padding: 0rem 1rem;
}
.accueil3 div.icon:nth-child(3){
   margin-left:10%;
}
.icon a {
  width: 168px;
  height: 168px;
  background: #ADA69E;
  border-radius: 80px;
  display: inline-block;
}


.accueil3 div.icon:first-child a{
  background: #ADA69E url(../img/icon1.svg) no-repeat center center;

}
.accueil3 div.icon:first-child a:hover {
 background-color: #C77932;
 transition: all 0.2s ease;
}
.accueil3 div.icon:nth-child(2) a{
  background: #ADA69E url(../img/icon2.svg) no-repeat center center;
}
.accueil3 div.icon:nth-child(2) a:hover{
  background-color: #C77932;
  transition: all 0.2s ease;
}
.accueil3 div.icon:nth-child(3) a{
  background: #ADA69E url(../img/icon3.svg) no-repeat center center;
}
.accueil3 div.icon:nth-child(3) a:hover{
  background-color: #C77932;
  transition: all 0.2s ease;
}
.accueil3 div.icon:last-child a{
  background: #ADA69E url(../img/icon4.svg) no-repeat center center;
}
.accueil3 div.icon:last-child a:hover{
   background-color: #C77932;
   transition: all 0.2s ease;
}



                                        /*//////////////// FOOTER/////////////////*/
#back-top {
  border-radius: 10px;
  bottom: 30px;
  cursor: pointer;
  padding: 1em;
  position: fixed;
  right: 20px;
  z-index: 10;
}
.second{
  background:url(../img/grille-horizontale.png),url(../img/grille-verticale.png) center  top repeat-y;
}
.footer{
  width:100%;
  background: #483f37;
 
 
}
.footer .cf div{
  margin-top: 2rem;
  float: left;
}

.footer .cf div ul li:first-child a{
  text-transform: uppercase;
  font-weight: bold;
  line-height: 5rem;
  color: #C77932;
}
.footer .cf div ul li a {
  font-size: 1.4rem;
  font-family: 'Lato';
  text-transform: uppercase;
  line-height: 2rem;
  color: rgba(253, 253, 253, 1);
  text-decoration: none;
}
.footer .cf div ul li address{
  font-size: 1.4rem;
  font-family: 'Lato';
  text-transform: uppercase;
  line-height: 2rem;
  color: rgba(253, 253, 253, 1);
  text-decoration: none;
}
.footer .cf div:nth-child(3){
  width: 28%;
  margin-left: 5.7%;
}
.footer .cf div:nth-child(2){
  width: 25%;
  margin-left:16%;
}
.footer .cf div:first-child{
  width: 25.25%;
}
.footer .cf div:nth-child(2) a img{
  margin-right:0.5rem;
}
.footer .cf div:nth-child(2) ul{
  margin-left: 1.5rem;
}

.second .footer p{
  text-align: center;
  font-size: 1.6rem;
  margin-top: 1rem;
  border-top: 1px solid white;
}

#email{
  width: 176px;
  height: 28px;
  margin-bottom: 1rem;
  margin-top: 1rem;
  border-radius: 10px;
}

form input{
  font-family: 'Lato';
  border: 1px solid #594A42; 
  background: #D4D1CD;
  
}
form{
  position: relative;
}
.second .footer .cf form #email #ok{
  position: absolute;
  top: 1rem;
}
.second .footer p.marcorel.wrapper{
  font-size: 1.1rem;
  text-align: center;
  border: none;
  padding: 1rem 14rem;
}
button{
  height: 3rem;
  border-radius: 8px;
  font-size: 1.2rem;
  background-color: #D4D1CD;
  border: none;
  color: #594A42;
  width: 3rem;
  text-transform: uppercase;

}
.liens{
  margin-top: 1rem;
  border-top: 1px solid #D4D1CD;
  text-align: center;
  padding-top: 1rem;
}
.second .footer .liens a{
  font-family: 'Lato';
  color: white;
  font-size: 1.4rem;
  text-transform: uppercase;
  text-decoration: none;
}
.second .footer .liens a:hover{
  color:#C77932;
}

.second .footer .liens a:not(:first-child){
  margin-left: 3.8rem;
}




                                /*/////////////////page grotte////////////////*/
.slider{
  position: relative;
}
.textslide{
  position: absolute;
  top: 15rem;
  left:5rem;
  width: 95.83%;
}
.textslide p{
  text-transform: uppercase;
  padding: 1rem 36rem;
  text-align: center;
  line-height: 4rem;
  font-size: 2.2rem;
}

.grotte h1{
  text-align: center;
  color: #594A42;
  text-transform: uppercase;
  margin-bottom: 2rem;
  margin-top: 3rem;
}
.grotte h2{
  text-align: center;
  margin-top: 5rem;
  margin-bottom: 3rem;
  text-transform: uppercase;
}
.grotte p{
  color: #594A42;
  text-align: center;
}
.slider ul{
  margin-left: 0rem;
}
.grotte .cf {
  margin-top: 4rem;
}
.grotte .cf div{
  float: left;
}
.text{
  width: 30.5%;
  padding-bottom: 3.4rem;
  background: #9B928E;
}

.grotte .cf div:first-child{
  margin-left: 2.1rem;
  width: 30.5%;
}
.grotte .cf div:first-child img{
  width: 100%;
}
.grotte .cf div:nth-child(2){
  margin-left: 3rem;
}
.grotte .cf div:last-child{
  margin-left: 3rem;
  width: 30.5%;
}
.grotte .cf div:last-child img{
  width: 100%;
}
.grotte .cf .text p{
  text-align: center;
  padding: 7rem 2.1rem;
  color: white;
}
.grotte3{
   background:  url(../img/grotte5.jpg) no-repeat ;
   padding: 5rem 4rem;
}
.grotte2 h2{
  text-align: center;
  margin-top: 9rem;
  margin-bottom: 4rem;
  text-transform: uppercase;
}
.grotte2 .text2{
  margin: 0 auto;
  width: 63.41%;
  padding: 3rem 1rem;
  background-color: rgba(88, 73, 65, 0.77);
}
.grotte2 .text2 p{
  padding: 1rem 3rem;
  text-align: center;
}
.grotte4 h2{
  text-align: center;
  margin-top: 9rem;
  margin-bottom: 4rem;
  text-transform: uppercase;
}
.color3{
  background-color: #D4D1CD;
  width: 100%;
}
.grotte4 .cf {
  background-color: #D4D1CD;
  padding: 5rem 1rem;
  padding-bottom: 6rem;
}
.grotte4 .cf div{
  float: left;
}
.grotte4 .cf .text3{
  width:54.16%;
  margin-left: 3rem;
}
.grotte4 .cf .text3 p{
  color: #594A42;
}
.grotte4 .cf div:first-child{
  margin-left: 1.2rem;
  width: 39.33%;
}
.grotte4 .cf div:first-child img{
  width: 100%;
}
                                     /*/////////////////page services/////////////////*/
.services_premier{
  margin-top: 9rem;
 
}
.services{
  background-color: #D4D1CD;
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.services_premier h1{
  margin-top: 11rem;
  text-align: center;
  text-transform: uppercase;
  color: #594A42;
  font-weight: bold;
}
.services h2{
  text-align: center;
  margin-bottom: 3rem;
}
.services_premier p{
  color: #594A42;
  text-align: center;
  margin-top: 1rem;
  margin-bottom: 5rem;
}
.services2 h2{
  text-align: center;
  margin-top: 12rem;
  margin-bottom: 3rem;
}
.services3{
  width: 100%;
  background-color: #D4D1CD;
  padding-bottom: 2rem;
  padding-top: 2rem;
  margin-top: 12rem;
}
.services3 .cf{
  padding-bottom: 5rem;
}
.services3 h2{
  text-align: center;
  margin-bottom: 3rem;
}
.services .cf div{
  float: left;
  
}
.services .cf div:first-child{
  margin-left: 2.2rem;
  width: 55.16%;
}
.services .cf div:first-child img{
  width: 100%;
}
.services .cf div:last-child{
  margin-left: 3.1rem;
}
.services .cf .textpg3{
  width: 38.69%;
  padding-bottom:5.3rem;
  background-color: #D4D1CD;
}
.services .cf .textpg3 p{
  color:#594A42;
  padding: 1rem 3rem;
}
.services2 .cf div{
  float: left;
}
.services2 .cf .pg3{
  width: 30.41%;
  padding-bottom: 12.2rem;
  background-color: #9B928E;
}
.services2 .cf .pg3 p{
  color:white;
  padding: 5rem 3rem;
}
.services2 .cf div:first-child{
  margin-left:12.1rem;
}
.services2 .cf div:last-child{
  margin-left: 3rem;
  width: 47.08%;
}
.services2 .cf div:last-child img{
  width: 100%;
}
.services3 .cf div{
  float: left;
}
.services3 .cf .text2pg3{
  width: 38.66%;
  padding-bottom: 27rem;
  background-color: #D4D1CD;
}
.services3 .cf .text2pg3 p{
  color:#594A42;
  padding: 1rem 3rem;
}
.services3 .cf div:first-child{
  margin-left:2.25rem;
  width: 55.16%;
}
.services3 .cf div:first-child img{
  width: 100%;
}
.services3 .cf div:last-child{
  margin-left: 3.1rem;
}
                                    /*/////////////////tarifs////////////////////*/

.tarifs_1{
  background: url(../img/header2.jpg);
  background-size: cover;
  background-attachment: fixed;
}
.tarifs_1 h1{
  color: white;
  text-align: center;
  text-transform: uppercase;
  margin-top: 7rem;
  margin-bottom: 4rem;
  padding-top: 9rem;
}
.tarifs2{
  background-color: rgba(213, 210, 205, 0.68);
  padding: 3rem 1rem;
  text-align: center;
}

.pgtarifs{
  display: inline-block;
  padding: 1rem 2rem;
  border-top: 2px solid white;

}
.tarifs h3 {
  text-align: center;
}
.tarifs .cf div p{
  padding: 1rem 2.8rem;
  text-align: center;
}
.tarifs .cf div{
  float: left;
  width: 14%;
  padding-bottom: 9rem;
  background-color: #594A42;
  padding-top: 3rem;
}
.tarifs .cf div.adultes{
  margin-left: 21rem;
 
}
.ados{
  margin-left: 3.4rem;
}
.enfants{
  margin-left: 3.3rem;
}
.enfants2{
  margin-left: 3.3rem;
}
.tarifs3{
  text-align: center;
}
.tarifs3 .cf div{
  float: left;
  width: 14%;
  padding-bottom: 9rem;
  background-color: #9B928E;
  padding-top: 3rem;
}
.tarifs3 .cf div p{
  padding: 1rem 2.8rem;
  text-align: center;
}
.adultes2{
  margin-left:41.7rem;
}
.ados2{
  margin-left: 3rem;
}
.tarifs_1 h1{
  color: white;
}
.tarifs4{
  margin-top: 5rem;
  margin-bottom: 8rem;
}
.tarifs4 h2{
  color: white;
}
.tarifs6{
  background-color: rgba(213, 210, 205, 0.68);
  padding: 3rem 1rem;
  text-align: center;
}
.tarifs5 .cf div{
  float: left;
  background-color:#594A42;
  padding-top: 3rem;
}
.adultes3{
  margin-left: 30.8rem;
  padding-bottom: 12rem;
  width: 14.3%;
}
.ados3{
  margin-left: 3rem;
  width: 14.2%;
  padding-bottom: 12rem;
}
.enfants3{
  margin-left: 3rem;
  width: 14.2%;
  padding-bottom: 10rem;

}
.enfants3 h3{
  text-transform: uppercase;
}
.paiements{
  margin-top: 5rem;
  text-align: center;
  padding-bottom: 8rem;
}
.paiements div{
  display: inline-block;
  padding: 0.2rem 0.2rem;
}
.paiements h3{
  color:white;
  text-transform: uppercase;
  text-align: center;
  font-weight: bold;
  margin-bottom: 1rem;
}
.paiements p{
  color: white;
  text-align: center;
  margin-bottom: 1rem;
}
                              /*//////////////page accès///////////////*/
.color5{
  background: white;
  padding-top: 5rem;
  padding-bottom: 5rem;
}
.acces h1{
  margin-top: 30rem;
  margin-bottom: 5rem;
  text-align: center;
  text-transform: uppercase;
  color: white;
}

.horaire .cf div{
  float: left;
}
.horaire .cf div.acces{
  margin-left: 3rem;
  width: 55.25%;
}
.horaire .cf div.acces img{
  width: 100%;
}
.horaire1 img{
  display: block;
  margin: 0 auto;
}
.horaire .cf .horaire1 h2{
  color: #594A42;
  text-transform: uppercase;
  font-weight: bold;
  padding-top: 2rem;
  padding-bottom: 1rem;
}
.horaire1{
  width:38.75%;
  padding-bottom: 0.2rem;
  background-color:#D4D1CD;
  text-align: center;
  margin-left: 2.1rem;
}
.horaire1 p.visite{
  color: #594A42;
  display: inline-block;
  border-top: 2px solid #C77932;
  padding-bottom: 1rem;
}
.span3{
  color: #C77932;
  text-transform: none;
  font-weight: bold;
  
}
.septembre{
  text-transform: uppercase;
  padding: 0.5rem 9rem;
  color: #594A42;
  
}
.map{
  margin-top: 3rem;
}
.map .cf div{
  float: left;
  text-align: center;
}
.map .cf .adress h2{
  color: #594A42;
  text-transform: uppercase;
  font-weight: bold;
  display: inline-block;
  margin: 0 auto;
  border-top: 2px solid #C77932;
  padding-bottom: 1rem;
}
.map .cf div img{
  padding-top:2rem;
  padding-bottom: 1rem;
  display: block;
  margin: 0 auto;
}
.adress{
  width: 38.75%;
  padding-bottom: 5.3rem;
  background-color: #D4D1CD;
  margin-left: 3rem;
}
.map .cf .adress p{
  display: inline-block;
  color: #594A42;
 
}
.map .cf div.frame{
  margin-left: 2.1rem;
  width: 55.25%;
}
.map .cf div.frame iframe{
  width: 100%;
}
                                    /*///////////////page contact//////////////*/
.contact{
  text-align: center;
}
#prenom,#nom,#tel,#email2{
  width: 22%;
  height: 30px;
  margin-bottom: 1rem;
  border-radius: 5px;
  border:1px solid #C77932;
  background-color: white;
  text-transform: uppercase;
  font-size: 1.4rem;
 
}
#envoyer{
  border:1px solid #C77932;
  background-color:#C77932;
  height: 40px;
  border-radius: 5px;
  margin-top: 1rem;
  width: 15%;
  text-transform: uppercase;
  font-size: 1.6rem;
  color: #594A42;
  margin-bottom: 2rem;
}

#prenom,#email2{
  margin-right: 2.7rem;
}
#message{
  width:46.58%;
  height: 200px;
  background-color: white;
  border-radius: 5px;
  border:1px solid #C77932;
}
#message{
  color: #594A42;
  text-transform: uppercase;
  font-size: 1.4rem;
  padding-left: 1rem;
  font-family: 'Lato' sans-serif;
}
.contact p{
  color: #594A42;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.contact p .titre{
  color: #594A42;
}
.nous_contacter{
 
  color: white;
  text-align: center;
  font-weight:bold;
  text-transform: uppercase;
  margin-bottom: 2rem;
}
.color6{
  background-color: rgba(255, 255, 255, 0.72);
  padding-top: 2rem;
}
.contact3{
  background: url(../img/caves.jpg) no-repeat;
  background-size:cover;
  background-attachment: fixed;
  padding-top: 20rem;
  padding-bottom: 40rem;
}
::-webkit-input-placeholder{
  color:#594A42;
  padding-left: 1rem;
}
::-moz-placeholder{
  color:#594A42;
  padding-left: 1rem;
}
:-ms-input-placeholder{
  color:#594A42;
  padding-left: 1rem;
}
:-moz-placeholder{
  color:#594A42;
  padding-left: 1rem;
}




                                     /*MEDIA*/
@media only screen and (max-width:480px) {
    #menu_icon{
      font-size: 50px;
      padding: 0rem;
      margin: 0rem;

    }


    .bar{
      display: none;
    }
    .wrapper{
      width: calc(100% - 4.2rem);
      margin-left: 2.1rem;
      margin-right: 2.1rem;
    }
    nav {
      width: 30%;
    }
    nav.menu_open{
      width: 100%;
      height: auto;

    }
    nav ul li:nth-child(2){
      margin-left: 0rem;
    }
    nav ul li:not(:last-child){
      display: none;
    }
    nav ul li:last-child{
      display: block;
      float: right;
      padding: 1rem 1.5rem;
    }
    nav ul.responsive li{
      position: relative;
    }

    nav ul.responsive li{
      display: block;
      float: none;
    }
    nav ul.responsive li:last-child{
      position: absolute;
      top: 0;
      right: 0;

    }
    nav ul li:not(:first-child) a{
      margin-left:0rem;
      text-align: center;
     
    }
    nav ul li:first-child a{
      text-align: center;

      
    }
    nav ul li:not(:last-child) a{
      border-bottom:1px solid white;
    }
    nav ul li:nth-child(7){
      padding: 0rem;
    }
    nav ul li:first-child{
      border-top: 1px solid white;
    }
    nav ul li a{
      margin-top: 0rem;
    }
    nav ul li:nth-child(6){
      padding-left: 0rem;
    }
    .wrapper2 a img{
      padding-left: 1rem;
    }
   
    .titre{
      color:#594A42;
    }
  
    .accueil{
      background: none;
    }
    .accueil1{
      margin-top: 3rem;
    }
    main h1.premier{
      color: #594A42;
      margin-top: 12rem;
      
    }
    main p.premier{
      border-bottom: 1px solid #594A42;
      margin-bottom: 0rem;
    }
    .premier{
      color:#594A42;
    }
    .titre{
      color: #594A42;
    }
    .accueil1 p.textp{
      padding: 1rem 0rem;
    }
    .accueil1 .cf div{
      float:none;
      margin-left: 0rem;
    }
    .accueil1 .cf div.stalactites{
      width: 100%;
      margin-left: 0rem;
    }
    .accueil1 .cf div.stalactites1{
      width: 100%;
      margin-left: 0rem;
    }
    .accueil1 .stalactites2{
      width: 100%;
      margin-left: 0rem;
    }
    .accueil1 .cf div.stalactites3{
      width: 100%;
      
    }
  .accueil1 .cf:last-child div a img{
    margin-left: 0rem;
  }
  .accueil2 .cf div{
    float: none;
  }
  .boutique{
    width: 100%;

  }
  .accueil2 .cf .boutique a img{
    margin-left: 2rem;
  }
  .accueil2 .cf div{
    margin-left: 0rem;
    margin-bottom: 1rem;
  }
  .accueil2 .cf div:nth-child(2){
    width: 100%;
    margin-left: 0rem;
  }
  .accueil2 .cf div:last-child p{
    top: 20rem;
    left: 10rem;
  }
  .accueil2 .cf div:last-child h3{
    top: 16rem;
    left:16rem;
  }
  .accueil3 div.icon{
    float: none;
    margin-bottom: 7rem;
  }
  .accueil3 div.icon:first-child{
    margin-left: 0rem;
  }
  .accueil3 div.icon:not(:first-child){
    margin-left: 0rem;
  }
  .accueil3 div.icon {
    margin-left: 0rem;
    text-align: center;

  }
  .footer{
    height: auto;
  }
  .wrapper4{
    text-align: center;
  }

  .footer .cf div:nth-child(2) ul{
    margin-left: 0rem;
  }
  .footer .cf div:first-child{
    width: 100%;
  }
  .footer .cf div:not(:first-child){
    width: 100%;
  }
  .footer .cf div:nth-child(2){
    margin-left: 0rem;
  }
  .footer .cf div:last-child{
    width: 100%;
    margin-left: 0rem;
  }
  .second .footer p.marcorel.wrapper{
    padding: 1rem 5rem;
  }
  .accueil3 div.icon {
    width: 100%;
  }
  .second .footer .liens a:not(:first-child){
    margin-left: 1.5rem;
  }
  /*page grotte*/

  .slider{
    display: none;
  } 
  .grotte h1{
    margin-top: 17rem;
   
  } 
  .grotte .cf div{
    float: none;
  }
  .grotte .cf div:first-child{
    width: 100%;
    margin-left: 0rem;
    margin-bottom: 1rem;
  }
  .text{
    width: 100%;
    margin-bottom: 1rem;
   
  }
  .grotte .cf div:nth-child(2){
    margin-left: 0rem;
  }
  .grotte .cf div:last-child{
    width: 100%;
    margin-left: 0rem;
    margin-bottom: 1rem;
  }
  .grotte3{
    background: none;
  }
  .grotte2 .text2{
    width: 100%;
    padding: 1rem 1rem;
  }
  .grotte4 .cf div{
    float: none;
  }
  .grotte4 .cf div:first-child{
    width: 100%;
    margin-left: 0rem;
  }
  .grotte4 .cf .text3{
    width: 100%;
    margin-left: 0rem;
    text-align: center;
  }
  /*page service*/
  .services .cf div{
    float: none;
  }
  .services h1{
    margin-top: 20rem;
  }
  .services h2{
    margin-top: 5rem;
  }
  .services .cf div{
    float: none;
  }

  .services .cf div:first-child{
    width: 100%;
    margin-left: 0rem;
    margin-bottom: 1rem;
  }
  .services .cf .textpg3{
    width: 100%;
    
  }
  .services .cf div:last-child{
    margin-left: 0rem;
  }
  .services2 h2{
    margin-top: 3rem;
  }
  .services2 .cf .pg3{
    width: 100%;
  }
  .services2 .cf div:first-child{
    margin-left: 0rem;
  }
  .services2 .cf div:last-child{
    width: 100%;
    margin-left: 0rem;
    margin-top: 1rem;
  }
  .services3{
    margin-top: 4rem;
  }
  .services3 .cf div:first-child{
    width: 100%;
    margin-left: 0rem;
    margin-bottom: 1rem;
  }
  .services3 .cf .text2pg3{
    width: 100%;
    padding-bottom: 5.5rem;
  }
  .services3 .cf div:last-child{
    margin-left: 0rem;
  }
    /*page tarifs*/ 
  .tarifs_1 .wrapper h1 .titre{
    color: white;
  }
  .tarifs_1 h1{
   color:white; 
  }
  .tarifs .cf div{
    margin-bottom: 1rem;
    width: 37%;
  }
  .tarifs .cf div.adultes{
    margin-left: 3rem;
  }
  .tarifs3 .cf div{
    width: 37%;
  }
  .enfants{
    margin-left: 3rem;
  }
  .enfants2{
    margin-left: 3.3rem;
  }
  .adultes2{
    margin-left: 4rem;
  }
  .adultes3{
    width: 37%;
    margin-left: 3rem;
  }
  .ados3{
    width: 37%;
  }
  .enfants3{
    width: 37%;
    margin-top: 1rem;
    margin-left: 12rem;
  }
   /*page accès*/
    .acces {
    background: none;
   }
   .acces h1{
    margin-top: 10rem;
    color: #594A42;
    margin-bottom: 0rem;
   }
   .acces h1 .titre{
    color: #594A42;
   }
   .horaire .cf div{
    float: none;
   }
   .horaire1{
    width: 100%;
    margin-left: 0rem;
    margin-bottom: 1rem;
   }
   .horaire .cf div.acces{
    width: 100%;
    margin-left: 0rem;
   }
   .map .cf div.frame{
    width: 100%;
    margin-left: 0rem;
    margin-bottom: 1rem;
   }
   .adress{
    width: 100%;
    margin-left: 0rem;
   }
   .contact3 .wrapper h1 .titre{
    color: white;
   }
   #prenom,#nom,#tel,#email2{
    width: 80%;
    margin-right: 0rem;
   }
   #message{
    width: 80%;
   }
   #envoyer{
    width: 40%;
   }

}
@media only screen and (max-width:320px){
  .accueil2 .cf div:last-child p{
    top: 13rem;
    left: 2rem;
  }
  .accueil2 .cf div:last-child h3{
    top: 12rem;
    left: 9rem;
  }
  .adultes2{
    margin-left: 2rem;
  }

  .adultes3{
    margin-left: 2rem;
  }
  .adultes3 h3{
    font-size: 1.5rem;
  }
  .tarifs .cf div p{
    font-size:1.6rem;
    padding: 0rem 0rem;
  }
  .tarifs3 .cf div p{
    padding: 0rem 0rem;
  }
  .enfants3{
    margin-left: 8rem;
  }
  .enfants3 h3{
    font-size: 1.5rem;
  }
  .ados3 h3{
    font-size: 1.5rem;
  }
  .ados3 p{
    font-size: 1.6rem;
  }
}