@import 'https://fonts.googleapis.com/css?family=Open+Sans|Open+Sans+Condensed:300|PT+Serif';
@font-face {
  font-family: 'icomoon';
  src:
    url('data:application/x-font-ttf;base64,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') format('truetype'),
    url('fonts/icomoon.woff') format('woff'),
    url('fonts/icomoon.svg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}
body {
	margin: 1em;
	font-family: 'PT Serif', serif;
	min-height: calc(100vh - 2em);
	display: flex;
	flex-direction: column;
}
body > header, body > main, body > nav, body > aside, body > footer {
	flex-grow: 0;
}
body > main {
	flex-grow: 1;
}
a {
	color: inherit;
}
.icon {
	font-family: icomoon;
	vertical-align: bottom;
	  /* Enable Ligatures ================ */
	letter-spacing: 0;
	-webkit-font-feature-settings: "liga";
	-moz-font-feature-settings: "liga=1";
	-moz-font-feature-settings: "liga";
	-ms-font-feature-settings: "liga" 1;
	font-feature-settings: "liga";
	-webkit-font-variant-ligatures: discretionary-ligatures;
	font-variant-ligatures: discretionary-ligatures;
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
a.icon {
	text-decoration: none;
}
header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	font-family: 'Open Sans Condensed',  sans-serif;
	font-size: 1.25em;
}
header div {
	padding-right: 2em;
}
h1 {
	font-family: 'PT Serif', serif;
	font-weight: normal;
	font-size: inherit;
	padding: 0;
	margin: 0;
}
h1 ~ p {
	margin: 0 0 calc(1px + 0.1ex) 0;
	font-size: 70%;
}
nav {
	display: block;
	flex-grow: 1e4;
	max-width: 25em;
	padding-top: 1ex;
}
nav ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-around;
}
nav li {
	padding: 0 1ex;
	flex-grow: 2;
	text-align: center;
}
nav li a {
	display: block;
	color: inherit;
	text-decoration: none;
	border-bottom: dotted 1px transparent;
}
nav .active {
	font-weight: bold;
}
nav li a:hover {
	border-bottom: dotted 1px black;
}
main {
	margin-top: 3em;
	margin-bottom: 1em;
}
.cards-sections a {
	text-decoration: none;
}
.cards-sections {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	margin: 0 -1em;
}
.cards-sections section {
	flex-grow: 1;
}
section h2 {
	display: none;
}
section ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;	
	list-style-type: none;
	margin: 0;
	padding: 0;
	height: 100%;
}
.album-card, .text-card {
	margin: 1em;
	width: 270px;
}
.album-card a, .text-card a {
	display: flex;
	flex-direction: column-reverse;
	height: 100%;
}
.album-card h3, .text-card h3 {
	font-size: 1em;
	margin-top: 0;
	padding-top: 1ex;
	border-top: dotted 1px black;
	text-align: center;
	height: 2.4em;
	text-overflow: ellipsis;
	overflow: hidden;
	word-wrap: break-word;
	hyphens: auto;
}
.album-card img {
	line-height: 1em;
	display: block;
}
.text-card p {
	text-overflow: ellipsis;
	overflow: hidden;
	max-height: 180px;
	margin: 0;
	font-style: italic;
	text-align: justify;
	word-wrap: break-word;
	hyphens: auto;
}
section.photo-cards ul {
	justify-content: flex-start;
}

section.photo-cards ul::after {
  content: '';
  flex-grow: 999999999;
}
.photo-card {
  margin: 2px;
  position: relative;
}
.photo-card i, .picture i, .picture img {
  display: block;
}
.photo-card img {
  position: absolute;
  top: 0;
  width: 100%;
  vertical-align: bottom;
}
.large-photo {
	display: flex;
	flex-direction: column-reverse;
}
.picture {
	display: block;
	flex-grow: 1;
	position: relative;
	max-height: calc(100vh - 10.5em); /* à réviser */
	overflow: hidden;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}
@media (min-width: 44em) { /* menu déplié */
	.large-photo .picture {
		max-height: calc(100vh - 8em);
	}
}
.picture img {
	/*  visibility: hidden; /* pour empêcher le clic droit */
 	width: 100%;
 	height: 0;
}
.large-photo .title {
	flex-grow: 0;
	text-align: center;
	margin-top: 1ex;
	font-style: italic;
}
.large-photo h2 {
	font-size: inherit;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
.large-photo h2, .large-photo button {
	display: inline;
}
.large-photo button {
	padding: 0;
	margin: 0;
	background: none;
	border: none;
	font-size: inherit;
	cursor: pointer;
}
aside {
	margin: 1em -1em;
	padding: 1em;
	background-color: rgb(220,220,220);
}
footer {
	margin: 1em 0 1ex 0;
	padding-top: 1ex;
	border-top: dotted 1px black;
}