@charset "iso-8859-1";
/* CSS Document */

.fs {
  height: 100vh; }

.slide {
  color: #ffffff;
  position: relative; }
  
	.bcg {
	  background: no-repeat center center;
	  background-size: cover;
	  position: absolute;
	  width: 100%;
	  height: 100%;
	  opacity: 1; }

	  #visuel01 .bcg {
		background:  url(images/fond-vignoble.jpg) no-repeat center bottom;
		background-size: cover; }

#trigger2 {
	position: relative;
	top: 100px;
}
#pinned-trigger2 {
	position: relative;
}
#texte1.texte {font-size:4.0vh; color:#fff; line-height:145%; opacity:0.9; position:relative; text-align:center}
#texte2.texte, #texte3.texte, #texte4.texte {font-size:4.3vh; color:rgba(0, 0, 0, 0.5); line-height:145%; padding:10px; text-align:center}


.centrerVertical {
	display:flex;
	align-items:center;
}

.zoning {
	min-height: 100vh;
	position:relative;
	overflow:hidden;
}

.zoningBreak {
	min-height: 50vh;
	position:relative;
}



.demo{
  width:50%;
  height:100vh;
  overflow:hidden;
  position:absolute;
  right:0;
  bottom:0px
  
}
.bubble{
  border-radius: 50%;
  position: absolute;
  opacity:0.5;
}

.smallBubble{
    width:5px;
    height:5px;
    background-color:#bfb470;
}

.mediumBubble{
    width:10px;
    height:10px;
    background-color:#bfb470;
}

.largeBubble{
    width:20px;
    height:20px;
  background-color:#bfb470;
}


#logoChampagne {
right:0;
position: absolute;
z-index:10;
opacity:0;
}


@media screen and (min-width: 1024px) {
	/* ordinateur */
	#contentAccueil {}
	#cadreNoir{ padding: 4%; margin:0 10% 0 10%; opacity:0; }
}


@media screen and (max-width: 1024px) {
	/* tablette  */
	#contentAccueil {}
	#cadreNoir{ padding: 4%; margin:0 10% 0 10%; opacity:0; 
}

@media screen and (max-width: 768px) {
	/* mobile ou tablette portrait */
	#contentAccueil {background-image: none;}
	#cadreNoir{ padding: 4%; margin:1%; opacity:0; height:100vh; }
	.introAccueil p { padding:50px;}
}