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

body {
	max-width: 100%;
	background-image: url('la-trappe-medium.jpg');
	background-size: cover;
	min-height: 800px;
	font-size: 16px;
}
.main-content {
	width: 95%;
	margin: 1em auto;
	padding: 1em 0;
}
.title {
	padding: 0 0 0.75em 0.2em;
	font-size: 2em;
	font-family: 'Helvetica Neue';
	letter-spacing: 2px;
}
.element {
	padding: 0 0 1em 1em;
	box-sizing: border-box;
	font-size: 1.15em;
	line-height: 1.4em;
	font-family: 'Helvetica Neue';
	position: relative;
}
.element::before {
	content: '•';
	position: absolute;
	left: 0.25em;
}
@media all and (min-width: 321px) {
body {
	background-image: url('la-trappe-medium.jpg');
	background-size: cover;
	min-height: 800px;
}
.main-content {
	padding: 2em 1em;
	box-sizing: border-box;
}
.title {
	padding: 0 0 0.75em;
}
@media all and (min-width: 415px) {
body {
	background-image: url('la-trappe-big.jpg');
	background-size: cover;
}
.main-content {
	padding: 3em 2em 24em;
	box-sizing: border-box;
}
.title {
	padding: 0 0 1em;
	font-size: 2.4em;
}
.element {
	width: 512px;
	padding: 0 0 1.5em 1em;
	font-size: 1.35em;
	line-height: 1.5em;
}
}