.fBContainer {
	margin:0px auto;
	aspect-ratio:420/297;
	position:relative;
	max-width:100%;
}

.fBContainer::before {
  content: "";
  width: 1px;
  margin-left: -1px;
  float: left;
  height: 0;
  padding-top:70.71428571428571%;
}
.fBContainer::after {
  content: "";
  display: table;
  clear: both;
}

.fBContainerInner {
	position:absolute;
	top:5%;
	left:5%;
	width:90%;
	height:90%;
	perspective:5000px;
}

.fbPageShadow {
	box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);
	-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);
	-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);
	background:rgba(0,0,0,0.1);
	position:absolute;
	z-index:1;
	right:0%;
	top:0px;
  max-height:100%;
  width:50%;
  transition:width 0.35s, right 0.3s ease-in 150ms;
}

.fbPageShadow.opened {
	transition:width 0.3s ease-in 150ms, right 0.3s ease-in 150ms;
	width:100%;
}

.fbPageShadow.opened.lastpage {
	width:50%;
	right:50%;
	transition:width 0.3s, right 0.3s;
}

.fbPageContainer {
	aspect-ratio:210/297;
	position:absolute;
	z-index:2;
	transition:transform 0.7s;
	-webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  max-height:100%;
  max-width:50%;
  overflow:hidden;
}

.fbPageContainer::before {
  content: "";
  width: 1px;
  margin-left: -1px;
  float: left;
  height: 0;
  padding-top:141.4285714285714%;
}
.fbPageContainer::after {
  content: "";
  display: table;
  clear: both;
}

.fbPageContainer img {
	height:100%;
	width:100%;
	max-width:100%;
	max-height:100%;
	object-fit:cover;
}

.fbPageLeft {
	left:0px;
}

.fbPageRight {
	right:0px;
}

.fbPageCenterLeft {
	right:0px;
}

.fbPageCenterRight {
	left:0px;
}

.fbPageCenterLeft.toLeft {
	transform-origin:left;
	transform:rotateY(0deg);
}

.fbPageCenterLeft.toLeft.flip {
	transform:rotateY(-180deg);
}

.fbPageCenterLeft.toRight {
	transform-origin:left;
	transform:rotateY(-180deg);
}

.fbPageCenterLeft.toRight.flip {
	transform:rotateY(0deg);
}

.fbPageCenterRight.toLeft {
	transform-origin:right;
	transform:rotateY(180deg);
}

.fbPageCenterRight.toLeft.flip {
	transform:rotateY(0deg);
}

.fbPageCenterRight.toRight {
	transform-origin:right;
	transform:rotateY(0deg);
}

.fbPageCenterRight.toRight.flip {
	transform:rotateY(180deg);
}

.fBContainer > a {
	position:absolute;
	font-size:30px;
	text-decoration:none;
	color:#000000;
	font-weight:bold;
	display:inline-block;
	width:30px;
	line-height:30px;
	border:1px solid #a7a9ac;
	border-radius:50%;
	text-align:center;
	background:rgba(255,255,255,0.5);
	top:50%;
	transform:translateY(-50%);
	z-index:20;
}

.fBContainer > a.next {
	right:0px;
}

.fbPageMore {
	position:absolute;
	bottom:10px;
	left:50%;
	transform:translateX(-50%);
}

.flipbookListHolder {
	display:flex;
	flex-wrap:wrap;
	padding:0px 15%;
	row-gap:30px;
	justify-content:space-between;
}

.flipbookCover {
	width:23%;
}

.flipbookCover a {
	width:100%;
	display:block;
	color:#000000;
}

.flipbookCover a img {
	width:100%;
}

.flipbookTitle {
	text-align:center;
}

@media (max-width:700px) {
	.fBContainer {
		aspect-ratio:210/297;
	}
	
	.fBContainer::before {
	  content: "";
	  width: 1px;
	  margin-left: -1px;
	  float: left;
	  height: 0;
	  padding-top:141.4285714285714%;
	}
	.fBContainer::after {
	  content: "";
	  display: table;
	  clear: both;
	}
	
	.fbPageContainer {
		max-width:100%;
		transition:transform 0.3s;
	}
	
	.fbPageShadow {
		width:100%;
	}
	
	.fbPageCenterLeft.toLeft.flip {
		transform:rotateY(-90deg);
	}

	.fbPageCenterLeft.toRight {
		transform:rotateY(-90deg);
	}

	.flipbookCover {
		width:48%;
	}
}

@media (max-width:500px) {
	.flipbookCover {
		width:100%;
	}
}