body {
  padding: 0;
  margin: 0;
  text-align: center;
  background-image: url("/img/logo.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-color: rgb(2, 0, 36);
  background-color: linear-gradient(
    90deg,
    rgba(2, 0, 36, 1) 0%,
    rgba(9, 9, 121, 1) 35%,
    rgba(0, 212, 255, 1) 100%
  );
  color: white;
  padding: 1rem;
}
svg path {
  fill: blue; /* Change this value to set the color */
}
form {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

h1 {
  text-align: center;
  display: inline;
  margin-top: 1rem;
}
input,
textarea,
button {
  padding: 1rem;
  margin: 0.5rem;
}

table {
  text-align: center;
  width: 80vw;
  padding: 0.5rem;
  margin: auto;
  margin-bottom: 200px;
}
td {
  border-left: 1px solid white;
  border-bottom: 1px solid white;

  color: white;
  border-top: 1px solid white;
}
td:last-child {
  border-right: 1px solid white;
}
th:last-child {
  border-right: 1px solid white;
}
th {
  text-transform: capitalize;
  border-left: 1px solid white;
  border-top: 1px solid white;
  border-bottom: 1px solid white;
  color: white;
  font-size: 1.5rem;
}
table tr:nth-child(odd) {
  background: rgb(44, 58, 73);
}
table tr:nth-child(even) {
  background: rgb(25, 33, 41);
}

.logout,
.change,
button {
  display: inline;
  float: right;
  margin-top: 1rem;
  border-radius: 0.5rem;
  color: white;
  background-color: rgb(59, 54, 112);
}
.vehicles {
  display: inline;
  float: right;
  margin-top: 1rem;
  border-radius: 0.5rem;
  color: white;
  background-color: rgb(59, 54, 112);
}
.logout,
.change:hover {
  cursor: pointer;
}
.greeting {
  text-align: center;
  display: block;
  float: right;
  color: white;
  background-color: rgb(26, 65, 68);
  padding: 1rem;
  font-size: 1rem;
  font-weight: bold;
}

.hidden {
  display: none;
}
.edit,
.changePassword {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  border: 5px solid rgb(59, 54, 112);
  width: 50vw;
  height: 80vh;
}

@media (max-width: 1000px) {
  body {
    display: flex;
    flex-direction: column;
  }
}
.search {
  float: left;
  display: block;
}
.searchtxt {
  border-radius: 1rem;
}
.searchbtn {
  border: 5px solid rgb(59, 54, 112);
  background-color: rgb(59, 54, 112);
  color: white;
  border-radius: 1rem;
}
.searchbtn:hover {
  cursor: pointer;
}

.changePassword,
.edit {
  background-color: rgb(47, 47, 88);
}

#calendar {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgb(47, 47, 88);
  border: 5px solid rgb(59, 54, 112);
  padding: 4rem;
  border-radius: 1rem;
}

@media print {
  .change {
    display: none;
  }
  .logout {
    display: none;
  }
  .greeting {
    display: none;
  }
  form {
    display: none;
  }
  .search {
    display: none;
  }
  button {
    display: none;
  }
  h1 {
    display: none;
  }
}

.data2 {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  color: black;
  width: 80vw;
  height: 80vh;
  border: 5px solid rgb(59, 54, 112);
  overflow-y: scroll;
}

.warningCancel,
.warningYes {
  display: inline;
}

.warningCancel,
.warningYes:hover {
  cursor: pointer;
}
