@charset "utf-8";
/* CSS Document */

body{
	margin:0;
	background:#FFFFFF;
}

li{  list-style-type: none;font-family: "Montserrat", sans-serif;}
li:before {
    font-family: FontAwesome;
    content: "";
    margin-right: 5px;
    margin-left: 10px;
}

.menu_vert a{color:#000000; text-decoration:none;}
.menu_vert a:hover{color:#10546f; text-decoration:none;}
.menu_vert a:before {
    font-family: FontAwesome;
    content: "";
    margin-right: 5px;
    margin-left: 10px;
}

.ctnpage p{line-height:25px}
.ctnpage li{line-height:25px}

.hierar a{color:#000000; text-decoration:none;}
.hierar a:hover{color:#000000; text-decoration:none;}
.hierar a:before {
    font-family: FontAwesome;
    content: "";
    margin-right: 5px;
    margin-left: 10px;
	text-decoration:none
}
.compte{text-decoration:none; color:#000000}
.compte:before {
    font-family: FontAwesome;
    content: "";
    margin-right: 5px;
    margin-left: 10px;
	text-decoration:none
}


p{
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}

h1{
	font-family: "Poetsen One", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight:bold;
	text-transform:uppercase;
	font-size:45px;   
}
h3{
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight:bold;
	text-transform:uppercase;   
}
.sejourh3{
  font-weight: 700;
  border-left: 6px solid #f7941e;
  padding-left: 12px;
  background:#10546f;
  margin-bottom: 1rem;
  padding-top:7px;
  padding-bottom:7px;
  color: #FFFFFF;}
h2{
  font-family: "Poetsen One", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-transform:uppercase;
  font-size:35px;
}

.wpage{
	width:98%;
	margin-left:auto;
	margin-right:auto;
}

/* LES TAILLES DE POLICE */

.fs12{font-size:12px}
.fs14{font-size:15px}
.fs16{font-size:16px}
.fs18{font-size:18px}
.fs20{font-size:20px}
.fs25{font-size:25px}
.fs30{font-size:30px}
.fs40{font-size:40px}
.fs50{font-size:50px}

/* LES BACKGROUNDS */

.bgblanc{
	background:white;
}
.bzgjtr2{  background-color: rgba(255,255,255,0.75);}
.bg_bleu{background:#10546f}

/* LES TABLEAUX */

.table{
	display:table;
}
.tablec{
	display:table-cell;
}

.vert-top{
	vertical-align:top;
}

.vert-mid{
	vertical-align:middle;
}

.ali-cen{
margin-left:auto;
margin-right:auto;
}


/* LES MARGES EXTERIEURES */

.mar0{margin:0}


.mart0{margin-top:0}
.mart10{margin-top:10px}
.mart15{margin-top:15px}
.mart20{margin-top:20px}
.mart30{margin-top:30px}
.mart50{margin-top:50px}
.mart100{margin-top:100px}

.marb0{margin-bottom:0}
.marb03{margin-bottom:3px;}
.marb10{margin-bottom:10px}
.marb15{margin-bottom:15px}
.marb20{margin-bottom:20px}
.marb30{margin-bottom:30px}
.marb40{margin-bottom:40px}
.marb50{margin-bottom:50px}
.marb70{margin-bottom:70px}
.marb100{margin-bottom:100px}

.marr20{margin-right:20px}

/* LES MARGES INTERIEURES */

.pad0{padding:0}
.pad04{padding:4px}
.pad10{padding:10px}

.padl10{padding-left:10px}
.padl20{padding-left:20px}

.padr10{padding-right:10px}
.padr20{padding-right:20px}

.padb15{padding-bottom:15px}
.padb30{padding-bottom:30px}

.padt10{padding-top:10px}
.padt100{padding-top:100px}
.padt200{padding-top:200px}
.padt300{padding-top:300px}


/* LES LARGEURS */

.w05{width:5%}
.w10{width:10%}
.w20{width:20%}
.w25{width:25%}
.w30{width:30%}
.w375{width:37.5%}
.w33{width:33%}
.w40{width:40%}
.w50{width:50%}
.w63{width:63%}
.w70{width:70%}
.w90{width:90%}
.w93{width:93%}
.w94{width:94%}
.w95{width:95%}
.w97{width:97%}
.w100{width:100%}



.champs_text{
	display: block;
    padding: 6px 12px;
    font-family: 'Montserrat', sans-serif;
    line-height: 1.42857143;
    color: #000000;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

	    .banner-title {
      font-weight: 800;
      color: #FFFFFF;
      background-color: #10546f;
      padding: 10px 14px;
      margin-bottom: 12px;
      border-left: 5px solid #FFFFFF;
      text-transform: uppercase;
      letter-spacing: 0.04em;
	  font-family: 'Montserrat', sans-serif;
    }


.txttu{text-transform:uppercase}

nav{display:table; width:100%; border-top:0.6px solid #000000}
nav a{display:table-cell; width:12.5%; padding-bottom:10px; padding-top:10px; font-size:14px; font-family: 'Montserrat', sans-serif; text-decoration:none; text-align:center; font-weight:700; color:#000000; height:25px}
nav a:hover{background:#FFFFFF; color:#10546f}
.bor-rad-10{border-radius:10px}
.lh15{line-height: 1.5em;}
.couleur_bleu{color:#10546f}
.couleur_blanc{color:#FFFFFF}



    .section-title {
      text-align: center;
      margin: 60px 20px 30px;
      font-size: 1.6em;
      color: #f7941e;
    }

    .cards {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 20px;
      max-width: 1200px;
      margin: 0 auto 60px;
      padding: 0 20px;
    }

    .card {
      background: white;
      border-radius: 10px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      overflow: hidden;
      width: 280px;
      text-align: center;
      transition: transform 0.3s;
    }
	
    .card25217 {
      background:#80FF80;
      border-radius: 10px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      overflow: hidden;
      width: 280px;
      text-align: center;
      transition: transform 0.3s;
    }
	
    .card2 {
      background: white;
      border-radius: 10px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      overflow: hidden;
      width: 500px;
      text-align: center;
      transition: transform 0.3s;
    }
	
    .card3 {
      background: white;
      border-radius: 10px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      overflow: hidden;
      width: 330px;
      text-align: center;
      transition: transform 0.3s;
    }
	
    .card img {
      width: 100%;
      height: 160px;
      object-fit: cover;
    }

    .card h3 {
      margin: 10px;
    }

    .card p {
      padding: 0 10px 20px;
      font-size: 0.95em;
    }

    .card:hover {
      transform: translateY(-5px);
    }
	
    .card2 img {
      width: 100%;
      height: 160px;
      object-fit: cover;
    }

    .card2 h3 {
      margin: 10px;
    }

    .card2 p {
      padding: 0 10px 20px;
      font-size: 0.95em;
    }

    .card2:hover {
      transform: translateY(-5px);
    }
	

    .card3 img {
      width: 100%;
      height: 160px;
      object-fit: cover;
    }

    .card3 h3 {
      margin: 10px;
    }

    .card3 p {
      padding: 0 10px 20px;
      font-size: 0.95em;
    }

    .card3:hover {
      transform: translateY(-5px);
    }
	
   @media (max-width: 768px) {
      .cards {
        flex-direction: column;
        align-items: center;
      }
      .cards2 {
        flex-direction: column;
        align-items: center;
      }
      .cards3 {
        flex-direction: column;
        align-items: center;
      }
    }	

.btn-principal {
  display: inline-block;
  padding: 12px 24px;
  background-color: #f7941e;
  color: black;
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
	font-family: "Montserrat", sans-serif;
  transition: background-color 0.3s, transform 0.2s;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.btn-principal:hover {
  background-color: #e67c00;
  color:#FFFFFF;
  transform: translateY(-2px);
}

.btn-principal:active {
  transform: scale(0.97);
}




.participez {
  background-color: #d9f0e1;
  padding: 60px 20px;
  color: #003c57;
}

.participez h2 {
  text-align: center;
  font-size: 2em;
  margin-bottom: 40px;
}

.container {
  max-width: 1000px;
  margin: auto;
}

.block {
  background: white;
  border-radius: 10px;
  padding: 30px;
  margin-bottom: 30px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.block h3 {
  margin-top: 0;
}

.liste-offres,
.liste-commissions {
  list-style: none;
  padding-left: 0;
  margin-top: 15px;
}

.liste-offres li,
.liste-commissions li {
  margin-bottom: 10px;
}


.section-qui-sommes-nous {
}

.container-qui {
  max-width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  align-items: center;
}

.qui-image {
  flex: 1 1 40%;
}

.qui-image img {
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.qui-texte {
  flex: 1 1 55%;
  color: #003c57;
}

.qui-texte h2 {
  color: #f7941e;
  font-size: 2em;
  margin-bottom: 20px;
}

.qui-texte p {
  font-size: 1.05em;
  line-height: 1.6;
  margin-bottom: 15px;
}


@media (max-width: 768px) {
  .container-qui {
    flex-direction: column;
    text-align: center;
  }

  .qui-image, .qui-texte {
    flex: 1 1 100%;
  }
}







    .tabs {
      display: flex; margin-top:50px;
      flex-wrap: wrap;
      width: 100%;
      background-color: #f7941e;
    }

    .tabs button {
      flex: 1 1 25%;
      background-color: #f7941e;
      color: white;
      border: none;
      padding: 15px;
      font-size: 1em;
      font-weight: bold;
      cursor: pointer;
      transition: background-color 0.3s;
    }

    .tabs button:hover,
    .tabs button.active {
      background-color: #e67c00;
    }

    .tab-content {
      padding: 30px 20px;
      display: none;
    }

    .tab-content.active {
      display: block;
      animation: fadeIn 0.5s ease-in-out;
    }

    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(10px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @media (max-width: 768px) {
      .tabs button {
        flex: 1 1 100%;
      }
    }
	
	
	
.autres-sejours {
  text-align: center;
}

.autres-sejours h2 {
  font-size: 1.8em;
  color: #003c57;
  margin-bottom: 40px;
}

.sejours-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
  max-width: 1000px;
  margin: auto;
}

.card-sejour {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  width: 280px;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s;
}

.card-sejour:hover {
  transform: translateY(-5px);
}

.card-sejour img {
  width: 100%;
  height: 160px;
  object-fit: cover;
}

.card-content {
  padding: 20px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.card-content h3 {
  margin: 0 0 10px;
  font-size: 1.2em;
  color: #003c57;
}

.card-content p {
  font-size: 0.95em;
  margin-bottom: 15px;
  color: #555;
}	
	
.titre-section-3 {
  background-color: #f7941e;
  padding: 20px; border-radius:10px;
  text-align: center;
  margin-bottom: 40px;
}

.titre-section-3 h2 {
  margin: 0; text-transform: uppercase;
  color: #FFFFFF;
  font-size: 2em;
}





.slider {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.slides {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.slide {
  min-width: 100%;
  position: relative;
}

.slide img {
  width: 100%;
  height: auto;
  display: block;
}

.caption {
  position: absolute;
  bottom: 20%;
  left: 10%;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  padding: 20px;
  border-radius: 5px;
}

.caption h2 {
  font-size: 2em;
  margin-bottom: 10px;
}

.caption p {
  font-size: 1.2em;
  margin-bottom: 15px;
}

.btn {
  display: inline-block;
  padding: 10px 20px;
  background: #ff6600;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
}

.nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  font-size: 2em;
  padding: 10px;
  cursor: pointer;
  z-index: 10;
}

.nav.prev {
  left: 10px;
}

.nav.next {
  right: 10px;
}

.pagination {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
}

.dot {
  height: 15px;
  width: 15px;
  margin: 0 5px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  cursor: pointer;
}

.dot.active {
  background-color: #717171;
}