*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

b{
    font-family: sans-serif;
    font-weight: bolder;
}

#main-floating-window{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 100%;
  height: 100%;
  
  background-color: rgba(0, 0, 0, 0.442);

  /* position: relative; */
}

#floating-box {
  position: fixed;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -60%);

  width: 90%;
  height: 75%;
  
  /* background-color: rgba(0, 0, 0, 0.8); */
  background-color: #fff;

  /* display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center; */

  padding: 5%;

  z-index: 9999;

  position: relative;
}

.close-icon {
  position: absolute;
  top: 20px;
  right: 20px;
  
  color: rgb(164, 164, 164);
  font-size: 35px;
  cursor: pointer;
}

#floating-box h1 {

  color: rgb(0, 0, 0);
  text-align: left;

  margin-bottom: 20px;
}

/* hide scrolbar start */

#paragraphs::-webkit-scrollbar {/* Hide scrollbar for Chrome, Safari and Opera */
  display: none;
}
 
#paragraphs{ /* Hide scrollbar for IE, Edge and Firefox */
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/* hide scrolbar end */

#paragraphs{
  width: 100%;
  height: 85%;

  overflow: hidden;
  overflow-y: scroll;
  
  /* border: 1px solid red; */
}

#floating-box #paragraphs p {
  color: rgb(0, 0, 0);
  color: #000000;
  font-size: 1rem;
  word-spacing: 3px;
  letter-spacing: 0.5px;
  font-weight: 500;
  line-height: 25px;

  /*text-align: left;*/
}

.margin-top{
  margin-top: 20px;
}

#floating-box #btn {
  position: absolute;
  bottom: 40px;
  right: 90px;
  /* transform: translate(-50%, -50%); */

  /* border: 1px solid red; */

  width: 12%;

  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;

  
}

#floating-box #btn .icon{
  font-size: 14px;
}

#floating-box #btn .fa-arrow-left{
  margin-right: 4px;
}

#floating-box #btn .fa-arrow-right{
  margin-left: 4px;
}

#floating-box #btn .prev{
  color: #488943;
  text-decoration: none;
}

#floating-box #btn .next{
  color: #488943;
  text-decoration: none;
}

#floating-box #btn .prev:hover{
  cursor: pointer;
}

#floating-box #btn .next:hover{
  cursor: pointer;
}

#floating-box #btn .inactive-icon{
  color: #bbe3b8;
}