* {
			margin: 0;
			padding: 0;
			font-family: 'Roboto', sans-serif;
		}
		body {
			background-color: rgb(48,43,45);
		}

		.bookbutton {
			background-color: #FFF;
			width: 25%;
			display: block;
			height: 25vh;
			float: left;
			border: 1px solid #222;
			box-sizing: border-box;
			cursor: pointer;
			background-repeat: no-repeat;
			background-position: center;
			background-size: cover;
			position: relative;
		}
		.telechargement {
			position: absolute;
			width: 100%;
			top: -2em;
			background-color: rgba(0, 0, 0, 0.7);
			height: 2em;
			transition: top 0.5s;
			z-index: 1;
			color: #FFF;
		}
		.telechargement .content {
			position: absolute;
			left: 0em;
			display: inline-block;
			margin: 0.4em 0.5em;
			transition: left 0.5s, opacity 0.5s;
			opacity: 1;
		}
		.telechargement .overDisplay {
			position: absolute;
			top: 0;
			left: 3em;
			display: inline-block;
			margin: 0.4em 0.5em;
			transition: left 0.5s, opacity 0.5s;
			opacity: 0;
		}
		.telechargement:hover .content {
			opacity: 0;
			left: -3em;
		}
		.telechargement:hover .overDisplay {
			left: 0em;
			opacity: 1;
		}
		.telechargement a {
			color: #FFF;
			text-decoration: none;
		}
		.title {
			position: absolute;
			width: 100%;
			bottom: 0;
			background-color: rgba(255, 255, 255, 0.6);
			transition: background 0.5s;
			z-index: 0;
		}
		.title .content {
			margin: 1em;
		}
		.title .booktitle {
			font-size: 2em;
		}
		.title .subinfo {
			font-size: 0.5em;
		}
		.title .otherInfo {
			font-style: italic;
		}
		.overlay {
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			opacity: 0;
			transition: opacity 0.5s;
		}
		.bookbutton:hover .telechargement {
			top: -1px;
		}
		.bookbutton:hover .overlay {
			opacity: 0.6;
		}
		.bookbutton:hover .title {
			background-color: rgba(255, 255, 255, 0.8);
		}