*{
	margin:0px;
	padding:0px;
}

div.right_handle{
	right:0px;

}
div.left_handle{
	left:0px;

}
.clickable{
	cursor:pointer;
	position:fixed;
	height:100%;
	width:25%;

}
input{
margin:4px;
}
input[type="button"]{
height:32px;
width:64px;
}
div{
	color:white;
	display:inline-block;
}
a{
color:white;
}
html, body {
	height: 100%; 
	width:100%;
	background-color:black;
display:flex;
		flex-direction:column;
}

#view{
height:90%;
}

#view{
	position:relative;
	overflow-x: scroll;
	overflow-y: clip;
	white-space:nowrap;
	vertical-align:middle;
	z-index:100;
	flex-grow:1;
	
}
#view[stop="1"]{
	overflow-x:hidden;
}
div.page{
	width:50%;
	overflow: none;
	display:inline-block;
	text-align:center;
	vertical-align:middle;
	white-space:wrap;

}
#view[double_page="0"] div.page{
width:100%;
	vertical-align:middle;
}

#ui{
text-align:center;
position:relative;
width:100%;
	   z-index:100;
}

div.left{
	text-align:right;
	height:100%;
}
div.right{
	text-align:left;
	height:100%;
}
#view[double_page="0"] div.left
,#view[double_page="0"] div.right{
	text-align:center;
	width:100%;
}

img{
	object-fit: contain;
	max-height:100%;
	max-width:100%;
}
#view[yonkoma="1"] img{
	max-width:50%;
}

#page{
width:48px;
}
