
body{
  background-image:  url('https://images.unsplash.com/photo-1545569341-9eb8b30979d9?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
 height: auto;
 width: auto;
  font-family: Poppins

}.fuji1:hover{
  color: #ed3c57;
}

::selection {
  color: #fff;
  background: #85666b;
  }

::-moz-selection {
  color: #fff;
  background: #85666b;
  }

.lol{
  text-decoration: none;
  font-weight: bold;
  
}
.desc{
  text-shadow: 3px -2px 11px rgba(255,255,255,0.65);
 
}
.parallax{
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  
}
.deg{
  padding-top: 320px;
}
.pad10{
  padding-top: 100px;
}
.titre{
  color: white;
  font-weight: bold;
  font-size: 65px;
  letter-spacing: 70px;
}

.titre1{

  font-size: 35px;
  font-weight: bold;
}

.countour{
  border:1px solid white;
  color: black;
  border-radius:10px;
  text-align: center;
  box-shadow:0px 0px 50px 30px #474747 ;
  background-color: whitesmoke;
}
.nop{
  text-decoration: none;
}
.stop{
  padding-left: 0px;
  padding-right: 0px;
  margin-left: 0px;
  margin-right: 0px;
}
.noire{
  background-color: black;
  margin-top: 600px;
  width: 100%;
  height: 100%;
  padding-bottom: 250px;

}
.test{
  padding-top: 30px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  text-decoration: underline;
  text-underline-offset: 8px;
  text-shadow: 3px -2px 11px rgba(255,255,255,0.65);
}
.culturep{
  width: 450px;
  height: 300px;
}
.pad8{
  padding-top: 30px;
}
.haut{
  padding-top: 75px;
}
.desc{
  color: white;
  font-size: 15px;
  padding-top: 30px;
}
.dd{
  display: flex;
  text-align: center;
}
.gastro{
  width: 400px;
  height: 300px;
}
.aut{
  width: 400px;
  height: 300px;
}
.aaa{
 
    width: 400px;
    height: 300px;
  
}
.al{
  text-align: center;
}
.im{
  padding-top: 100px;
}
.image{
background-image: url('https://res.cloudinary.com/jnto/image/upload/w_1400,f_auto,fl_lossy,q_auto,c_scale/v1/media/filer_public/c3/0d/c30d38ba-195f-49df-90c2-c0839054b2b1/vd_yakushima_shutterstock_16120638702_owo901');
height: 200px;
background-repeat: no-repeat;
background-size: cover;
position: relative;
background-position: center 60%;
top: 60px;
}
.exp{
  color: white;
  font-size: 40px;
  font-weight: bold;
 text-align: center;
  padding-top: 4%;
}
.art{
  color: white;
}
.fuji:hover{
  color: #ed3c57;
}
.riz{
  padding-top: 100px;

  width: 660px;

}
.lolilo{
  padding-top: 170px;
  display: flexbox;
}
.tori1{
  padding-top: 300px;
  width: 650px;
  height: 600px;
}

.pad3{
  padding-top: 50px;
}
.desc1{
  color: white;
    font-size: 15px;
    padding-top: 30px;
    
}
.stat{

  color: white;
  display: flex;
  text-align: left;
  font-weight: bold;
  font-size: 50px;
  padding-top: 0px;
  text-decoration: none;
}
.info{
  color: #ed3c57;
  text-decoration: none;
  font-style: italic;
}
.bien{
  display: flex;
  text-align: left;
}
.fuji{
  color: white;
  font-weight: bold;
  font-size: 50px;
 display: flex;
 text-align: left;
  text-decoration: none;
}
.for{
  color: white;
  font-size: 18px;
}
.pad1{
  padding-top: 100px;
  text-align: center;
}
.padd{
  padding-top: 200px;
}
.pad2{
  padding-top: 150px;
  text-align: center;
}






.sush{
  padding-top: 150px;


}
.fuji2:hover{
  color: #ed3c57;
}
.fuji1{
  color: white;
  font-weight: bold;
  font-size: 50px;
  padding-top: 140px;
  text-decoration: none;


}
.fuji2{
  color: white;
  font-weight: bold;
  font-size: 50px;
  
  text-decoration: none;

}
.padi{
  padding-top: 140px;
}
.padi1{
  padding-top: 120px;
}














/*CSS de la NavBar*/
.navbar .menu-hamburger{
  display: none;
  position: absolute;
  top: 50px;
  right: 30px;
  width: 35px;

}



.navbar{
  position: absolute;
  padding: 0px;
  padding-top: 10px;

  display: flex;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  align-items: center;
}
.navbar a {
  color: white;
}
.li a{
  text-decoration: none;
}
.navbar .logo{
  height: 110px;
  width: 195px;
  padding-left: 10px;
}
.navbar .nav-links ul{
  display: flex;
  list-style: none;
  padding: 30px;
  
}
.navbar .nav-links ul li{
  margin:  0 25px;
  
}
.navbar .nav-links ul li a.active{
  color: #ed3c57;
}
.navbar .nav-links ul li a:hover{
  color: #ed3c57;
}
  

/*Responsive de la NavBar*/
@media screen and (max-width: 900px) {
  .navbar{
    padding: 0;
  }
  .navbar .logo{
    padding-left: 0px;
    position: absolute;
    top: 14px;
    left: 1px;
  }
  .loli{
    padding: 0px;
  }
.navbar .menu-hamburger{
  display: block;
}
.titre{
  display: none;
}
  .nav-links{
    top: 0;
    left: 0;
    position: absolute;
    background-color: rgba(255, 255, 255, 0.253);
    backdrop-filter: blur(7px);
    width: 100%;
    height: 108vh;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: -100%;
    transition: all 0.5s ease;
   
  }
  .nav-links.mobile-menu{
    margin-left: 0;
  }
  .nav-links ul{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .navbar .nav-links ul li{
    margin:  25px;
    font-size: 1.2em;
    
  }
}






    /* Menu Button 1 */
    .menu-btn-1 {
      height: 32px;
      width: 40px;
      cursor: pointer;
  }

      .menu-btn-1 span,
      .menu-btn-1 span::before,
      .menu-btn-1 span::after {
          background: white;
          border-radius: 3px;
          content: '';
          position: absolute;
          width: 40px;
          height: 6px;         
          margin-top: 13px; 

          -webkit-transition: .3s ease-in-out;
          -moz-transition: .3s ease-in-out;
          -o-transition: .3s ease-in-out;
          transition: .3s ease-in-out;
      }

      .menu-btn-1 span::before {
          margin-top:-12px;
      }

      .menu-btn-1 span::after {
          margin-top:12px;
      }

      .menu-btn-1.active span {
          background: transparent;
      }

      .menu-btn-1.active span::before {
          margin-top: 0;

          -webkit-transform: rotate(45deg);
          -moz-transform: rotate(45deg);
          -o-transform: rotate(45deg);
          transform: rotate(45deg);
      }

      .menu-btn-1.active span::after {
          margin-top: 0;

          -webkit-transform: rotate(-45deg);
          -moz-transform: rotate(-45deg);
          -o-transform: rotate(-45deg);
          transform: rotate(-45deg);
      }


      .slider{
        position: relative;
         max-width: 40rem; 
        height: 26.625rem; 
        margin: 0 auto;
        overflow: hidden;
    }
    .slide{ 
        position: absolute;
        top:0;
        width: 100%;
        height: 26.625rem;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: transform 1s;
    }
    .slide > img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    button{
        background: none;
        border: none;
    }
    button .fas{
        color: rgba(255, 255, 255, .5);
    }
    .btn-slide{
        position:absolute;
        top:50%;
        z-index: 10;
    
        height: 5.5rem;
        width: 5.5rem;
        cursor: pointer;
    }
    .prev{
        left:3rem;
        transform: translate(-50%, -50%);
    }
    .next{
        right: 3rem;
        transform: translate(50%, -50%); 
    }
    .dots-container{
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
    }
    .dot{
        width: 25px;
        height: 5px;
        margin: 15px 5px;
        border-radius: .5rem;
        background: rgba(39,39,39, .5);
        cursor: pointer;
    }
    .dot.active{
    background:#272727;
    }



    