.books-wrapper
	{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}


.bk-list
	{
		position: relative;
		margin-top: 50px;
	}

.bk-list .book-element
	{
		position: relative;
		width: 300px;
		margin: 0px auto 40px;
		-webkit-perspective: 1800px;
		perspective: 1800px;
		z-index: 1;
	}

.bk-info
	{
		position: relative;
		margin-top: 30px;
	}

.bk-info h3
	{
		margin-bottom: 10px;
		padding: 25px 0 10px;
		font-size: 26px;
		border-bottom: 1px solid rgba(0,0,0,0.3);
	}

.bk-info h3 span:first-child
	{
		padding-bottom: 5px;
		color: #777777;
		font-size: 14px;
		font-weight: 400;
		text-transform: uppercase;
		display: block;
	}

.bk-info p
	{
		color: #444444;
	}

.bk-info button
	{
		margin-right: 4px;
		padding: 3px 15px;
		color: #FFFFFF;
		font-size: 14px;
		text-transform: uppercase;
		font-weight: 700;
		line-height: 1.6;
		background: #AD1A30;
		border: none;
		display: inline-block;
		cursor: pointer;
		transition: color 0.35s cubic-bezier(.21,.83,.24,1) 0s, background-color 0.35s ease-out 0s;
		box-shadow: 1px 1px 1px rgba(0,0,0,0.15);
	}

.bk-info button.bk-active,
.bk-info button:active
	{
		box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8), inset 0px -1px 1px rgba(0, 0, 0, 0.2);
	}

.no-touch .bk-info button:hover,
.bk-info button:hover,
.bk-info button.bk-active
	{
		background: #D9203C;
	}

.book-info
	{
		display: grid;
		grid-template-rows: 55px 1fr min-content;
		gap: 0px;
	}

.book-info p
	{
		margin-top: 10px;
	}

.book-info .button-wrapper
	{
		margin-top: 20px;
		text-align: right;
	}

.book-info .button
	{
		margin: 0px;
		width: max-content;
		grid-area: b;
	}

.bk-info h4
	{
		margin: 0px 0px 5px;
		font-size: 22px;
		font-weight: 700;
		line-height: 1.25;
	}

.bk-list .book-element .bk-book
	{
		position: relative;
		width: 100%;
		height: 475px;
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transition: -webkit-transform .5s;
		transition: transform .5s;
	}

.bk-list .book-element .bk-book:hover,
.bk-list .book-element .bk-book.bk-bookdefault:hover
	{
		-webkit-transform: rotate3d(0,1,0,35deg);
		transform: rotate3d(0,1,0,35deg);
	}

.bk-list .book-element .bk-book > div,
.bk-list .book-element .bk-front > div
	{
		position: absolute;
		display: block;
	}

.bk-list .book-element .bk-front
	{
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		-webkit-transform-origin: 0% 50%;
		transform-origin: 0% 50%;
		-webkit-transition: -webkit-transform .5s;
		transition: transform .5s;
		-webkit-transform: translate3d(0, 0, 20px);
		transform: translate3d(0, 0, 20px);
		z-index: 10;
	}

.bk-list .book-element .bk-front > div
	{
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
		z-index: 1;
	}

.bk-list .book-element .bk-page
	{
		top: 5px;
		width: 295px;
		height: 468px;
		display: none;
		-webkit-transform: translate3d(0,0,19px);
		transform: translate3d(0,0,19px);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		z-index: 9;
	}

.bk-list .book-element .bk-front,
.bk-list .book-element .bk-back,
.bk-list .book-element .bk-front > div
	{
		width: 300px;
		height: 475px;
	}

.bk-list .book-element .bk-left,
.bk-list .book-element .bk-right {
	width: 40px;
	left: -20px;
}

.bk-list .book-element .bk-top,
.bk-list .book-element .bk-bottom {
	width: 295px;
	height: 40px;
	top: -15px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.bk-list .book-element .bk-back
	{
		-webkit-transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
		transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
		box-shadow: 10px 10px 30px rgba(0,0,0,0.3);
		border-radius: 3px 0 0 3px;
	}

.bk-list .book-element .bk-cover-back {
	background-color: #000;
	-webkit-transform: rotate3d(0,1,0,-179deg);
	transform: rotate3d(0,1,0,-179deg);
}

.bk-list .book-element .bk-right {
	height: 390px;
	top: 5px;
	-webkit-transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
	-moz-transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
	transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.bk-list .book-element .bk-left
	{
		height: 475px;
		-webkit-transform: rotate3d(0,1,0,-90deg);
		transform: rotate3d(0,1,0,-90deg);
	}

.bk-list .book-element .bk-top {
	-webkit-transform: rotate3d(1,0,0,90deg);
	transform: rotate3d(1,0,0,90deg);
}

.bk-list .book-element .bk-bottom {
	-webkit-transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
	transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
}

/* Transform classes */

.bk-list .book-element .bk-viewinside .bk-front
	{
		-webkit-transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
		transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
	}

.bk-list .book-element .bk-book.bk-viewinside
	{
		-webkit-transform: translate3d(0,0,150px) rotate3d(0,1,0,0deg);
		transform: translate3d(0,0,150px) rotate3d(0,1,0,0deg);
	}

.bk-list .book-element .bk-book.bk-viewback
	{
		-webkit-transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
		transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
	}

/* Main colors and content */

.bk-list .book-element .bk-page,
.bk-list .book-element .bk-right,
.bk-list .book-element .bk-top,
.bk-list .book-element .bk-bottom
	{
		background-color: #FFFFFF;
	}

.bk-list .book-element .bk-front > div
	{
		border-radius: 0px 3px 3px 0;
		box-shadow: inset 4px 0px 10px rgba(0, 0, 0, 0.1);
		background-color: #F7F7F7;
	}

.bk-list .book-element .bk-front:after
	{
		content: '';
		position: absolute;
		top: 1px;
		left: -1px;
		bottom: 1px;
		width: 1px;
	}

.bk-list .book-element .bk-cover:after,
.bk-list .book-element .bk-back:after
	{
		content: '';
		position: absolute;
		top: 0;
		left: 10px;
		bottom: 0;
		width: 3px;
		background: rgba(0, 0, 0, 0.06);
		box-shadow: 1px 0px 3px rgba(255, 255, 255, 0.1);
	}

.bk-list .book-element .bk-back::after
	{
		left: auto;
		right: 10px;
	}

.bk-left h2
	{
		width: 475px;
		height: 40px;
		margin: 0px;
		padding-right: 10px;
		color: #333333;
		font-size: 20px;
		text-align: center;
		line-height: 40px;
		-webkit-transform-origin: 0 0;
		-moz-transform-origin: 0 0;
		transform-origin: 0 0;
		-webkit-transform: rotate(90deg) translateY(-41px);
		transform: rotate(90deg) translateY(-41px);
	}

.bk-content
	{
		position: absolute;
		top: 30px;
		left: 20px;
		bottom: 20px;
		right: 20px;
		padding: 30px 10px;
		background: #FFFFFF;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transition: opacity 0.3s ease-in-out;
		transition: opacity 0.3s ease-in-out;
		cursor: default;
		pointer-events: none;
		overflow: hidden;
		opacity: 0;
	}

.bk-content-current
	{
		opacity: 1;
		pointer-events: auto;
	}

.bk-content p
	{
		padding: 0px 0px 5px;
		-webkit-font-smoothing: antialiased;
		font-family: Georgia, Times, "Times New Roman", serif;
		color: #000;
		font-size: 14px;
		line-height: 20px;
		text-align: justify;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;

		overflow-wrap: break-word;
		word-wrap: break-word;

		-webkit-hyphens: auto;
		-webkit-hyphenate-limit-before: 3;
		-webkit-hyphenate-limit-after: 3;
		-webkit-hyphenate-limit-chars: 6 3 3;
		-webkit-hyphenate-limit-lines: 2;
		-webkit-hyphenate-limit-last: always;
		-webkit-hyphenate-limit-zone: 8%;

		-moz-hyphens: auto;
		-moz-hyphenate-limit-chars: 6 3 3;
		-moz-hyphenate-limit-lines: 2;
		-moz-hyphenate-limit-last: always;
		-moz-hyphenate-limit-zone: 8%;

		-ms-hyphens: auto;
		-ms-hyphenate-limit-chars: 6 3 3;
		-ms-hyphenate-limit-lines: 2;
		-ms-hyphenate-limit-last: always;
		-ms-hyphenate-limit-zone: 8%;

		hyphens: auto;
		hyphenate-limit-chars: 6 3 3;
		hyphenate-limit-lines: 2;
		hyphenate-limit-last: always;
		hyphenate-limit-zone: 8%;
	}

.bk-content .page-number
	{
		position: absolute;
		right: 0px;
		bottom: 0px;
		font-size: 14px;
		text-align: right;
		display: block;
	}

.bk-page nav
	{
		position: relative;
		margin-top: 20px;
		text-align: center;
		display: block;
		z-index: 100;
	}

.bk-page nav span
	{
		width: 20px;
		height: 20px;
		color: #343434;
		line-height: 1;
		background: #F0F0F0;
		border-radius: 50%;
		display: inline-block;
	}

.bk-page-prev
	{
		cursor: pointer;
		margin-right: 5px;
	}

.bk-page-next
	{
		cursor: pointer;
		margin-left: 5px;
	}

.bk-front > div,
.bk-back,
.bk-left,
.bk-front:after
	{
		background-color: #FFFFFF;
	}

.bk-cover
{
/*
	background-image: url(../images/1.png);
*/
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

.bk-cover h2
	{
		position: absolute;
		bottom: 0;
		right: 0;
		left: 0;
		padding: 30px 35px 30px 30px;
		color: #FFFFFF;
		background: rgba(255, 255, 255, 0.2);
		text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
	}

.bk-cover h2 span:first-child,
.bk-left h2 span:first-child
	{
		padding-right: 10px;
		font-size: 18px;
		text-transform: uppercase;
		font-weight: 400;
	}

.bk-cover h2 span:first-child
	{
		display: block;
	}

.bk-cover h2 span:last-child,
.bk-left h2 span:last-child
	{
		font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
	}


.bk-back p
	{
		padding: 30px;
		color: #333333;
		font-size: 16px;
		text-align: justify;
		font-weight: 700;
	}