body{
	font-family: 'EB Garamond', serif;
	font-size:1.2em;
	background-color:white;
	color:black;
}
#toparea{
	margin:auto;
	max-width: 30em;
 }
#logo{
	display: inline;
}
#logoImage{
	display: inline;
	margin:0px;
}
#logoTitle{
	display: inline;
	font-size: 3.2em;
	color:black;
}

@media(max-width:500px){
	#logoTitle{
		font-size: 2.2em;
	}
	#logoImage{
		max-width: 1em;
	}
}
#navbar{
	display:flex;
	flex-wrap:nowrap;
	justify-content: space-evenly;
	width:100%;
	font-size:1.4em;
}
.navOn{
	color:black;
	/*font-weight:bold;*/
}
.nav{
	color:rgb(172, 172, 172)
}
#wrap{
	padding:1em;
	padding-top:2em;
	padding-bottom:10em;
	max-width: 30em;
	margin:auto;
}
.navBack{
	margin:1em;
	display:none;
}
a{
	text-decoration: none;
	color:grey;
}
.titleBook,.titlePerson{
	display: inline;
	font-size: 2.5em;
	color:black;
}
img{
	display: block;
	margin-left:auto;
	margin-right:auto;
	margin-top:30px;
	margin-bottom: 30px;
	max-width:90%;
	min-width:5em;
}
input, label {
font-family: 'EB Garamond', serif;
}
.allBook{
	display: inline;
	zoom:0.3;
}
.allBook>a>img{
	display: inline;
	margin:1em!important;
}
.booksPerson{
	display: inline;
	zoom:0.3;
}
.booksPerson>a>img{
	display: inline;
	margin:1em!important;
}
@-moz-document url-prefix() {
	.allBook>a>img{
		max-width:200px;
	}
	.booksPerson>a>img{
		max-width:150px;
	}
  }
#wrapAllPerson{
	-webkit-column-width: 10em;
    	-moz-column-width: 10em;
        column-width: 10em;

	margin:1em;
}
.allPerson{
	text-indent:0.5em;
}

.pIndex{
	-webkit-column-width: 15em;
    	-moz-column-width: 15em;
        column-width: 15em;

	margin:5vw;
	margin-top:0;
}
@media(min-width:90em){
.pIndex{
	height:70vh;
	}
}



.tIndex{
	/*-webkit-column-width: 15em;
    	-moz-column-width: 15em;
        column-width: 15em;*/
	
	display: flex;
	flex-flow:row wrap;
	justify-content:space-evenly;
	align-items:center;

	margin:5vw;
	margin-top:0px;
	margin-bottom:0px;
}
@media(min-width:90em){
.tIndex{
	flex-flow:column wrap;
	height:70vh;
	}
}



.oIndex{
	-webkit-column-width: 25em;
    	-moz-column-width: 25em;
        column-width: 25em;

	margin:5vw;
	margin-top:0;
}
@media(min-width:90em){
.oIndex{

	height:70vh;
	}
}



.tPage{
max-width:30em;
margin:0px auto;
margin-top:1em;
}
@media(min-width:60em){
.tPage{
	-webkit-column-width: 20em;
    	-moz-column-width: 20em;
        column-width: 20em;
	max-width:100% !important;
	}
}


.pPage{
max-width:30em;
margin:0px auto;
margin-top:1em;
}
@media(min-width:60em){
.pPage{
	-webkit-column-width: 20em;
    	-moz-column-width: 20em;
        column-width: 20em;
	max-width:100% !important;
	}
}