@charset "UTF-8";
/* CSS Document */

/* Default button styles */
.rollover-button {
  background-color: #565656; /* Dark Background */
  color: white; /* White text */
  padding: 5px 5px;
  border: none;
  border-radius: 0px;
  cursor: pointer;
  font-size: 10px;
  letter-spacing: 1px;
  font-weight: bold;
  white-space: nowrap;
  transition: background-color 0.3s ease, color 0.3s ease; /* Smooth transition */
}

/* Hover state styles */
.rollover-button:hover {
  background-color: #d9d9d9; /* Lighter   on hover */
  color: #565656; /* Darker text on hover */
}

.rollover-button-cell {
  background-color: #565656; /* Dark Background */
  width: 87px; /* Fixed width in pixels */
  height: 24px;
}

.rollover-navigation-table {
  background-color: #565656; /* Dark Background */
  width: 609px; /* Fixed width in pixels */
}

.navigation-onPage {
  background-color: #87030d; /* Color Background */
  background-image: url('../images/btnOnPage.jpg'); /* Color Image */
  width: 87px; /* Fixed width in pixels */
  vertical-align: top;
  padding-top: 2px;
}

.text-onPage {
  font-family: Arial, Helvetica, "Open Sans", sans-serif;
  color: white; /* White text */
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 1px;
  padding-top: 5px;
}