.img-thumbnail {
  object-fit: cover; 
  width: 100%;
  height: 300px;
  padding: 0px; 
  display: block;

}

.col-md-4 {
padding-top : 10px;
padding-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
}

.col-md-4 p.card-text {
text-align: left;

}

.container.block {
  padding: 20px;
  margin: 15px;
}

.container.highlight {
padding-bottom: 20px;
}

.card {
padding: 10px;
  min-block-size: 500px;
}

.card-body {
background-color: darkgray;
padding: 20px;
min-height: 178px;
}

.card-text {
text-align: left;
}

body            { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;}
a, h1, h2       { color: #377ba8; }
h1, h2          { margin: 0; }
h1              { border-bottom: 2px solid #eee; }
h2              { font-size: 1.2em; }

.male th {
    background-color: #add8e6;
    color: white;
}

.female th {
    background-color: #77dd77;
    color: white;
}

tr:nth-child(odd)		{ background-color:#eee; }
tr:nth-child(even)	{ background-color:#fff; }

tr:hover            { background-color: #ffff99;}




.wrapper {
  display: flex;
  align-items: stretch;
}

#sidebar {
  min-width: 250px;
  max-width: 250px;
  min-height: 100vh;
}

#sidebar.active {
  margin-left: -250px;
}

.form-control {
  text-align: left;
  width: 80%;
  height: auto;
}

.backend_table {

  border: 1px solid #C8C8C8;
  max-height: 800px;
  overflow: scroll;
  }
  
  table, table.dataframe, .dataframe th, .dataframe td {
   
      border-width: 1px;
      border: 1px solid #C8C8C8;
      border-collapse: collapse;
      text-align:left;
      padding: 10px;
      margin-bottom: 40px;
      font-size: 0.9em;
      margin-left: auto;
      margin-right: auto;
      
    }