/* SVG container */
svg {
  margin: 30px;
  overflow: visible; /* allow circles to extend outside */
  margin-top: 55px;
}

.semi-circle {
  cursor: pointer;
  transition: fill 0.3s ease;
}

.semi-circle.treated {
  fill: #ab71c5; /* Treated color */
}

.semi-circle.untreated {
  fill: #35245b; /* Untreated color */
}

.semi-circle:hover {
  opacity: 0.8;
  stroke: #4a372c; /* Border on hover */
  stroke-width: 3px;
}

#Marfantitle {
  font-size: 15px; 
  font-weight: bold;
  color: black;
  text-align: left;
  line-height: 1.2;
  position: absolute;
  top: 420px;
  left: 50px;
  margin: 0;
}

/* Info paragraph */
#circle-info {
  position: absolute;
  top: 620px;
  left: 320px;
  width: 200px;
  text-align: center;
  font-size: 11px;
  color: #4a372c;
  transition: opacity 0.5s ease;
  opacity: 1;
}

#source {
  position: absolute;
  top: 600px;
  left: 320px;
  width: 200px;
  text-align: center;
  font-size: 11px;
  color: black;
  font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
  transition: opacity 0.5s ease;
  opacity: 1;
}

#pws-title {
  font-size: 15px; 
  font-weight: bold;
  color: black;
  text-align: left;
  line-height: 1.2;
  position: absolute;
  top: 420px; /* Example position */
  left: 50px; /* Example position */
  margin: 0;
}

#pws-info {
  position: absolute;
  top: 620px;
  left: 330px;
  width: 200px;
  text-align: center;
  font-size: 11px;
  color: #4a372c;
  transition: opacity 0.5s ease;
  opacity: 1;
}

#pws-source {
  position: absolute;
  top: 600px;
  left: 330px;
  width: 200px;
  text-align: center;
  font-size: 11px;
  color: black;
  font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
  opacity: 1;
}

/* === OI Circle Diagram (Book 3) - Retained for completeness === */
#title-oi {
  font-size: 15px;
  font-weight: bold;
  color: black;
  text-align: left;
  line-height: 1.2;
  position: absolute;
  top: 420px; /* Example position */
  left: 50px; /* Example position */
  margin: 0;
}

#circle-info-oi {
  position: absolute;
  top: 620px;
  left: 320px;
  width: 200px;
  text-align: center;
  font-size: 11px;
  color: #4a372c;
  transition: opacity 0.5s ease;
  opacity: 1;
}

#source-oi {
  position: absolute;
  top: 600px;
  left: 320px;
  width: 200px;
  text-align: center;
  font-size: 11px;
  color: black;
  font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
  opacity: 1;
}