@media (max-width: 1000px) {
	body{
text-align: center;
color: white;
	background-color: black;
	margin: 0;
}
		
        .logo {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width:200px;
  background-image: url('logo.png');
  background-size: cover;
  z-index: 9999;
}
.word {
  position: fixed;
  bottom: 20px;
  left: 20px;
  width:35%;
  z-index: 9999;
  text-align: left;
  font-size: 40px;
  opacity: .2;
}

#book{
  position: relative;
  z-index: 2;
font-size: 20px;
	padding:30px;
  text-align: left;
  font-family: "Sixtyfour", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "BLED" 0,
    "SCAN" 0;

}

#contents{
  display: none;
	border-radius: 50px;
	padding: 21px;
	font-size: 50px;
	color: rgb(1, 255, 1);
	background-color: transparent;
	border-width: 10px;
	width:75%;
}
#super{
width: 100%;
}

}


@media (min-width: 1000px) {
body{
text-align: center;
color: white;
	background-color: black;
	margin: 0;
	margin: 50px;
}
		
        .logo {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width:200px;
  background-image: url('logo.png');
  background-size: cover;
  z-index: 9999;
}

.word {
  position: fixed;
  bottom: 20px;
  left: 20px;
  width:35%;
  z-index: 9999;
  text-align: left;
  font-size: 40px;
  opacity: .2;
}

#super{
	width: 20%;
}
#book{
  position: relative;
  z-index: 2;
  overflow-y: auto;
font-size: 30px;
	padding:50px;
	width: 100%;
margin-bottom: 500px;
text-align: left;
font-family: "Sixtyfour", serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-variation-settings:
  "BLED" 0,
  "SCAN" 0;
}

#contents{
  display: none;

	border-radius: 50px;
	padding: 21px;
	font-size: 25px;
	color: rgb(1, 255, 1);
	background-color: transparent;
	border-width: 10px;
	width: 20%;
}

}