body{
    min-height: 100vh;
    margin: 0;
    max-height: 100vh;
    overflow: hidden;
	background-color: #264653;
}

*{
    box-sizing: border-box;
}

.centered{
    margin: 25px auto;
    width: max-content;
	font-family: "Helvetica Neue", Helvetica, Arial;
	font-size: 15px;
	color: gray;
	}

.flipbook{
    margin: 0.0em auto;
    width: 670px;
    height: 460px;
    position: relative;
    transform-style: preserve-3d;
    perspective: 6000px;
}

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

.flipbook .leaf .page{
    transform-style: preserve-3d;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}

.flipbook .leaf .page.front{
    transform: rotate3d(0,1,0,0deg) translate3d(0,0,0.1px);
}

.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);
}

.flipbook .leaf .page.back:not(.external){
    box-shadow: inset -5px 0px 5px -5px #0005;
}

.disable{
    user-select: none;
    opacity: 0.1;
}


.page{
    padding: 0em;
    }


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


.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
}

.cover-img { border: none;
background-color: #FFFFFF;}

button {
    border: none;
    background-color: transparent;
	padding: 0px 0px 0px 0px;
    cursor: pointer;
    transition: transform 0.5s;
}

button:focus {
    outline: none;
}

button:hover i {
    color: #14417F;
}

i {
    color: gray;
    font-size: 4em;
}

body[onload]{
    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: #5B5B5B;
}

.goback {
		font-family: "Helvetica Neue", Helvetica, Arial;
		border: none;
		background-color: transparent;
		font-size: 15px;
		color: gray;
		text-decoration: none;
		padding-left: 17px;
	}
	
i:hover {
	color: #14417F;
} 

.fa-arrow-left {padding-left: 135px;}
.fa-arrow-right {padding-right: 100px;}