.hidden {
    display: none;
	  /*margin-left: 20px;*/
  }
 body {
      font-family: 'Noto Sans', sans-serif;
      margin: 0;
      padding: 0;
    }

    header {
      background-color: #333;
      color: #fff;
      padding: 10px;
      text-align: center;
    }

    .headerTitle{
      color: #fff;
      margin:auto;
      font-size: 20px;
    }

    nav {
      background-color: #444;
      padding: 10px;
      text-align: center;
    }

    nav ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
    }

    nav ul li {
      /*display: inline;*/
      display: inline-block; /* Changed to inline-block */
      margin-right: 10px;
      position: relative; /* Added */
    }

    nav ul li a {
      color: #fff;
      text-decoration: none;
      padding: 5px 10px;
    }

    nav ul li a:hover {
      color: #b3e1ff;
    }
	
    .dropdown-menu {
      display: none;
      position: absolute;
      background-color: #646060;
      border-radius: 5px;
      padding: 10px;
      top: 100%; /* Added */
      left: 0; /* Added */
      z-index: 1; /* Added */
      width: 150px;
    }
    nav ul li:hover .dropdown-menu {
      display: block;
    }
    .dropdown-menu a {
      color: #fff;
      text-decoration: none;
      display: block;
      padding: 5px;
    }
    /*.dropdown-menu a:hover {
      background-color: #231E60;
    }*/

    /* Media Query for responsiveness */
@media only screen and (max-width: 770px) {
  nav ul li {
    display: block;
    margin: 0;
  }

  .dropdown-menu {
    position: relative;
    top: auto;
    left: auto;
    display: none;
    width: auto; /* Reset width for responsiveness */
  }

  nav ul li:hover .dropdown-menu {
    display: block;
    position: relative;
  }
}
	
	#login {
      color: #fff;
      text-decoration: none;
      padding: 5px 10px;
    }

    .logout {
      color: #3EBEEA; /* Default text color */
      cursor: pointer; /* Change cursor to pointer */
  }
  
  .logout:hover {
    color: #b3e1ff;
  }

  #sp_null {
      color:#39aacf;
      font-size: 30px;
      text-align: center;
      margin: 0 auto; /* This centers the span horizontally */
      display: block; /* Ensures that the span takes up the full width */
    }

    form {
      margin: 20px auto;
      max-width: 400px;
      padding: 20px;
      border: 1px solid #ccc;
      border-radius: 5px;
    }

    .formTitle{
      color: #0075FF;
      text-align: center;
      font-weight: bold;
    }

    form label {
      display: block;
      margin-bottom: 5px;
    }

    form input[type="text"],
    form input[type="password"],
    form input[type="date"],
    form input[type="number"],
    form select {
      width: 100%;
      padding: 4px;
      margin-bottom: 5px;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
    }

    .smallInput {
      width: 50px;
      padding: 4px;
      margin-bottom: 5px;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
    }

    form input[type="submit"] {
      background-color: #444;
      color: #fff;
      padding: 10px 20px;
      border: none;
      border-radius: 3px;
      cursor: pointer;
      width: 150px;
      margin-left: 20px;
    }

    form input[type="submit"]:hover {
      
      background-color: #231E60;
    }

    form input[type="button"] {
      background-color: #39aacf;
      color: #fff;
      padding: 10px 20px;
      border: none;
      border-radius: 3px;
      cursor: pointer;
      margin-left: 40px;
      margin-right: 20px;
      width: 150px;
      float: right; 
    }

    form input[type="button"]:hover {
      
      background-color: #231E60;
    }

    input[type="number"] {
      width: 50px;
      padding: 4px;
      margin-bottom: 5px;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box; 
    }
  
    input[type="date"] {
      padding: 4px;
      margin-bottom: 5px;
      border: 1px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
    }

    @media (max-width: 768px) {
      nav ul li {
        display: block;
        margin-bottom: 5px;
      }
    }
	
    .error-message {
      color: red;
      margin-top: 10px;
	    text-align: center;
    }
	
	.text1{
	  color: black;
    margin-top: 10px;
	}

  .smallText{
    font-size: 14px;
  }
	
	 /* CSS for centering the list */
  .centered-list {
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Align items to the left */
  }

  /* CSS for list items */
  .centered-list ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
  }

  .centered-list ul li {
    padding: 1px 0;
    border-bottom: 1px solid #ccc;
	  color: #352D90;
  }
  
  

  .float-container {
    width: 100%; 
  }

  .float-div {
    float: left;
    margin-left: 10%;
    width: 40%

  }

/*Style for the table to show results */

.custom-table {
  margin: 20px auto;
  border-collapse: collapse;
  width: 80%;
  border: 1px solid #ccc;
  border-radius: 5px;
}
.custom-table th, .custom-table td {
  padding: 10px;
  /*border-bottom: 1px solid #ccc;*/
  border: 1px solid #ccc;
  text-align: center;
}
.custom-table th {
  background-color: #706f6f;
  color: #fff;
}
.custom-table tr:nth-child(even) {
  background-color: #f2f2f2;
}
.custom-table tr:hover {
  background-color: #ddd;
}


#statsTable{
  max-width: 600px;
  padding: 5px;
  margin: 20px auto;
  border-radius: 5px;
}

#statsTable th:nth-child(1) {
  width:50%;
  background-color: #3cbcc5;
}
#statsTable th:nth-child(2) {
  width:25%;
  background-color: #3cbcc5;
}
#statsTable th:nth-child(3) {
  width:25%;
  background-color: #3cbcc5;
}



.buttonBlue {
  background-color: #164cc0;
  color: #fff;
  padding: 10px 20px;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  width: 150px;
  margin-left: 20px;
}

.buttonBlue:hover {
  
  background-color: #231E60;
}

.divButtonBlue{
  margin-top: 10px;
  text-align: center;
  margin: 20px auto;
  max-width: 400px;
  padding: 20px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.divTitulo{
  max-width: 400px;
  padding: 5px;
  margin: 20px auto;
  margin-top: 5px;
  margin-bottom: 1px;
  border: 1px solid #ccc;
  border-radius: 5px;
  text-align: center;
  color:#39aacf;
  font-weight: bold;
}