p {
  font-size: 1.3rem;
}
.navbar-collapse.in {
  display: block !important;
}
.nav-link {
  color: #eee;
  padding: 8px 20px !important;
  font-weight: 500;
  color: #444 !important;
}
.nav-link:hover {
  background: #eee;
  transition: 1s;
}
.nav-link:active {
  background: #eee;
}
nav {
  border-bottom: 1px solid #eee;
  padding: 0px 20px;
}
.sectionOne {
  background-image: url("../images/bg.png");
}
.sectionOneDiv {
  background: rgb(239, 238, 238);
  padding: 50px ;
  text-align: center;
}
.sectionOneDiv div h2 {
  color: rgba(58, 57, 57, 0.501);
  font-weight: bold;
  font-size: 2.1rem;
  font-family: "Open Sans";
  margin-bottom: 2rem;
}
.sectionOneDiv div p {
  color: #0b0b0b;
}
.flex-just {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.sectionTwo {
  padding: 50px;
  background-color: white;
}
.sectionThree {
  padding: 50px;
  background-color: #eee;
}
.sectionFour {
  background-image: url("../images/bg2.png");
}
.sectionFourDiv {
  background: rgba(0, 0, 0, 0.9);
  padding: 40px ;
  text-align: center;
}
footer {
  background: #222;
  padding: 40px 0px;
}
footer h2 {
  color: white;
}
footer p {
  color: #eee;
}
.sectionHead {
  background-image: url("../images/bg.png");
}
.sectionHeadDiv {
  background: rgba(0, 0, 0, 0.8);
  padding: 60px 0px;
  color: white;
}
.bodyText {
  font-size: 1.2rem;
}
.headText {
  text-align: center;
}
.tableblue {
  border: 1px solid #BABAEC;
  margin: 0 auto;
}
.largeSection {
  font-size: 18px;
}
.lftAlign {
  text-align: left;
}
.rtAlign {
  text-align: right;
}
td {
  padding: 5px;
}
.btn2 {
  border: none;
  border-radius: 5px;
  background: #028bad;
  cursor: pointer;
  display: table-cell;
  vertical-align: middle;
  font: normal 15px Arial, Helvetica;
  color: white;
  padding: 10px 30px;
  font-weight: bold;
}
.btn2:hover {
  background: #016b2d;
  transition: 500ms;
}
.fa-brand {
  font-family: "Font Awesome 5 Brands";
  font-size: 1.2rem;
  margin-left: 10px;
}
.tooltip-container {
  position: relative;
  display: inline-block; /* or block, depending on layout */
  border-bottom: 1px dotted black; /* Optional: for visual cue */
  cursor: help; /* Optional: indicates hoverable element */
}

.tooltip-text {
  visibility: hidden; /* Hidden by default */
  min-width: 320px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 10px;

  /* Position the tooltip */
  position: absolute;
  z-index: 1; /* Ensures it appears above other elements */
  bottom: 125%; /* Example: positioned above the container */
  left: 50%;
  margin-left: -60px; /* Center the tooltip */
  opacity: 0; /* For fade-in effect */
  transition: opacity 0.3s; /* For smooth transition */
}

.tooltip-container:hover .tooltip-text,
.tooltip-container:active .tooltip-text {
  visibility: visible;
  opacity: 1; /* Show the tooltip on hover */
}