/* Style for the pop-up box */
.pop-up {
  position: relative;
  display: inline-block;
}

/* Additional styling for centering the popup */
.pop-up-content.centered {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: rgb(255, 252, 251);
  border: 3px solid #BBCCCC;
  padding: 20px;
  max-width: 580px;
  width: 80vw;
  max-height: 60vh; /* Set a maximum height of 70% of viewport height */
  overflow-y: auto; /* Add vertical scrollbar when content overflows */
  z-index: 1;
  display: none;
}




 
@media (max-width: 768px) { 
  .pop-up-content.centered {
    max-width: 80%;
  }
}






.pop-up-content img {
  float: left;
  margin-right:20px;
  margin-bottom: 10px;
  max-width: 280px;
  border: 1px solid #ccc;
}

.pop-up:hover .pop-up-content {
  display: block;
}

.highlighted {
  background-color: rgba(173, 216, 230, 0.4);
  /* You can customize other styles as well */ 
  letter-spacing: 2px;
  padding: 1px 3px 1px 9px; 
}

.popuptext {
  font-size: 0.8rem;
  color: #333; /* Set your desired text color */
  line-height: 1.2;
}

div.popupboxinparagraph {font-size: 16px;
	font-weight: normal;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 10px 0px 0px 0px;
	text-align: justify;
	width: 720px;
	border: none;
}