/* Tables */

table, td, th {
  border: 1px solid rgb(0, 0, 0);
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

table {
  border-collapse: collapse;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* Flex Boxes */

.imgCont { /* Container for images */
  margin: 0.5rem;
  padding: 0.5rem;
  
  background-color: rgba(128, 128, 128, 0.5);
  
  transition: transform 1s;
}

.imgCont > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cont { /* Main Container in index */
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
  
  padding: 0.5rem;
  margin: 1rem;
  
  border-style: solid;
  border-width: 4px;
  border-color: rgba(128, 128, 128, 0.5) rgba(192, 192, 192, 0.5) rgba(192, 192, 192, 0.5) rgba(128, 128, 128, 0.5);
}

.cont > .imgCont {
  width: 12rem;
  aspect-ratio: 1;
  max-width: 100%;
}

.carousel { /* Image Carousel */
  display: flex;
  
  width: 100%;
  height: 85vh;
  
  overflow-y: hidden;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  
  border-style: solid;
  border-width: 4px;
  border-color: rgba(128, 128, 128, 0.5) rgba(192, 192, 192, 0.5) rgba(192, 192, 192, 0.5) rgba(128, 128, 128, 0.5);
}

.carousel > * {
  flex: 0 0 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  
  text-align: center;
  
  scroll-snap-align: center;
  
  margin: 0.5rem;
}

.carousel > * > .imgCont {
  width: 95%;
  height: calc(95% - 2rem);
  cursor: alias;
}

.carousel > * > h3 {
  margin: 0.5rem;
}