/* ==========================================================================
  01. GENERAL & BASIC STYLES
  =========================================================================== */
  @import url('https://fonts.googleapis.com/css2?family=Satisfy&display=swap');

  html {
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
  } 

  h1,h2,h3,h4,h5,h6 {
    font-family: 'Satisfy', cursive;
    color: rgb(25, 135, 84);
  }
  
  .container-ui {
    position: relative;
    max-width: 1920px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0;
    width: 100%;
  }

  img {
    width: 100%;
  }

  ul li {
    list-style: none;
  }

  a {
    text-decoration: none;
  }

  .position-absolute {
    left: 0;
    right: 0;
  }

  .text-shadow {
    text-shadow: 0px 0px 0.52em rgba(0,0,0,0.5);
  }

  .skiptranslate {display: none;}
  /*------------------------------------------*/
  /*  parallax
  /*------------------------------------------*/
  .parallax {
    background-image: url('../images/camping-en-ardeche-avec-acces-direct-riviere-205-1640101164.jpg');
    position: relative;
    opacity: 0.7;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 50vh;
    z-index: -1;
  }
  .parallax.parallax-1 {
    background-image: url('../images/camping-ardeche-avec-acces-direct-riviere-87-1639643218.jpg');
  }
  .parallax.parallax-2 {
    background-image: url('../images/camping-en-sud-ardeche-avec-acces-riviere-153-1640075455.webp');
  }
  /*------------------------------------------*/
  /*  back to top
  /*------------------------------------------*/
  #myBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    border: none;
    outline: none;
    color: white;
    cursor: pointer;
    border-radius: 4px;
    background-color: #fff;
    padding: .5%;
  }
  
  #myBtn:hover {
    color: green;
  }
  /*------------------------------------------*/
  /*  breadcrumb
  /*------------------------------------------*/
  .breadcrumb-item + .breadcrumb-item::before {content: ""; }
  .breadcrumb-item + .breadcrumb-item.active {padding-left: 0;}
  .breadcrumb-item i {margin-right: 0 !important;}
  /*------------------------------------------*/
  /*  form
  /*------------------------------------------*/
  .form {
    position: relative;
    top: -1.7em;
    z-index: 99;
  }
  input[type="date"]:before {
    content: attr(placeholder);
    pointer-events: none
  }
  /*------------------------------------------*/
  /*  fade carousel
  /*------------------------------------------*/
  .fade-carousel-item {
    height: 255px;
    max-height: 255px;
    object-fit: cover;
  }
  /*------------------------------------------*/
  /*  Main
  /*------------------------------------------*/
  .wrapMain {
    top: -3.1rem;
  }
  /*------------------------------------------*/
  /*  Page content
  /*------------------------------------------*/
  #page-content .wrapMain {
    margin-top: 10em;
  }
  #page-content .form {
    top: 17.5em;
  }
  #page-content .title {
    height: 4em;
    background: url("../images/camping-calme-en-pleine-nature-en-ardeche-88-1639643218.jpg") left 11% no-repeat;
    background-size: 100%;
    opacity: .9;
  }
  #page-content .activites.title {
    height: 4em;
    background: url("../images/camping-en-sud-ardeche-avec-acces-riviere-145-1640074993.jpg") left 100% no-repeat;
    background-size: 100%;
  }
  
  /*------------------------------------------*/
  /*  Nos tarifs
  /*------------------------------------------*/
  .nos-tarifs .tarifs-carousel .tarifs-carousel-slider .slick-list {
    padding: 0 !important;
  }
  .nos-tarifs .tarifs-carousel .tarifs-carousel-slider .slick-track {
    width: 100% !important;
  }
  .nos-tarifs .tarifs-carousel .tarifs-carousel-slider .slick-slide {
    width: 19.9% !important;
  }
  .nos-tarifs .tarifs-carousel .table {
    width: 99.9% !important;
  }
  /*  Needed for filters */
  .nos-tarifs .hide { /* You can play with the seconds to change the "animation" */
    animation: hide .3s ease 0s 1 normal forwards;
    transform-origin: center;
    }
  .nos-tarifs .show { /* You can play with the seconds to change the "animation" */
  animation: show .3s ease 0s 1 normal forwards;    
  transform-origin: center;
  }

  @keyframes hide {
  0%{
  transform: scale(1);        
  }
  100% {
  transform: scale(0);        
  width: 0;
  height: 0;
  margin: 0;
  }
  }
  @keyframes show {
  0%{
  transform: scale(0);     
  width: 0;
  height: 0;
  margin: 0;   
  }
  100% {
  transform: scale(1);    
  }
  }
  /*  // Needed for filters */
  .nos-tarifs .filter:hover {
    cursor: pointer;
  }

  /*------------------------------------------*/
  /*  Location carousel
  /*------------------------------------------*/
  .location .location-carousel .slick-slide {
    max-height: 12em !important;
  }
  .location .location-carousel img {
    object-fit: cover;
  }
  /*------------------------------------------*/
  /*  footer
  /*------------------------------------------*/

  footer p, i {
    padding: 0;
    margin: 0;
  }
  footer i {
    color:#FFE5E9;
  }