input {
  cursor: pointer;
}
.ans:lang(np) {
  font-family: 'kalimati' !important;
}
p,
h1 {
  font-family: sniglet;
  color: #595959;
}
.library {
  top: 9%;
  width: 100%;
  height: 100%;
}
.book01 {
  position: absolute;
  bottom: 22%;
  right: 48%;
  width: 20%;
  /* height: 12%; */
}
.titlediv {
  background-color: #a64d79ff;
  position: absolute;
  top: 0%;
  width: 100%;
  z-index: 200;
}
.title {
  padding: 2%;
  font-size: 1.8vw;
  color: #fff;
  letter-spacing: 0.8px;
  /* opacity: 0; */
}
.title1div {
  background-color: #5a95b5;
  position: absolute;
  top: 0%;
  width: 100%;
  opacity: 0;
  z-index: 20;
}
.title1 {
  padding: 2%;
  font-size: 1.5vw;
  color: #fff;
  letter-spacing: 2px;
  background-color: #a64d79ff;
}
.startitle {
  position: absolute;
  width: 4%;
  top: 20%;
  left: 29%;
}
@media screen and (max-width: 767px) {
  .startitle {
    left: 26%;
  }
}
@media screen and (min-width: 1024px) {
  .startitle {
    left: 30%;
  }
}
@media screen and (min-width: 1440px) {
  .startitle {
    left: 23%;
  }
}
.handicon {
  position: absolute;
  bottom: 16%;
  right: 57%;
  width: 7%;
  cursor: pointer;
  z-index: 103;
  display: none;
}
.book {
  width: 100%;
  height: 80%;
  position: absolute;
  /* top: 16%; */
  top: 19%;
  right: 0%;
  z-index: 101;
  opacity: 0;
}
.page3table {
  position: absolute;
  top: 35%;
  left: 12%;
  border: 3px solid #111;
  z-index: 102;
  width: 35%;
  height: 48%;
  font-family: sniglet;
  color: #111;
  opacity: 0;
  font-size: 1.6vw;
}
.page3table th {
  border: 3px solid #111;
  padding: 2% 2%;
  font-weight: 900 !important;
}
.page3table td {
  border: 3px solid #111;
  padding: 1% 2%;
}
.page3table td:nth-child(2) {
  width: 70%;
}
.rima {
  display: flex;
  position: absolute;
  top: 35.5%;
  left: 23%;
  z-index: 102;
  opacity: 0;
}
.pema {
  top: 43%;
}
.saru {
  top: 50%;
}
.kamal {
  top: 58%;
}
.sumi {
  top: 65%;
}
.star {
  width: 10%;
  margin: 0.5%;
}
.infodiv {
  background-color: #a4e8ffff;
  border: 3px solid #5a95b5;
  border-radius: 10px;
  padding: 1% 1.5%;
  position: absolute;
  /* top: 25%; */
  top: 33%;
  right: 22%;
  z-index: 102;
  opacity: 0;
  width: 25%;
}
body:lang(np) .infodiv {
  right: 15%;
}
.info {
  font-size: 1.5vw;
  font-weight: 800;
}
.starimg {
  width: 15%;
  position: absolute;
  left: 17%;
}
:lang(np).starimg {
  left: 20%;
  width: 10%;
}
.infostar {
  width: 3%;
  position: absolute;
  top: 27%;
  right: 32.5%;
  z-index: 103;
  opacity: 0;
}
.infos2 {
  background-color: #eeeeee;
  border: 1px solid #b5b5b5;
  border-radius: 10px;
  padding: 1.5%;
  position: absolute;
  top: 25%;
  right: 8%;
  z-index: 102;
  display: flex;
  align-items: center;
  /* opacity: 0; */
}
.opa {
  opacity: 1;
  top: 35%;
}

.infodiv.opa {
  top: 35%;
  right: 15%;
}

.page3table.opa * {
  border-color: #9e9e9e;
}

.book2 {
  width: 100%;
  height: 80%;
  position: absolute;
  /* top: 16%; */
  bottom: 0;
  right: 0%;
  z-index: 101;
  /* opacity: 0; */
}
.ansdiv {
  position: absolute;
  top: 10%;
  right: -5%;
  z-index: 103;
  height: 100%;
  width: 100%;
}
.leftarrow {
  position: absolute;
  top: 46%;
  right: 40%;
  width: 5%;
  z-index: 103;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  cursor: pointer;
  animation-name: rightarrow;
  animation-duration: 0.5s;
}
.rightarrow {
  position: absolute;
  top: 46%;
  right: 20%;
  width: 5%;
  z-index: 103;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  cursor: pointer;
  animation-name: rightarrow;
  animation-duration: 0.5s;
}
@keyframes rightarrow {
  0% {
    transform: translate(1px, 1px) rotate(0deg);
  }
  10% {
    transform: translate(-1px, -2px) rotate(-1deg);
  }
  20% {
    transform: translate(-3px, 0px) rotate(1deg);
  }
  30% {
    transform: translate(3px, 2px) rotate(0deg);
  }
  40% {
    transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    transform: translate(-1px, 2px) rotate(-1deg);
  }
  60% {
    transform: translate(-3px, 1px) rotate(0deg);
  }
  70% {
    transform: translate(3px, 1px) rotate(-1deg);
  }
  80% {
    transform: translate(-1px, -1px) rotate(1deg);
  }
  90% {
    transform: translate(1px, 2px) rotate(0deg);
  }
  100% {
    transform: translate(1px, -2px) rotate(-1deg);
  }
}
@-webkit-keyframes rightarrow {
  0% {
    width: 5%;
  }
  100% {
    /* top: 43%; */
    width: 5.5%;
  }
  0% {
    width: 5%;
  }
}
.ans {
  background-color: #fff;
  border: 3px solid #231f20;
  position: absolute;
  top: 45%;
  right: 28%;
  width: 9%;
  height: 8.5%;
  font-size: 2vw;
  text-align: center;
  z-index: 102;
  display: grid;
  place-content: center;
}
.submit {
  position: absolute;
  top: 70%;
  right: 22%;
  background-color: #3c78d8;
  border: 2px solid #1c5ecf;
  color: #fff;
  border-radius: 7px;
  padding: 1% 3.5%;
  z-index: 104;
  cursor: pointer;
}

@media (min-aspect-ratio: 4/3) {
  .startitle {
    left: 35vh;
  }
  .info {
    font-size: 2.5vh;
  }
}