/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 */

.wp-block-a8c-book {
	width: auto;
	box-sizing: content-box;
	&.aligncenter {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.wp-block-a8c-book__meta {
		padding: 0.5em 0 1em 0;
		line-height: 1;
		.wp-block-a8c-book__title {
			font-weight: bold;
		}
		> p {
			padding: 0;
			margin: 0.5em 0;
			font-size: 0.8em;
		}
	}

	.wp-block-a8c-book__publication {
		span {
			margin-right: 0.5em;
		}
	}

	.wp-block-a8c-book__summary {
		width: auto;
		margin: 0;
		padding: 0;
	}

	.wp-block-a8c-book__container {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		padding: 0;
		margin: 0 1em 1em 0;
	}

	.wp-block-a8c-book__cover {
		height: auto;
		max-width: 100%;
		img {
			display: block;
			width: 100%;
			height: 100%;
		}
	}

	// Show a shadow to emulate a book.
	.wp-block-a8c-book__cover {
		box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.3 ),
			0 2px 4px rgba( 0, 0, 0, 0.3 );
	}

	// 3D.
	@keyframes initAnimation {
		0% {
			transform: rotateY( -3deg );
		}
		100% {
			transform: rotateY( -16deg );
		}
	}

	.wp-block-a8c-book__cover {
		position: relative;
		transform-style: preserve-3d;
	}

	.wp-block-a8c-book__cover.is-3d:hover {
		transform: rotateY( -16deg );
		animation: 1s ease 0s 1 initAnimation;
	}
}