body{
	font-size: 16px;
	color: #000000;
	font-weight: 300;
	line-height: 26px;
	font-family: 'Montserrat','Roboto',sans-serif;
}

.abc{
	background: darksalmon;
}

	a{
		text-decoration: none;
		color: #000000;
	}

h1{
	font-size: 40px;
	font-family: 'Bodoni Moda','Lora',serif;
	text-transform: uppercase;
	text-align: center;
}

	h2{
		font-size: 20px;
		font-family: 'Montserrat','Lora',serif;
		font-weight: 400;
		color: #dcbe84;
		text-transform: uppercase;
		text-align: center;
	}

		h3{
			font-size: 25px;
			font-family: 'Bodoni Moda','Lora',serif;
			font-weight: 500;
			/*text-transform: uppercase;*/
			padding-top: 20px;
			color: #000000;
		}

		h4{
			font-size: 30px;
			font-family: 'Bodoni Moda','Lora',serif;
			text-align: left;
			font-weight: 500;
			color: #000000;
		}

			h5{
				font-size: 18px;
				font-family: 'Bodoni Moda','Lora',serif;
				font-weight: 400;
				color: #000000;
			}

				h6{
					color: white;
					font-family: 'Bodoni Moda','Lora',serif;
					/*text-transform: none;*/
					text-align: left;
					font-size: 19px;
					font-weight: 500;
				}


.bouton_noir{
	background: #000000;
	padding: 18px 30px 18px 30px;
	text-transform: uppercase;
	color: white;
	text-align: center;
	border: solid 2px #333;
}

	.bouton_noir:hover{
		background: transparent;
		padding: 18px 30px 18px 30px;		
		color: #000000;
		margin: 30px 0 30px 0;
		border: solid 2px #333;
		transition: all 0.5s ease-out;
	}

.fond_gris{
	background: #F1F1F1;
	/*padding: 4%;*/
}

.bouton_{
	margin: 50px 0 50px 0;
}

.color{
	color: #dcbe84;
	font-weight: 400;
}

.espace{
	padding-bottom: 3%;
}

.m_top{
	margin-top: 6%;
}

	.m_bottom{
		margin-bottom: 7%;
	}

.p_bottom_top{
	padding: 5% 0 5% 0;
}

	.p_left_right_bottom_top{
		padding: 5%;
	}

/* ---------- HEADER ---------- */
header{
	padding: 15px 0 15px 0;
	position: fixed;
	background: white;
	box-shadow: 0 0 8px 0 rgb(0 0 0 / 50%);
	z-index: 999;
	background: linear-gradient(0deg, rgba(245,245,245,1) 30%, rgba(255,255,255,1) 70%);
    opacity: 98%;
}

header i{
	color: #000000;
	padding-left: 20px;
	font-size: 20px;
	padding-top: 7%;

}

	header i:hover{
		/*color: #dcbe84;*/
		transition: all 1s ease;transition: all 0.5s ease-out;
		flex-grow: 1;
		transform: translateY(-0.3em);	
	}

.logo_accueil:hover{
	opacity: 70%;
	transition: all 1s ease;
}

.nav-link{
	color: black;	
}

nav a{
	text-transform: uppercase;		
}

	nav a:hover{
		transition: all 0.5s ease-out;
		transform: translateY(-0.5em);
	}

/*nav{
	z-index: 999;
	display: block;
	margin: auto;		
}*/

/*nav li{
	list-style: none;
	text-transform: uppercase;	
	color: #333;
	float: left;
	padding: 0 2% 0 2%;
}

	nav li:hover{
		transition: all 0.5s ease-out;
		flex-grow: 1;
		transform: translateY(-0.5em);
	}

nav a{
	color: #000000;
	font-size: 15px;
	font-weight: 400;
}
	
	nav a:hover{
		color: #000000;		
	}*/


/* ---------- HAUT DE PAGE ---------- */
.haut_de_page1{
	background: url(images/bg1.jpg) no-repeat center fixed;
	background-size: cover;
	min-height: 550px;
	margin-bottom: 75px;
}

	.haut_de_page2{
		background: url(images/bg2.png) no-repeat center fixed;
		background-size: cover;
		min-height: 550px;
		margin-bottom: 75px;
	}

		.haut_de_page3{
			background: url(images/bg3.png) no-repeat center fixed;
			background-size: cover;
			min-height: 550px;
			margin-bottom: 75px;
		}

			.haut_de_page4{
				background: url(images/bg4.png) no-repeat center fixed;
				background-size: cover;
				min-height: 550px;
				margin-bottom: 75px;
			}

			.haut_de_page5{
				background: url(images/bg5.png) no-repeat center fixed;
				background-size: cover;
				min-height: 550px;
				margin-bottom: 75px;
			}

				.haut_de_page6{
				background: url(images/bg6.png) no-repeat center fixed;
				background-size: cover;
				min-height: 550px;
				margin-bottom: 75px;
			}

	.haut_de_page1 img, .haut_de_page2 img, .haut_de_page3 img, .haut_de_page4 img, .haut_de_page5 img,.haut_de_page6 img {
		max-width: 30%;
		display: block;
		margin: auto;
	    padding-top: 160px;
	}

/* ---------- LOTTIE PLAYER ---------- */
lottie-player{
    padding: 6% 0 9% 0;
    display: block;
    margin: auto;
    color: ; /*?????*/
}


/* ---------- NOTRE GAMME ---------- */
.notre_gamme .logo{
	position: relative;
}

 	.logo img{
 		position: absolute;
 		right: 0;
 		top: -60px;
 		width: 80px;
 		max-width: 100%
 	}



/* ---------- CITATION ---------- */

.citation h1{
	text-transform: none;
	text-align: right;
	color: #000000;
	font-size: 43px;
}

.citation img{
	padding-bottom: 3%;
	padding-right: 90%;
}

.auteur{
	color: #dcbe84;
	font-size: 18px;
	font-weight: 500;
	text-align: right;
}

/* ---------- NOTRE MAISON ---------- */
.notre_maison{
	position: relative;
	min-height: 640px;
}

.notre_maison h2{
	color: white;
}

.notre_maison img{
	position: absolute;
	background: 100px;
	left: 40px;
	top: 0;
	max-width: 100%;
	/*filter: brightness( 87% ) contrast( 145% ) saturate( 116% ) blur( 0px ) 
	hue-rotate( 0deg );*/
}

.fond_or{
	background: #dcbe84;
	position: absolute;
	top: 140px;
	right: 17px;
}

/* ----------  L'HOMME DERRIERE LE VIN ---------- */
.homme{
	background: url(images/homme.png) center fixed no-repeat;/*#191818*/;
	background-size: cover;
	padding: 0% 4% 0% 15%;
	color: white;
}

.homme h2{
	text-transform: none;
	color: white;
}

	.homme h1{
		color: #dcbe84;
		padding-bottom: 8%;
		text-transform: none;
	}

		.homme h3{
			color: #dcbe84;
		}

.homme .chapeau{
	float: right;
	margin-bottom: 8%;
}

	.italic{
		font-style: italic;
		font-weight: 400/*500*/;
		padding-left: 15%;		    
	}

		.homme img{
			padding-left: 20%;
		}
/* ----------  NOS PROCHAINS ÉVÈNEMENTS -> class actualites ---------- */
.actualites{
	/*padding: 7% 4% 0 4%;*/
}

.actualites img{
	max-width: 100%;
}
	
	.actualites h3{
		padding: 10%;
		background: rgb(243,243,243);
	    text-align: center;
	}

.actualites .actu {
	padding-top: 1%;	
}

	.actualites .actu:hover{
		transition: all 0.5s ;
		box-shadow: 0 0 5px 0 rgb(0 0 0 / 10%);
	}

/* ----------  FOOTER ---------- */

footer{
	background: url(images/bgfooter.jpg) center fixed no-repeat;
	background-size: cover;
	padding: 60px 0 50px 0;
	font-size: 13px;
	color: white;
	margin: auto;	
}

/*.col-2_4{
	position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}*/

/*.col-2_4 {   
    max-width: 20%;
}*/

footer ul{
	list-style: none;
	padding-left:0;
}

	footer li{
		color: white;
		line-height: 35px;
		font-size: 16px;
		font-family: 'Montserrat','Roboto',sans-serif;
		font-weight: 300;
	}

footer i{
	padding-right: 20px;
	padding-top: 15px;
	color: white;
	font-size: 20px;
}

	footer a{
		color: white;
	}

		footer li:hover, footer i:hover, footer a:hover, #ydeal:hover{
			transition: all 0.5s ease-out;
			transform: translateY(-0.3em);
			color: #e9ecef;
		}

.border{
	margin-top: 40px;
	margin-bottom: 30px;
	border-top:1px solid  white;
    opacity: 70%;    
}


/* ----------  DECOUVRIR NOTRE MAISON ---------- */
/* ----------  PAGE ---------- */

#carouselExampleControls{
	max-width: 80%;
    margin: auto;
}

/* ----------  NOS VIGNES & NOS CEPAGES ---------- */
.nos_vignes{
	background: url(images/carte.png)center fixed no-repeat;
	background-size: cover;
}

.nos_vignes h3{
	background: rgb(243,243,243);
	padding: 12%;
	text-align: center;
	line-height: 38px;
}


/* ----------  ELABORATION DE NOS VINS ---------- */	


/* ----------  NOTRE GAMME ---------- */


/* ----------  NOS PROCHAINS ÉVÈNEMENTS -> class actualites ---------- */
/* ----------  PAGE ---------- */
.actu_page{
	box-shadow: 0 0 10px 0 rgb(0 0 0 / 11%);
}
	
	.actu_page:hover{
			transition: all 0.5s ;
			box-shadow: 0 0 20px 0 rgb(0 0 0 / 20%);
		}

.actu_page h4{
	padding: 4% 4% 0 4%;
}

	.actu_page p{
		padding: 0 4% 4% 4%;
	}
	
.actualites_page img{
	max-width: 100%;
}

/* ----------  PARTENAIRES ---------- */
/* ----------  PAGE ---------- */
/* ----------  RESTAURANTS ---------- */

.restaurant img{
	margin-bottom: 6%;
	max-width: 100%;
}

/* ----------  GAMME ---------- */
/* ----------  PAGE ---------- */
.espace li{
	line-height: 38px;
}

.quantité{
	padding: 15px 0px 10px 0px;
    text-align: center;
    height: 60px;
}

select{
	padding: 5px;
}

.espace_bottom img{
	margin: auto;
    display: block;
}


/* ---------- A DECOUVIR AUSSI ---------- */
/* ----------  BANDEAU INFO PAIMENT ---------- */
.info_paiment{
	background: #dcbe84;
	padding: 3% 0 3% 0;
}

.info_paiment i{
	font-size:30px;
	color: #000000;
	padding: 0 0 5% 0;
}
/* ----------  PAGE CONTACT ---------- */
form{
	max-width: 70%;
	margin: auto;
}

::placeholder {
	color: #333;
	opacity: 70%;
}

input[type="text"]{
	width: 100%;
	border: none;
	border-bottom: solid 1px #000000;
	padding: 2%;
}

input[type="submit"] {
	background: #000000;
	padding: 18px 30px 18px 30px;
	text-transform: uppercase;
	color: white;
	text-align: center;
	border: solid 2px #333;	
	margin: auto;
	display: block;
}

		input[type="submit"]:hover{
			background: transparent;
			padding: 18px 30px 18px 30px;		
			color: #000000;
			border: solid 2px #333;
			transition: all 0.5s ease-out;
		} 

textarea{
	width: 100%;
	border: solid 1px #000000;
	padding: 2%;
	margin-top: 4%;
}



/* ----------  @media query ---------- */


@media (max-width: 992px){
	
	footer .center_left, footer .center_right{
		text-align: center;
	}

	footer .marge, footer h6{
		text-align: center;
	}

	.notre_maison, .notre_maison img, .fond_or{
		position: inherit;
	}
}

@media (max-width: 576px){
	.fond_or, .notre_maison img{
		position: inherit;
		max-width: 100%;
	}

	.bouton_noir{
		font-size: 13px;
	}

}
/* ---- FIN MEDIA QUERI ----- */