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

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

body {
/*	background-color: #222222 !important;*/
}

/* polices */

@font-face {
    font-family: 'byron';
    src: url('/fonts/byronmedium-webfont.eot');
    src: url('/fonts/byronmedium-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/byronmedium-webfont.woff2') format('woff2'),
         url('/fonts/byronmedium-webfont.woff') format('woff'),
         url('/fonts/byronmedium-webfont.ttf') format('truetype'),
         url('/fonts/byronmedium-webfont.svg#byron_mediumregular') format('svg');
    font-weight: normal;
    font-style: normal;

}



#texteIndex,
#texte1,
#pied,
.blocart
 { font-family:Quicksand !important}

.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 top;
		background-size: cover; }

#trigger2 {
	position: relative;
	top: 100px;
	width:50%; margin:0 auto; background-color:#9E000A; padding:20px;
}
#pinned-trigger2 {
	position: relative;
}

#imageAnim {
	bottom: -10px;
left: 0px;
position: absolute;}

#texte1.texte {font-size:4vh; color:#fff; line-height:145%; opacity:0.9; position:relative; text-align:center}
#texte2.texte, #texte3.texte, #texte4.texte {
	font-size: 2rem;
	color: #BDA366;
	line-height: 100%;
	padding: 10px;
	text-align: center;
	    font-weight: normal;
}
	}

#texteIndex {font-size:3vh; color:#eee; line-height:145%; opacity:0.9; position:relative; text-align:center}

#texteAction {

}


#texteAction a {
background-color: #BDA366;
border-radius: 50px;
color: #fff;
display: block;
height: 60px;
margin: 30px auto auto;
padding: 5px;
width: 60px;
}

#texteAction a:hover {
	background-color: #829d3c;

box-shadow: 0 0 14px rgba(0, 0, 0, 0.3);
color: #fff;
transition:all 0.5s ease 0s;
}


.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;
top:-15px;
}


#HVE { position: relative; opacity: 0; right: -10px; }

#VDC { 	position: relative; opacity: 0; left:-10px;}



@media screen and (min-width: 1024px) {
	/* ordinateur */
/*	#contentAccueil {background-image: url('images/fond-index.jpg'); background-position: left bottom;background-repeat: no-repeat;background-size: cover;}*/
	#cadreNoir{ background-color: rgba(255, 255, 255, 0.8);
height: 100vh;
margin: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100vw;}
	#logoIndex { width:60vh; margin:auto; opacity:0;}
}


@media screen and (max-width: 1024px) {
	/* tablette  */
/*	#contentAccueil {background-image: url('images/fond-index.jpg'); background-position: left bottom;background-repeat: no-repeat;background-size: cover;}*/
	#contentAccueil {
		}
	#cadreNoir{background-color: rgba(255, 255, 255, 0.9);
height: 100vh;
margin: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100vw; }
	#logoIndex { width:60vh; margin:auto}
}

@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;}
	#logoIndex { width:85vw; margin:70px auto auto;}
#trigger2 { width:80%; }
#texte1.texte {font-size: 3vh;}

}