.elementor-2374 .elementor-element.elementor-element-f0b929d:not(.elementor-motion-effects-element-type-background), .elementor-2374 .elementor-element.elementor-element-f0b929d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-19136be );}.elementor-2374 .elementor-element.elementor-element-f0b929d{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:40px 0px 40px 0px;}.elementor-2374 .elementor-element.elementor-element-f0b929d > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-2374 .elementor-element.elementor-element-40b2926{text-align:center;}.elementor-2374 .elementor-element.elementor-element-40b2926 .elementor-heading-title{font-family:"Oswald", Sans-serif;font-size:48px;font-weight:500;line-height:1.3em;color:var( --e-global-color-14b9b14 );}.elementor-2374 .elementor-element.elementor-element-661b624{--divider-border-style:solid;--divider-color:var( --e-global-color-14b9b14 );--divider-border-width:8px;}.elementor-2374 .elementor-element.elementor-element-661b624 .elementor-divider-separator{width:40%;margin:0 auto;margin-center:0;}.elementor-2374 .elementor-element.elementor-element-661b624 .elementor-divider{text-align:center;padding-block-start:2px;padding-block-end:2px;}.elementor-2374 .elementor-element.elementor-element-2720b12{text-align:center;font-family:"Inter", Sans-serif;font-size:16px;font-weight:400;line-height:1.3em;color:var( --e-global-color-14b9b14 );}@media(max-width:767px){.elementor-2374 .elementor-element.elementor-element-f0b929d{padding:20px 20px 20px 20px;}.elementor-2374 .elementor-element.elementor-element-40b2926 .elementor-heading-title{font-size:28px;}.elementor-2374 .elementor-element.elementor-element-f3a4ba6 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-2374 .elementor-element.elementor-element-2720b12{margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-size:12px;}}/* Start custom CSS for html, class: .elementor-element-f1313f0 */#bonita {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  max-width: 1000px;
  margin: 0px auto;
  padding: 20px 30px;
  background-color: #fff;
  border-radius: 10px;
  border: 0px solid #f7c46c;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* Left info */
#bonita .info h2 {
  font-family: 'Dancing Script', cursive;
  font-size: 32px;
  color: #333;
  margin-bottom: 5px;
}

#bonita .info h4 {
  font-size: 18px;
  color: #000;
  margin-bottom: 10px;
}

.sex-ratio {
  display: flex;
  align-items: center;
  gap: 10px;
}

.divider {
  width: 2px;
  height: 40px;
  background-color: black;
}

/* Center chart */
.chart {
  text-align: center;
}

/* Right legend */
.legend {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 16px;
  color: #333;
}

.legend .dot {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 8px;
}

.legend span {
  display: flex;
  align-items: center;
}

/* Responsive */
@media (max-width: 768px) {
  #bonita {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .legend {
    margin-top: 15px;
    align-items: center;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4b98b72 */#estero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  max-width: 1000px;
  margin: 00px auto;
  padding: 20px 30px;
  background-color: #fff;
  border: 0px solid #f7c46c;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* Left info */
#estero .info h2 {
  font-family: 'Dancing Script', cursive;
  font-size: 32px;
  color: #333;
  margin-bottom: 5px;
}

#estero .info h4 {
  font-size: 18px;
  color: #000;
  margin-bottom: 10px;
}

.sex-ratio {
  display: flex;
  align-items: center;
  gap: 10px;
}

.divider {
  width: 2px;
  height: 40px;
  background-color: black;
}

/* Chart center */
.chart {
  text-align: center;
}

/* Legend */
.legend {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 16px;
  color: #333;
}

.legend .dot {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin-right: 8px;
}

.legend span {
  display: flex;
  align-items: center;
}

/* Responsive */
@media (max-width: 768px) {
  #estero {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .legend {
    margin-top: 15px;
    align-items: center;
  }
}/* End custom CSS */