/* --- STYLE DES ELEMENTS DE BASE --- */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    height: 100%;
    width: 100%;
    overflow-x: hidden;
}

body {
    font-family: 'Lora', serif;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    position: relative;
    min-height: 100%;
    width: 100%;
    overflow-x: hidden;
}

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

.header {
	text-align: center;
	padding: 14px 10px; 27px;
	background: #fff;
}

.bordure {
	height: 14px;
	background: #c6bdac;
}


.main {
	position: relative;
}

.contenu {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url(../images/boutique.jpg) no-repeat center;
	background-size: cover;
}
.encart-titre {
	position: absolute;
	top: 20%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}
.titre {
	font-size: 60px;
	color: #fff;
	text-shadow: rgba(0, 0, 0, 0.2) 1px 1px, rgba(0, 0, 0, 0.2) -1px 1px, rgba(0, 0, 0, 0.2) -1px -1px, rgba(0, 0, 0, 0.2) 1px -1px;
	padding: 0 10px;
	text-align: center;
}

img {
	max-width: 100%;
	height: auto;
}

.footer {
	text-align: center;
	color: #b0957f;
	padding: 30px 10px;
	background: #fff;
}

.coordonnees {
	font-size: 36px;
}

.avertissement {
	font-size: 16px;
	text-transform: uppercase;
	margin-top: 15px;
	letter-spacing: 1.5px;
}


@media only screen and (max-width: 780px) {
	.coordonnees { font-size: 27px; }
}

@media only screen and (max-width: 400px) {
	.encart-titre { top: 10%; }
	.titre { font-size: 40px; }
	.coordonnees { font-size: 16px; }
	.avertissement { font-size: 10px; }
}

@media only screen and (max-width: 330px) {
	.titre { font-size: 30px; }
}