body {
  margin: 0px;
  padding: 0;
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 0px;
  top: 0px;
  overflow-y: hidden;
  overflow-x: overlay;
  scrollbar-width: none;
  /* -ms-overflow-style: none; */
  padding-bottom: 0px;
}

body::-webkit-scrollbar {
  width: 5px;
  height: 8px;
  background-color: rgba(0,0,0,0);; /* or add it to the track */
}

/* Add a thumb */
body::-webkit-scrollbar-thumb {
  background: #fff9e0;
}

#poem_text::-webkit-scrollbar {
  width: 5px;
  height: 8px;
  background-color: rgba(0,0,0,0);; /* or add it to the track */
}

#poem_text::-webkit-scrollbar-thumb {
  background: #fff9e0;
}

#whole::-webkit-scrollbar {
  width: 5px;
  height: 8px;
  background-color: rgba(0,0,0,0);; /* or add it to the track */
}

#whole::-webkit-scrollbar-thumb {
  background: #1A0C01;
}

/* for the info menu */
.top {
  position: fixed;
  width:50%;
  z-index: 999;
}

/* #question {
  height: 25px;
} */

.info {
  position: fixed;
  font-size: 26px;
  color: #FFF9E0;
  z-index: 999;
  top: 10px;
  right: 10px;
	padding:0px 0px;
	margin-left:0px;
	margin-top:0px;
	margin-bottom:0px;
}

#tag-menu {
	display:none;
}


#tag-menu:checked ~ div.drawer {
 animation: slide-out 0.5s ease;
 animation-fill-mode: forwards;
}

/* linear-gradient(to right, , rgba(255,0,0,0)); */
.drawer {
  background: radial-gradient(farthest-corner at 60% 55%, rgba(255, 255, 255, 1),rgba(255, 255, 255, 0.75),rgba(255,0,0,0));
	position:fixed;
  top: 0;
	right:-500px;
	height:100%;
	z-index:100;
	width:500px;
	animation: slide-in 0.5s ease;
	animation-fill-mode: forwards;
  margin-top: 0px;
  /* eventually make scroll within a div */
}

#whole {
  text-align: justify;
  margin-top: 35px;
  margin-left: 35px;
  margin-right: 35px;
  margin-bottom: 35px;
  padding-right: 10px;
  color: #1B0D00;
  font: Georgia;
  overflow-y: auto;
  height: 90%;
}

#bar_name {
  font-size: 30px;
}

#bar_title {
  font-size: 20px;
}

#bar_poem {
  font-size: 15px;
}

@keyframes slide-in {
 from {right: 0px;}
 to {right: -500px;}
}

@keyframes slide-out {
 from {right: -500px;}
 to {right: 0px;}
}


/* p {
  color: #fff9e0;
} */


.big {
  top: 0px;
  margin: 0px;
  padding: 0;
  display: flex;
}

#bg1 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg2 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg3 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg4 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg11 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg22 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg33 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg44 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#bg111 {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  flex-direction: row;
}

#silo {
  left:0%;
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  z-index: 997;
  position: absolute;
}

#title {
  position: absolute;
  height: 100px;
  padding-top: 20%;
  padding-left: 110%;
  z-index: 998;
}

#chair_text {
  width:400px;
  height: 541px;
  position: absolute;
  width:400px;
  height: 541px;
  font-size: 14px;
  font-family: Georgia;
  top: 21%;
  padding-left: 190%;
  color: #fff9e0;
}

#bike {
  left:300%;
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  z-index: 997;
  position: absolute;
}

.poem {
  height:365px;
  width: 400px;
  position: absolute;
  z-index: 997;
  padding-top: 20%;
  padding-left: 440%;
  overflow-y: hidden;
  font-size: 14px;
  color: #fff9e0;
}

#poem_title {
  padding-top: 17%;
  padding-left: 440%;
  z-index: 997;
  position: absolute;
  width:400px;
  font-size: 17px;
  font-family: Georgia;
  font-style: italic;
  color: #fff9e0;
}

#poem_text {
  position: absolute;
  height: 300px;
  width: inherit;
  padding-top: 20px;
  font-size: 14px;
  font-family: Georgia;
  overflow-y: auto;
  color: #fff9e0;
}

#women {
  max-height: 100vh;
  height:100vh;
  min-height: 100vh;
  z-index: 997;
  position: absolute;
  left:570%
}

#title1 {
  z-index: 997;
  position: absolute;
  height: 45px;
  padding-top: 20%;
  left: 700%;
}

#flowers {
  z-index: 997;
  position: absolute;
  height:713px;
  width: 471px;
  left: 780%;
  font-size: 14px;
  z-index: 997;
  font-family: Georgia;
  padding-top: 7%;
  color: #fff9e0;
}

/* last text width:346, height: 541 */