<style>
    body {
      background-color: #E8E8E8;
      font-family: 'Arial', sans-serif;
    }




.logo {
  max-width: 300px;
  height: auto;
  display: block;
  margin: auto;
  margin-top: 20px;
}

.container {
  max-width: 400px;
        margin: 0 auto;
        padding: 20px;
        background-color: #f5f5f5;
        border-radius: 5px;
}

.card {
  width: 90%;
  max-width: 600px;
  background-color: #f80f80f80;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(60, 6, 60, 0.1);
  padding: 20px;
  margin: auto;
  margin-bottom: 0;
}

.card:not(:last-child) {
  margin-bottom: 10px;
}
    .table {
      width: 100%;
      border-collapse: collapse;
    }

    .table thead {
      background-color: #007bff;
      color: #ffffff;
    }

    .table th,
    .table td {
      padding: 10px;
      text-align: center;
    }

    .table th:first-child,
    .table td:first-child {
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px;
    }

    .table th:last-child,
    .table td:last-child {
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
    }

    .table tr:nth-child(even) {
      background-color: #f2f2f2;
    }

h2{
  color: #4D4D4D;
} 
.boton-seleccionar {
  display: inline-block;
  padding: 8px 16px;
  background-color: #159244;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  text-decoration: none;
  font-weight: bold;
  font-size: 16px;
  margin-top: 10px;
  cursor: pointer;
}

.boton-seleccionar:hover {
  background-color: #3EAC67;
}
/* Establezca los estilos del botón */
      .boton-seleccionar-otra-fecha {
        background-color: #007bff;
        color: #ffffff;
        border: none;
        padding: 10px;
        border-radius: 5px;
        cursor: pointer;
      }

      /* Establezca los estilos del icono */
      .icono-calendario {
        margin-right: 10px;
      }
      /* Establezca los estilos del pie de página */
      .pie-de-pagina {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #333333;
        color: #ffffff;
        text-align: center;
        padding: 10px;
      }
      .encabezado {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        background-color: #D2D2D2;
        color: #ffffff;
        text-align: center;
        padding: 10px;
      }

      /* Establezca los estilos del contenido */
      .contenido {
        margin-top: 50px; /* Ajuste el valor según la altura del encabezado */
        padding: 10px;
      }
      label {
        display: block;
        margin-bottom: 5px;
    }

    input[type="text"] {
      width: 100%;
      padding: 10px;
      margin-bottom: 20px;
      border: 1px solid #ccc;
      border-radius: 3px;
  }

  input[type="submit"] {
    width: 100%;
    padding: 10px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}


input[type="submit"]:hover {
  background-color: #0056b3;
}

h1 {
  text-align: center;
  margin-bottom: 20px;
}

 </style>