/** {*/
/*  box-sizing: border-box;*/
/*}*/

.centered {
  margin: auto;
  /*width: max-content;*/
}

.flipbook-back{
  position:absolute;
  margin: 3em auto;
  width:100%;
  /*max-width: 1520px;*/
  max-width: 1508px;
  height: 480px;
  /*position: relative;*/
  transform-style: preserve-3d;
  perspective: 1800px;
}
.flipbook {
  margin: 3em auto;
  width:100%;
  max-width: 1508px;
  height: 480px;
  position: relative;
  transform-style: preserve-3d;
  perspective: 1800px;
  pointer-events:none;
}

@media(max-width:1560px){
	.flipbook {
	  height: 380px;
	  max-width:90%;
	}	
}

@media(max-width:1280px){
	.flipbook {
	  height: 380px;
	  max-width:90%;
	}	
}

@media(max-width:769px){
	.flipbook {
	  height: 280px;
	}	
}

.flipbook .leaf {
  position: absolute;
  transform-style: preserve-3d;
  height: 100%;
  width: 50%;
  /*background-color: #fff;*/
  background-color:#d8f1ff;
  left: 50%;
  transition: transform 1s;
  transform: rotate3d(0, 1, 0, 0deg);
  transform-origin: left 0px;
  z-index:5;
}

:root{
    --instructorBgColor:#d2eaf7;
    --instructorCulrColor:#c5e5f6;
}

.flipbook .leaf .page {
  transform-style: preserve-3d;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  background-color:var(--instructorBgColor);
}
.sticker-browser .flipbook .leaf .page{
      /*background-color:#ffffff !important;*/
}
.flipbook .leaf .page.front {
  transform: rotate3d(0, 1, 0, 0deg) translate3d(0, 0, 0.1px);
  /*background-color: #d2eaf7;*/
}
.flipbook .leaf .page.front:not(.external) {
  box-shadow: inset 5px 0px 5px -5px #0005;
}
.flipbook .leaf .page.back {
  transform: rotate3d(0, 1, 0, 180deg) translate3d(0, 0, 0.1px);
  /*background-color: #d2eaf7;*/
}
.flipbook .leaf .page.back:not(.external) {
  box-shadow: inset -5px 0px 5px -5px #0005;
  background-color: var(--instructorBgColor);
}
.disabled {
  user-select: none;
  opacity: 0.6;
}

/*.title {*/
/*  text-align: center;*/
/*  width: 100%;*/
/*  padding: 0em !important;*/
/*  padding-top: 2em;*/
/*}*/

.page {
  padding: 1em;
}
.page.front {
  /*border-radius: 0em 1em 1em 0;*/
}
.page.back {
  /*border-radius: 1em 0em 0em 1em;*/
}

.leaf {
  background-color: #0000 !important;
}

.pageNumber {
  font-size: 0.75em;
  position: absolute;
  bottom: 0.5em;
}

.front .pageNumber {
  /*right: 0.75em;*/
}

.back .pageNumber {
  /*left: 0.75em;*/
}

.contents-row {
  display: flex;
  flex-flow: row nowrap;
}
.contents-row .spacer {
  flex: 1 1;
  height: 1em;
  border-bottom: 1px dashed #000;
}
.contents-row .text {
  flex: 0 0 auto;
}

/*h1, h2, h3 {*/
/*  font-family: cursive;*/
/*}*/

body[onload] {
  /*Cheesing the preview*/
  transform: scale(1.5);
  transform-origin: center top;
}
body[onload] .leaf:nth-child(1) {
  transform: rotate3d(0, 1, 0, -128deg) !important;
}
body[onload] .leaf:nth-child(2) {
  transform: rotate3d(0, 1, 0, -70deg) !important;
}
body[onload] .leaf:nth-child(3) {
  transform: rotate3d(0, 1, 0, -40deg) !important;
}
body[onload] div.leaf:nth-child(4) > div:nth-child(1) {
  background-color: #e76f51;
}


.page{
    overflow:hidden;
    background-color:white;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    
}
.flipbook{
	z-index:11;
}





.left-shadow,
.right-shadow{
	width: 50%;
    height: 100%;
    position: relative;
    -webkit-box-shadow: 0px 5px 15px -2px rgba(0, 0, 0, 0.67);
	box-shadow: 0px 5px 15px -2px rgba(0, 0, 0, 0.67);
	/*z-index: 2;  */
}
.left-shadow{
	position:absolute;
	top:0;
	left:0;
}
.right-shadow{
	position:absolute;
	top:0;
	right:0;
}
.turned{
	/*-webkit-box-shadow: 0px 5px 15px -2px rgba(0, 0, 0, 0.67);*/
	/*box-shadow: 0px 5px 15px -2px rgba(0, 0, 0, 0.67);*/
}