@charset "UTF-8";
/* CSS Document */

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
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;
	text-decoration: none;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	margin: 0;
}
ol, ul {
	list-style: none;
	margin: 0;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*** GLOBAL ***/
::-moz-selection {
  background-color: #23232C;
  color: #ffffff;
}
::selection {
  background-color: #23232C;
  color: #ffffff;
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.main{
	display: block;
	width: 100%;
	padding: 0;
	margin: 0 auto;
	max-width: 1200px;
}


/*** FONT ***/

html {
 font-size: 60%;
 font-size: calc(1em * .7);
}

body {
font-family: Poppins;
 font-size: 1.2em; /* 16px */
 font-weight: 200;
 color: #000;
 line-height: 1.6;
}
em {font-style: italic;}
strong {font-weight: 400;}
@media (min-width: 900px) {
   body {
       font-size: 1.4em; /* 16px */
   }
}
@media (min-width: 1000px) {
   body {
       font-size: 1.6em; /* 16px */
   }
}
@media (min-width: 1100px) {
   body {
       font-size: 1.8em; /* 16px */
   }
}


 /* MENU */
.header{
	display: flex;
	align-items: center;
	width: 100%;
	justify-content:space-between;
	padding: 0 2em;
	height: 100px;
}
.logo{
	position: relative;
	display: block;
	margin: 0;
	width: 100%;
	height: 100%;
	background-image: url("../img/logo-chateau-vergers-noir.svg");
	background-size: 250px;
	background-repeat: no-repeat;
	background-position: center;
	text-indent: -999em;
}
.menu__mobile{
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 1em;
	text-align: center;
}

.menu__mobile__item-gite{
	background-image: url("../img/airbnb.svg");
	background-repeat: no-repeat;
	background-position: 3.4em 0.2em;
	background-size: 1em;
	padding-right: 1.5em;
}
.menu__mobile__item-fb{
	background-image: url("../img/fb.svg");
	background-repeat: no-repeat;
	background-position: 2.8em 0.25em;
	background-size: 1.1em;
	padding-right: 1.5em;
}
.menu__mobile__item-map{
	background-image: url("../img/map.svg");
	background-repeat: no-repeat;
	background-position: 2.5em 0.15em;
	background-size: 0.9em;
	padding-right: 1.5em;
}
.menu__mobile__link{
	display: inline-block;
	font-weight: 200;
	font-size: 1.1em;
	text-transform: uppercase;
	background-color: #F7F7F7;
	color: #000;
	padding: 0.2em 0.2em;
	margin: 0.6em 0.4em;
}
.menu__mobile__link-active{
	border-bottom: 1px solid #000;
	background-color: #FFF;
}
.header__menu{
	display: none;
}
.contact__link{color: #000;}
.contact__link:hover{background-color: #A1A1A1;}

/* CONTENU */
.contenu{ display: block; width: 100%; max-width: 1200px; padding: 0.7em; margin: 0 auto;}

h1{font-size: 1.8em; margin: 1em 0 0.1em 0;}
h2{font-size: 1.4em; font-weight: 400;}
p{font-size: 1em; margin-bottom: 0.2em;}
.img{width: 100%;}

.center{text-align: center;}
.mgb{margin-bottom: 2em;}
.separation{display: block;height: 1em; margin: 2em 0; background-color: #F7F7F7}

.logo__hve{width: 20%; margin: 1em 0 4em 1em ;}

.blk__home{background-image: url("../img/chateau-les-vergers-home_800.jpg"); background-repeat: no-repeat; background-position: bottom right; background-size: 100%; padding-bottom: 7em;}
@media (min-width:500px)
	{.blk__home{padding-bottom: 13em;}}

.blk__bdc{text-align: center;}
.bdc{padding: 0.2em 0.8em; text-transform: uppercase; font-size: 1em; font-weight: 500; color: #000; border:1px solid #CCCCCC; border-radius: 0.5em; margin: 0 auto;}


.blk__flex-vin{display: block; text-align: center; }
.img__btl{width: 100%;}
.blk__btl{width:40%; margin: 0 auto;}
.blk__txt-vin{display: block; width: 80%; margin: 0 auto; }

/* FOOTER */
.footer__background{display: block; width: 100%; margin-top: 2em; background-color: #F5F5F5; padding: 0.5em; text-align: center;}
.footer__gauche{display: none;}
.footer__mobile{display: block; font-size: 0.8em; color: #000;}
.footer__mentions{display: block; font-size: 0.8em; color: #000; margin-top: 2em;}
.footer__abus{font-size: 0.6em; text-transform: uppercase; color: #3F3F3F;}


/* GRAND ECRAN ----------------------------*/

@media (min-width:700px)
	{
	/* MENU */
	.header{
	height: 200px;}
	.logo{
	width: 33%;
	display: block;
	background-size: 100%;}
	.menu__mobile{display: none;}
	
	.header__menu{
		display: flex;
		}
	.header__menu__item{
		display: block;
		padding: 0 .5em;	
		font-weight: 200;
		font-size: 1em;
		text-transform: uppercase;}
	.header__menu__link{
		color: #000;}
	.header__menu__link:hover{
		background-color: #F5F5F5;}
	.header__menu__link-active{
		border-bottom: 1px solid #000;	
		}
	.header__menu__link-gite{
		background-image: url("../img/airbnb.svg");
		background-repeat: no-repeat;
		background-position: 4.1em;
		background-size: 1em;
		padding-right: 1.5em;
		margin-right: 0.5em;}
	.header__menu__link-fb{
		background-image: url("../img/fb.svg");
		background-repeat: no-repeat;
		background-position: 3.5em 0.2em;
		background-size: 1.1em;
		padding-right: 1.7em;
		margin-right: 0.5em;}
	.header__menu__link-map{
		background-image: url("../img/map.svg");
		background-repeat: no-repeat;
		background-position: 3.2em 0.1em;
		background-size: 0.9em;
		padding-right: 1.7em;
		margin-right: 0.5em;}
		
	/* CONTENU */
	.mgb{margin-bottom: 5em;}
	.blk__flex{display: flex; width: 100%; padding: 0 1em;}
	.blk__flex-droite{justify-content: flex-end;}
	
	.blk__1-3{display: block; width: 33%;padding: 1em;}
	.blk__1-2{display: block; width: 50%;}
	.blk__2-3{display: block; width: 66%;}
	.blk__3-3{display: block; width: 100%; padding: 1em;}

	.blk__home{background-size: 66%; background-position: top right; padding-bottom: 0em;}

	.logo__hve{width: 30%; margin: 2em 0 0em 1em ;}
	
	.bdc:hover{background-color: #F5F5F5;}
	.blk__bdc{text-align: right; margin-right: 8em; margin-top: -2em;}
	
	.blk__txt-vin{display: block; width: 30%; margin: 0 2em;}
	.blk__txt-vin2{width: 60%;}
	.blk__flex-vin{display: flex; text-align: left; justify-content:flex-start;}
	.blk__btl{width:30%; margin: 0 ;}
		
		
	/* FOOTER */
		.footer__mobile{display: none;}
	.footer{ display: flex; justify-content:space-between; align-items: center;  text-align: left; padding: 2em 1em 2em 1em; max-width: 1200px; margin: 0 auto;}
	.footer__gauche{display: block; font-size: 0.8em;}
	.footer__droite{text-align: right;}
	.footer__mentions{margin-top:0em;}
	.footer__abus{font-size: 0.5em; text-transform: uppercase; color: #3F3F3F;}
			}