h4 {
    margin: 10px;
    padding: 10px;
}
h3 {
    margin:10px;
    padding:10px;
}
h2 {
    margin: 10px;
    padding: 10px;
}
body {
    margin: 10px; 
    padding: 10px;
}
.container {
  display: inline-flex;
  background-color: transparent;
  vertical-align: top;
  justify-content: center; /* Centers items horizontally */
}

.container > div {
  background-color: #C1E869;
  border-radius: 10px;
  height:30px;
  width: 160px;
  display: flex;
  justify-content: center; 
  align-items: center;
  margin: 30px;
  padding: 0 15px;
  font-size: 22px;
}
.container > div:hover {
    background-color: #6A41B8; /* Color change on hover */
    cursor: pointer; /* OPTIONAL: Changes mouse cursor to a pointer */
}
a {
  color: #fcfcfc;
  text-decoration: none
}
h5 {
    margin-left: 60px;
    padding: 10px;
}
.center-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%; 
}

.logbook-table {
  /*display: block;*/
  margin: 0 auto;
  /*justify-content: center;*/
  text-align: center;
  width: 80%;
  border-collapse: collapse;
}

.logbook-table th, .logbook-table td {
  border: 1px solid #ddd; 
  padding: 8px;
  width: 90%
  text-align: left;
}

.logbook-table th {
  background-color: #f2f2f2; 
  color: #333;
}
.logbook-table th:hover,
.logbook-table td:hover {
  background-color: #6A41B8;
  color: white;             
  cursor: pointer;          
}

.logbook-table th:hover {
  color: white; 
}

video {
    margin: 10px;
    border-radius: 40px;
    padding: 10px;
}
img {
    margin: 10px;
    width: 400px;
    padding: 10px;
    height: 400px;
    border-radius:40px;
}
