html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	background-color: #000;
	font-family: 'Open Sans', sans-serif;
	font-style: normal;
	font-weight: 400;
	color:#fff;
	font-size: 17px;
	line-height: 1.4em;
	-webkit-font-smoothing: antialiased;
	
}


ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a img{
	outline: none;
}
body,html{
	height: 100%;
}
a{
	text-decoration: none;
	color:#fff;
	cursor: pointer;
}
/*
===========================
COMMON
===========================
*/
.relative{
	position: relative;
}
.absolute{
	position: absolute;
}
.fixed{
	position: fixed;
}
.full{
	width: 100%;
}
.half{
	width: 50%;
}
.two_third{
	width: 66%;
	margin: auto;
}
.container{
	width: 1024px;
	margin: auto;
}
.retour{
	clear:both;
}
.bold{
	font-weight: 600;
}
/*
===========================
FIN-COMMON
===========================
*/
/*
===========================
PREHOME
===========================
*/

.container_prehome{
	padding-top: 355px;
}
.prehome img{
	left:50%;
	margin-left: -162px;
	top:50px;
	width: 325px;
}
.content_prehome{
	width: 508px;
	float:left;
	border: 1px solid transparent;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
	
}
.content_prehome:hover{
	border: 1px solid #cca264;
}

.content_prehome_fr{
	margin-right: 4px;
	text-align: right;
}
.content_prehome_en{
	text-align: left;
}
.prehome p{
	padding: 25px 50px 100px 50px;
	font-size: 0.8em;
	
}
.prehome h2{
	padding: 50px 50px 25px 50px;
	font-family: 'Oswald', sans-serif;
	font-size: 1.2em;
	display: inline-block;
}
.link_prehome{
	display: block;
	width: 100%;
	height: 100%;
}
.advert_footer_2{
	padding: 25px 0;
}
.advert_footer_2 p{
	display: table;
	margin: auto;
	color:#343434;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	font-size: 0.7em;
	letter-spacing: 2px;
}

.content_prehome_povisoire{
	width: 508px;
	margin: auto;
	border: 1px solid transparent;
	transition:all 0.3s ease-in-out;
}

.content_prehome_povisoire:hover{
	border: 1px solid #cca264;
}

/* =========================== HEADER =========================== */

.logo{
	left:50%;
	margin-left: -125px;
	top:50px;
	width: 249px;
	z-index: 9999;
}

ul.princ{
	display: block;
	border-top:2px solid #513f24;
}

.sub-menu { 
	visibility: hidden;
	opacity: 0;
	top: 100%;
	width: 100%;
	left: 0;
	transition: all 0.5s ease 0s, visibility 0s linear 0.5s; 
	position: absolute;
	background-color: #000000; 
}

.sub-menu-parent:hover{
	background: rgba(0, 0, 0, 0.5);
}

.sub-menu-parent:hover .sub-menu {
	visibility: visible;
	opacity: 1;
	left: 0;
	transition-delay: 0s;
}

.active{
	color: #cca264;
}

nav{
	display: table;
	margin: auto;
	padding-top: 220px;
	width: 970px;
	position: relative;
	z-index: 9998;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;

}
#lign_nav{
	height: 2px;
	z-index: 999;
	top:220px;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;

}
.no_width{
	width: 0;
}

.with_width{
	width: calc(100% / 7);
}

.pos_1{
	left: 0;
	background: #daaf6d;
}
.pos_2{
	left: calc(100% - (100% / 7 * 6));
	background: #daaf6d;
}
.pos_3{
	left: calc(100% - (100% / 7 * 5));
	background: #daaf6d;
}
.pos_4{
	left: calc(100% - (100% / 7 * 4));
	background: #daaf6d;
}
.pos_5{
	left: calc(100% - (100% / 7 * 3));
	background: #daaf6d;
}

.pos_6{
	left: calc(100% - (100% / 7 * 2));
	background: #daaf6d;
}

.pos_7{
	left: calc(100% - (100% / 7));
	background: #daaf6d;
}

.sub_pos_7::after {
	content: '';
	display: block;
	position: absolute;
	right: 12%;
	top: 20px;
	width: 15px;
	height: 30%;
	background: url(img/dl-presse.svg) no-repeat;
	background-size: contain;
	background-position: center center;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}

.sub_pos_7:hover::after {
	width: 18px;
}

nav a { 
	display: block;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.sub-menu-parent{
	width: calc(100% / 7);
	padding: 20px 0;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.first_letter{
	font-size: 1.25em;
}
.sub-menu-parent > a{
	font-size: 1em;
	font-weight: 600;
	padding-bottom: 20px;
	text-align: center;
}
.sub-menu a{
	font-size: 0.8em;
	text-align: center;
	padding: 5px 0;
	text-transform: uppercase;
}

.sub-menu h3 {
	width: 100%;
	text-align: center;
	margin-top: 15px;
	margin-bottom: 5px;
	color: #cca264;
}

nav ul li ul li a:hover {
	color: #cca264;
}

nav ul, nav ul li {
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-o-transform: translateZ(0);
	-ms-transform: translateZ(0);
	
	list-style-type: none;
	padding: 0;
	margin: 0;
}

nav > ul > li {
	float: left;
}

a.fb_head,
a.insta_head{
	width: 25px;
	height: 25px;
	top: 30px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

a.fb_head{
	background-image: url(img/fb_head.png);
	right: 65px;
}

a.insta_head{
	background-image: url(img/instagram_blanc.png);
	right: 30px;
}

a.adherent {
	color: #FFF;
	position: absolute;
	right: 70px;
	font-size: 0.6em;
	top: 30px;
	text-transform: uppercase;
	z-index: 9999;
}

a.test:hover {
	color: #cca264;
}

.trigger{
	width: 33px;
	height: 30px;
	cursor: pointer;
	display: none;
	top: 25px;
	right:25px;
	z-index: 9999;
}
.burger_1{
	display: block;
	width: 100%;
	height: 5px;
	background: #e0b47f;
	top:0;
	
	transform: rotate(-180deg);
	-webkit-transform: rotate(-180deg);
	-moz-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-ms-transform: rotate(-180deg);
	
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.burger_2{
	display: block;
	width: 100%;
	height: 5px;
	background: #e0b47f;
	top:10px;
}
.burger_3{
	display: block;
	width: 100%;
	height: 5px;
	background: #e0b47f;
	top:20px;
	
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.rotate_1{
	top:10px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
}
.rotate_3{
	top:10px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
}

#langue{
	color: #FFF;
	position: absolute;
	right: 100px;
	top: 30px;
	text-transform: uppercase;
	z-index: 9999;
	display: flex;
	gap: 16px;
}

/*
===========================
FIN-HEADER
===========================
*/
/*
===========================
INDEX
===========================
*/
.container_presentation{
	text-align: justify;
	z-index: 20;
}
.container_racines{
	padding: 390px 0 100px 0;
}
.container_presentation h3{
	color:#cca264;
	font-weight: 400;
	font-size: 1.2em;
	line-height: 1.4em;
	padding: 0 0 65px 0;
}
#anchor_scroll_racines{
	height: 740px;
	width: 10px;
	bottom:0;
	left: 0;
	z-index: 3;
}
.bold{
	font-weight: 700;
}

.valeurs{
	background: #fff;
	padding-bottom: 765px;
	z-index: 2;
}
.container_valeurs{
	padding: 100px 0 0 0;
}
.valeurs p{
	color:#000;
}
.img_bottom{
	height: 740px;
	width: 100%;
	background: url(img/img_bottom.jpg)top center no-repeat;
	bottom:0;
	left: 0;
	background-size: cover;
	z-index: 2;
}
#anchor_img_top{
	width: 10px;
	height: 100%;
	top:0;
	left: 0;
	z-index: 999;
}

.container_qualite{
/* 	top:-150px; */
	top:-45px;
}
#anchor_racines{
	width: 10px;
	height: 10px;
	top: 270px;
	left: 0;
	z-index: 10;
}
#anchor_qualite{
	width: 10px;
	height: 10px;
	top: -120px;
	left: 0;
	z-index: 10;
}
.deg{
	width: 100%;
	height: 180px;
	top:-180px;
	left: 0;
	background: url(img/deg.png)top left repeat-x;
	z-index: 10;
}
.img_top{
	height: 589px;
	background: url(img/img_top.jpg)top center no-repeat;
	top:-196px;
	left:0;
}
.gradient{
	height: 91px;
	background: url(img/gradient.png)top left repeat-x;
	bottom: 0;	
}

.gradient_reverse{
	height: 91px;
	background: url(img/gradient_reverse.png)top left repeat-x;
	top: 0;	
}

.gradient_reverse_racine{
	height: 91px;
	background: url(img/gradient_reverse.png)top left repeat-x;
	bottom:-91px;
	left: 0;
	z-index: 99;
}

.list{
	padding-bottom: 20px;
}

.list:before{
	content:"- ";
	position: absolute;
	display: block;
	left:-10px;
}

/* =========================== GAMME =========================== */
.container_list_btlle{
	padding-bottom: 150px;
}

.list_btlle{
	width: calc(100% / 3);
	height: 640px;
	display: block;
	float:left;	
	transition:all 0.3s ease-in-out;
	background-size: auto 510px;
	background-repeat: no-repeat;
	background-position: center 35px
}

.list_btlle_nature{
	background-image: url(img/packshot/full_brut_nature.png);
}

.list_btlle_selection{
	background-image: url(img/list_btlle_selection.jpg);
}

.list_btlle_rose{
	background-image: url(img/list_btlle_rose.jpg);
}

.list_btlle_premier-cru{
	background-image: url(img/packshot/full_millesime-2018.png);
}

.list_btlle_chapitre-1{
	background-image: url(img/packshot/full_chapitre-1.png);
}

.list_btlle_chapitre-2{
	background-image: url(img/packshot/full_chapitre-2.png);
}

.list_btlle_chapitre-3{
	background-image: url(img/packshot/full_chapitre-3.png);
}

.list_btlle_ratafia{
	background-image: url(img/list_btlle_ratafia.jpg);
}

.list_name{
	color:#cca264;
	line-height: 1.4em;
	text-align: center;
	left: 50%;
	width: 100%;
	margin-left: -50%;
	pointer-events: none;
	text-transform: uppercase;
	transition:all 0.3s ease-in-out;
}

.list_name h3{
	font-weight: 300;
	font-size: 0.9em;
	letter-spacing: -1px;
}
.list_name_pos_top{
	bottom:50%;
}
.list_name_pos_bottom{
	bottom:30px;
}
.lign{
	background: #cca264;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
	pointer-events: none;
}
.lign_top{
	top:0;
	left: 0;
	height: 2px;
}
.lign_bottom{
	bottom:0;
	right: 0;
	height: 2px;
	
}
.lign_left{
	bottom:0;
	left: 0;
	width: 2px;
}
.lign_right{
	top:0;
	right: 0;
	width: 2px;
}
.no_width_2{
	width: 0;
}
.with_width_2{
	width: 100%;
}
.no_height{
	height: 0;
}
.with_height{
	height: 100%;
}

.bg_list_btlle{
	width: 100%;
	height: 100%;
	top:0;
	display: block;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.bg_list_btlle_selection{
	background: url(img/bg_list_btlle_selection.jpg)center center no-repeat #000;
	background-size: 100% auto;
}
.bg_list_btlle_rose{
	background: url(img/bg_list_btlle_rose.jpg)center center no-repeat #000;
	background-size: 100% auto;
}

.bg_list_btlle_chapitre{
	background: url(img/bg_list_btlle_chapitre.jpg)center center no-repeat #000;
	background-size: 100% auto;
}

.bg_list_btlle_coteaux{
	background: url(img/bg_list_btlle_coteaux.jpg)center center no-repeat #000;
	background-size: 100% auto;
}

.bg_list_btlle_premier-cru{
	background: url(img/bg_list_btlle_premier-cru.jpg)center center no-repeat #000;
	background-size: 100% auto;
}

.visible{
	opacity: 1;
}

.invisible{
	opacity: 0;
}

/* =========================== BTLLE =========================== */

.full_main_btlle{
	padding: 20px 0 150px 0;
}

.full_main_btlle_selection{
	border-bottom: 2px solid #cca264;
}

.full_main_btlle_rose{
	border-bottom: 2px solid #cca264;
}

.full_main_btlle_premier-cru{
	border-bottom: 2px solid #cca264;
}

.container_btlle{
	z-index: 10;
}

.content_btlle{
	width: 410px;
	height: 680px;
	object-fit: contain;
	float: left;
	z-index: 10;
	position: relative;
}

.bande{
	bottom:0;
	left:0;
	width: 100%;
	height: 93px;
}

.bande_selection{
	background: url(img/bande_selection.jpg)top left repeat-x;
}

.bande_premier-cru{
	background: url(img/bande_blanc-or.jpg)top left repeat-x;
}

.bande_rose{
	background: url(img/bande_rose.jpg)top left repeat-x;
}

.content_infos_btlle{
	float: left;
	width: 614px;
	padding-top: 30px;
	z-index: 10;
}

.full_main_btlle_rose .content_infos_btlle h2{
	color:#cca264;
}

.full_main_btlle_selection .content_infos_btlle h2{
	color:#cca264;
}

.full_main_btlle_chapitre .content_infos_btlle h2{
	color:#ff6717;
}

.full_main_btlle_coteaux .content_infos_btlle h2{
	color:#fcb222;
	font-weight: 400;
}

.full_main_btlle_premier-cru .content_infos_btlle h2{
	color:#cca264;
}


.content_infos_btlle h2{
	font-family: 'Oswald', sans-serif;
	font-weight: 300;
  	font-size: 2em;
  	line-height: 1.4em;
  	padding-bottom:10px;
  	text-transform: uppercase;
}
.name_btlle{
	font-weight: 400;
  	color:#cca264;
}
.name_btlle_chapitre{
	font-weight: 400;
  	color:#fcb222;
}
.desc{
	padding: 0 0 20px 0;
}
.desc p {
	text-align: justify;
}
.desc h3{
	font-family: 'Oswald', sans-serif;
    font-weight: 400;
    padding-bottom: 20px;
    font-size: 1.4em;
}
.accord{
	border:1px solid #cca264;
	padding: 25px;
}
.accord .bold_oswald{
	padding-bottom: 10px;
	display: inline-block;
}
.accord p{
	text-align: justify;
}
.links{
	padding-top: 85px;
	font-family: 'Oswald', sans-serif;
	font-weight: 300;
}
.links ul li{
	float: left;
	padding: 0 25px 0 0;
}
.links ul li a{
	line-height: 20px;
	padding: 0 0 0 25px;
	height: 20px;
	display: block;
	transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.links_1 a{
	background: url(img/links_1.png)bottom left no-repeat;
}
.links_2 a{
	background: url(img/links_2.png)bottom left no-repeat;
}
.links_3 a{
	background: url(img/links_3.png)bottom left no-repeat;
}
.links_1 a:hover{
	background: url(img/links_1.png)top left no-repeat;
	color:#cca264;
}
.links_2 a:hover{
	background: url(img/links_2.png)top left no-repeat;
	color:#cca264;
}
.links_3 a:hover{
	background: url(img/links_3.png)top left no-repeat;
	color:#cca264;
}
.bold_oswald{
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
}



#pat_vid{
	position: absolute;
	width: 1483px;
	height: 1246px;
	top:100px;
	left: 100px;
	fill: #201d1a !important;
  	stroke: #201d1a;
}
.pat_gif{
	position: absolute;
	width: 989px;
	height: 831px;
	top:-100px;
	left: -300px;
	background: url(img/pat.gif)center center no-repeat;
	background-size: 100% auto;
}
#pat_2_vid{
	position: absolute;
	width: 1483px;
	height: 1246px;
	top:100px;
	left: 100px;
	fill: #302529 !important;
  	stroke: #302529;
	
}
.pat_2_gif{
	position: absolute;
	width: 989px;
	height: 831px;
	top:-100px;
	left: -300px;
	background: url(img/pat_2.gif)center center no-repeat;
	background-size: 100% auto;
}







#pat{
	position: absolute;
	width: 989px;
	height: 831px;
	top:-100px;
	left: -300px;
	fill: #201d1a !important;
  	stroke: #201d1a;
	
}
#pat_2{
	position: absolute;
	width: 989px;
	height: 831px;
	top:-100px;
	left: -300px;
	fill: #302529 !important;
  	stroke: #302529;
	
}
svg path, svg polygon {
  fill-opacity: 0;
  stroke-width: 5;
  stroke-dasharray: 3319;
  stroke-dashoffset: 3319;
  animation-name: draw;
  animation-duration: 3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-timing-function: linear;
}

@keyframes draw {
  90% {
    stroke-dashoffset: 0;
    stroke-width: 5;
    fill-opacity: 0;
  }
  100% {
    stroke-width: 0;
    fill-opacity: 1;
  }
}
@-webkit-keyframes draw {
  90% {
    stroke-dashoffset: 0;
    stroke-width: 5;
    fill-opacity: 0;
  }
  100% {
    stroke-width: 0;
    fill-opacity: 1;
  }
}
@-moz-keyframes draw {
  90% {
    stroke-dashoffset: 0;
    stroke-width: 5;
    fill-opacity: 0;
  }
  100% {
    stroke-width: 0;
    fill-opacity: 1;
  }
}
@-ms-keyframes draw {
  90% {
    stroke-dashoffset: 0;
    stroke-width: 5;
    fill-opacity: 0;
  }
  100% {
    stroke-width: 0;
    fill-opacity: 1;
  }
}
@-o-keyframes draw {
  90% {
    stroke-dashoffset: 0;
    stroke-width: 5;
    fill-opacity: 0;
  }
  100% {
    stroke-width: 0;
    fill-opacity: 1;
  }
}


.chap_lign{
	background: #382a28;
	
}
.chap_lign_1{
	top:100px;
	height: 5px;
	animation-name: draw_chap_lign;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
  	animation-timing-function: linear;
  	
  	transform: rotate(-2deg);
  	-webkit-transform: rotate(-2deg);
  	-moz-transform: rotate(-2deg);
  	-o-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	
	transform-origin: 10%;
	-webkit-transform-origin: 10%;
	-moz-transform-origin: 10%;
	-o-transform-origin: 10%;
	-ms-transform-origin: 10%;
}
.chap_lign_2{
	top:120px;
	height: 5px;
	animation-name: draw_chap_lign;
	animation-duration: 0.8s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	animation-delay: 1s;
  	animation-timing-function: linear;
  	
  	transform: rotate(-1.5deg);
  	-webkit-transform: rotate(-1.5deg);
  	-moz-transform: rotate(-1.5deg);
  	-o-transform: rotate(-1.5deg);
	-ms-transform: rotate(-1.5deg);
	
	transform-origin: 5%;
	-webkit-transform-origin: 5%;
	-moz-transform-origin: 5%;
	-o-transform-origin: 5%;
	-ms-transform-origin: 5%;
}
.chap_lign_3{
	top:130px;
	height: 8px;
	animation-name: draw_chap_lign;
	animation-duration: 0.6s;
	animation-iteration-count: 1;
	animation-delay: 1.3s;
	animation-fill-mode: forwards;
  	animation-timing-function: linear;
  	
  	transform: rotate(0.3deg);
  	-webkit-transform: rotate(0.3deg);
  	-moz-transform: rotate(0.3deg);
  	-o-transform: rotate(0.3deg);
	-ms-transform: rotate(0.3deg);
	
	transform-origin: 5%;
	-webkit-transform-origin: 5%;
	-moz-transform-origin: 5%;
	-o-transform-origin: 5%;
	-ms-transform-origin: 5%;
}
.chap_lign_4{
	top:170px;
	height: 8px;
	animation-name: draw_chap_lign;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-delay: 2s;
	animation-fill-mode: forwards;
  	animation-timing-function: linear;
  	
  	transform: rotate(-1deg);
  	-webkit-transform: rotate(-1deg);
  	-moz-transform: rotate(-1deg);
  	-o-transform: rotate(-1deg);
	-ms-transform: rotate(-1deg);
	
	transform-origin: 10%;
	-webkit-transform-origin: 10%;
	-moz-transform-origin: 10%;
	-o-transform-origin: 10%;
	-ms-transform-origin: 10%;
}
.chap_lign_5{
	bottom:-10px;
	height: 8px;
	animation-name: draw_chap_lign;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-delay: 1.2s;
	animation-fill-mode: forwards;
  	animation-timing-function: linear;
  	
  	transform: rotate(-1deg);
  	-webkit-transform: rotate(-1deg);
  	-moz-transform: rotate(-1deg);
  	-o-transform: rotate(-1deg);
	-ms-transform: rotate(-1deg);
	
	transform-origin: 10%;
	-webkit-transform-origin: 10%;
	-moz-transform-origin: 10%;
	-o-transform-origin: 10%;
	-ms-transform-origin: 10%;
}
.chap_lign_6{
	bottom:10px;
	height: 12px;
	animation-name: draw_chap_lign;
	animation-duration: 0.4s;
	animation-iteration-count: 1;
	animation-delay: 1s;
	animation-fill-mode: forwards;
  	animation-timing-function: linear;
  	
  	transform: rotate(-2deg);
  	-webkit-transform: rotate(-2deg);
  	-moz-transform: rotate(-2deg);
  	-o-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	
	transform-origin: 10%;
	-webkit-transform-origin: 10%;
	-moz-transform-origin: 10%;
	-o-transform-origin: 10%;
	-ms-transform-origin: 10%;
}

@keyframes draw_chap_lign {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
.comp{
	padding-bottom: 24px
}
.comp p{
	font-size: 1.2em;
}

.comp p{
	color:#cca264;
}

/*
===========================
RÉCOMPENSES
===========================
*/

.recompenses .container {
  padding-bottom: 70px;
}

.recompenses .container img {
  width: 100%;
}

/*
===========================
ACTU
===========================
*/
.container_actualites {
	padding-bottom: 70px;
}

.container_actualites p {
	text-align: center;
	padding-bottom: 40px;
}

.fb_actu{
	display: block;
	width: 192px;
	height: 65px;
	background: url(img/facebook.png)bottom left no-repeat;
	margin: auto;
	cursor: pointer;
}

.fb_actu:hover{
	background: url(img/facebook.png)top left no-repeat;
}

#container_actu_salon {
  text-align: center;
  margin-bottom: 100px;
}

#container_actu_salon img{
	max-width: 1000px;
	width: 100%;
}

/*
===========================
CONTACT
===========================
*/
.contact{
	padding-bottom: 75px;
	background: #ececec;
}
.gradient_grey{
	height: 91px;
	background: url(img/gradient_grey.png)top left repeat-x;
	top:-91px;
	left: 0;
}
#anchor_scroll_contact{
	height: 740px;
	width: 10px;
	bottom:0;
	left: 0;
	z-index: 3;
}

.half_form{
	float: left;
	background: url(img/img_contact.jpg)top center no-repeat;
	min-height: 386px;
}

.half_coordonnee{
	float: left;
	padding-top: 75px;
	color:#000;
}

.half_coordonnee p{
	line-height: 1.6em;
}

.half_coordonnee img{
	width: 150px;
	display: block;
	margin: auto;
}

.half_coordonnee h1{
	text-align: center;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	padding: 45px 0 15px 0;
}

.half_coordonnee p{
	display: table;
	margin: auto;
	padding-top: 30px;
}

.half_coordonnee a{
	color:#cca264;
}
/*
===========================
MAP
===========================
*/
.map{
	z-index: 50;
}
#google-container {
  position: relative;
  width: 100%;
  height: 400px;
  background-color: #e7eaf0;
}
#cd-google-map {
  position: relative;
}
#cd-google-map address {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  padding: 1em 1em;
  background-color: rgba(211, 104, 104, 0.9);
  color: white;
  font-size: 13px;
  font-size: 0.8125rem;
}
@media only screen and (min-width: 768px) {
  #cd-google-map address {
    font-size: 15px;
    font-size: 0.9375rem;
    text-align: center;
  }
}

#cd-zoom-in, #cd-zoom-out {
  height: 32px;
  width: 32px;
  cursor: pointer;
  margin-left: 10px;
  background-color: #2f2d2f;
  background-repeat: no-repeat;
  background-size: 32px 64px;
  background-image: url("img/cd-icon-controller.svg");
}
.no-touch #cd-zoom-in:hover, .no-touch #cd-zoom-out:hover {
  background-color: #d36868;
}
@media only screen and (min-width: 768px) {
  #cd-zoom-in, #cd-zoom-out {
    margin-left: 50px;
  }
}

#cd-zoom-in {
  background-position: 50% 0;
  margin-top: 10px;
  margin-bottom: 1px;
}
@media only screen and (min-width: 768px) {
  #cd-zoom-in {
    margin-top: 50px;
  }
}

#cd-zoom-out {
  background-position: 50% -32px;
}

.content_map h1.firstHeading{
	color:#2f2d2f;
}

/*
===========================
FIN-MAP
===========================
*/
/*
===========================
FIN-CONTACT
===========================
*/
/*
===========================
FOOTER
===========================
*/
footer{
	background:#1b1b1b;
	padding-top: 50px;
	z-index: 50;
}
.content_footer{
	width: 80%;
	margin: auto;
}
footer img{
	width: 97px;
}
.infos_footer{
	padding: 20px 0 40px 0;
	border-bottom: 1px solid #525252;
}

.infos_footer p{
	font-size: 0.8em;
}

.infos_footer ul li{
	float: left;
	color:#525252;
	padding: 0 25px;
	line-height: 23px;
}
.infos_footer ul li.infos_footer_1{
	background: url(img/infos_footer_1.png)top left no-repeat;
}
.infos_footer ul li.infos_footer_2{
	background: url(img/infos_footer_2.png)top left no-repeat;
}
.infos_footer ul li.infos_footer_3{
	background: url(img/infos_footer_3.png)top left no-repeat;
}
.infos_footer ul li a{
	color:#525252;
}
.fb_footer{
	top:0;
	right:0;
	width: 13px;
	height: 23px;
	background: url(img/fb_footer.png)top left no-repeat;
}

.insta_footer{
	top:0;
	right:30px;
	width: 23px;
	height: 23px;
	background: url(img/instagram.png)top left no-repeat;
	background-size: cover;
	background-position: center;
}

.mention{
	padding: 20px 0;
	color:#3d3c3d;
	font-size: 0.8em;
	background: url(img/cochet.png)center left no-repeat;
	padding-left: 34px;
}
.mention a{
	color:#3d3c3d;
}
.advert_footer{
	background: #121212;
	padding: 50px 0;
}
.advert_footer p{
	display: table;
	margin: auto;
	color:#343434;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	font-size: 0.7em;
	letter-spacing: 2px;
}
/*
===========================
FIN-FOOTER
===========================
*/
/*
===========================
MENTIONS
===========================
*/
.container_mentions{
	padding: 80px 0;
}
.container_mentions a{
	color: #cca264;
}
.container_mentions h2{
	color: #cca264;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    font-size: 1.5em;
    line-height: 1.4em;
    padding: 0 0 20px 60px;
}
.container_mentions h2:before{
	content:"";
	display: block;
	height: 1px;
	position: absolute;
	width: 40px;
	top:20px;
	left: 0;
	background: #cca264;
}
.container_mentions h3{
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    font-size: 1em;
    line-height: 1.4em;
    padding: 20px 0 6px 0;
}
.container_mentions.cgv p {
	margin-bottom: 5px;
	font-size: 0.9em;
}

.container_mentions.cgv h2 > span {
	display: block;
}
/*
===========================
FIN-MENTIONS
===========================
*/

.fb-page.fb_iframe_widget{
	display: flex;
	justify-content: center;
	margin-bottom: 30px;
}

/*
===========================
RESPONSIVE
===========================
*/
@media screen and (max-width: 1290px) {
	.infos_footer ul li p{
		font-size: 0.8em;
	}
}
@media screen and (max-width: 1200px) {
	.list_btlle {
	    height: 416px;
	    background-size: auto 85%;
	}
}
@media screen and (max-width: 1070px) {
	.infos_footer ul li{
		float: none;
	}
}
@media screen and (max-width: 1024px) {
	.container{
		width: 100%;
	}
	.list_btlle{
		width: 33.3%;
		border: none;
	}
	.list_btlle:hover{
		border: none;
	}
	.list_btlle_selection, .list_btlle_rose, .list_btlle_premier-cru{
		margin-right: 0px;
	}
	.content_btlle{
		width: 100%;	
	}
	.content_infos_btlle{
		width: 80%;
		margin: auto;
		float: none;
	}
	.content_prehome{
		width: 80%;
		float: none;
		margin: auto;
	}
	.list_btlle_chapitre {
    	background: url(img/list_btlle_chapitre.jpg)bottom center no-repeat;
    	background-size: auto 75%;
	}
	.list_btlle_selection {
    	background: url(img/list_btlle_selection.jpg)bottom center no-repeat;
    	background-size:auto 75% ;
	}
	.list_btlle_premier-cru {
    	background: url(img/list_btlle_premier-cru.jpg)bottom center no-repeat;
    	background-size:auto 75% ;
	}
	
	.list_btlle_rose {
    	background: url(img/list_btlle_rose.jpg)bottom center no-repeat;
    	background-size:auto 75% ;
	}
	.list_btlle {
    	height: 416px;
    	padding-bottom: 0;
    	background-position: center center;
	}
	.content_prehome_fr{
		margin-right: none;
		text-align: left;
	}
	.prehome img{
		margin-left: -125px;
		width: 249px;
	}
	.container_prehome {
    	padding-top: 210px;
	}
	
	.list_btlle {
		background-position: center top 10%;
	}
	
}


	
@media screen and (max-width: 1000px) {
	.trigger{
		display: block;
	}
	.sub-menu-parent{
		text-align: center;
		float: none;
		display: none;
	}
	.sub-menu{
		position: relative;
		visibility: visible;
		opacity: 1;
	}
	
	.sub-menu li {
		display: block;
	}
	
	nav ul li ul li a:hover {
		padding-left:0px; 
	}
	
	.sub-menu-parent:hover .sub-menu {
		left: 0px;
	}
	
	nav{
		height: 0;
	}
	
	.sub-menu-parent > a{
		padding: 15px 0 0 0;
	}
	
	.fb_head{
		left: 30px;
	}
	
	.insta_head{
		left: 65px;
	}
	
	.img_top{
		top:-23px;
	}
	
	ul.princ{
		border: none;
	}
	
	.sub-menu-parent{
		width: 100%;
	}
	
	#lign_nav{
		display: none;
	}
	
	nav{
		width: 100%;
	}
	
	.container_racines{
		padding: 490px 0 100px 0;
	}
	
	.two_third{
		width: 90%;
	}
	
	#langue{
		right: 80px;
	}
	
	a.adherent {
		right: inherit;
		left: 70px;
	}
	
	.sub_pos_5::after{
		display: none;
	}
}

@media screen and (max-width: 950px) {
	.sub-menu-parent > a {
	    font-size: 1.2em;
	    padding: 15px 0;
	}
	
	.sub-menu a {
	    font-size: 0.8em;
	}
}

@media screen and (max-width: 750px) {	
	.content_btlle{
	   height: 450px;
	}
	
	header {
	    padding-bottom: 0;
	}
	
	nav ul.princ{
		padding-bottom: 50px;
	}
	
	.sub-menu-parent{
		margin-right: 0;
	}
}

@media screen and (max-width: 700px) {
	.half{
		width: 100%;
	}
	
	.img_contact{
		display: none;
	}
	
	.contact {
    	padding-bottom: 50px;
	}
	
	#google-container {
	    height: 200px;
	}
	
	.content_prehome{
		width: 90%;
	}
	
	#pat, 
	#pat_2{
		width: 80%;
		left: 10%;
	}
	
	.pat_gif, 
	.pat_2_gif{
		width: 80%;
		left: 10%;
	}
	
	.advert_footer p, 
	.advert_footer_2 p{
		text-align: center;
	}
	
	.list_btlle {
		width: 50%;
	}	
}

@media screen and (max-width: 620px) {
	.links ul li{
		float: none;
	}
	.links ul li a {
		margin-bottom: 20px;
	}
	.full_btlle_chapitre {
    	width: 150px;
    	height: 273px;
    	background-size: auto 100%;
	}
	.full_main_btlle{
		padding: 0 0 150px 0;
	}
	body {
		font-size: 16px;
	}
	.logo {
		top: 75px;
	}
	
	
	
}
@media screen and (max-width: 500px) {
	.container_presentation h3{
		    padding: 0 30px 65px 30px;
	}
	.container_presentation h3:before {
    	display: none;
	}
	.container_presentation p {
   		padding: 0 30px;
	}
	
	
	
}
/*
===========================
FIN-RESPONSIVE
===========================
*/

/* HOOK SKYPE */
span[class^='skype_pnh_container'] {display:none !important;}
span[class^='skype_pnh_print_container'] {display:inline !important;}





























