body {
  background-color: rgb(35, 32, 42);
  color: white;
  font-family: Lato, Helvetica Neue, Helvetica, Arial, sans-serif;
  display: flex;
  align-items: center;
  flex-direction: column;
}

img {
  max-width: 250px;
  height: calc(338px/601px*250px);
  object-fit: contain;
}

.thumbnail {
  width: 250px;
}

h1, h2, h3 {
  margin: 0;
}

#searchBars {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

#search, #searchUser {
  padding: 0;
  width: calc(100% - 1rem);
  background-color: rgb(35, 32, 42);
  border: 1px solid rgb(68, 65, 75);
  color: white;
  padding: 0.5rem;
}

.container {
  display: flex;
  align-items: center;
  flex-direction: column;
  text-align: center;
  background-color: rgb(42, 39, 49);
  width: fit-content;
  padding: 1rem;
  border-radius: 0.5rem;
  box-shadow: 0 3px 3px -2px #00000026, 0 3px 4px #0000001a, 0 1px 8px #00000017;
  position: relative;
  gap: 0.5rem;
}

#title {
  margin: 1rem auto 1rem auto;
}

#games {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin: auto;
  align-items: center;
  justify-content: center;
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
}

/*.status {
  position: absolute;
  top: -0.15rem; left: -0.15rem;
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  background-color: rgb(22, 100, 15);
}

.lost .status {
  background-color: rgb(100, 15, 15);
}

.lost {
  background-color: rgb(42, 15, 15);
}*/

a {
  color: rgb(54, 127, 223);
  font-weight: 600;
  text-decoration: none;
}

.lost {
  color: red;
}

/* BUTTONS */
.buttons {
  display: flex;
  gap: 0.5rem;
}

.buttons .imageBtn {
  width: 3rem;
  height: 3rem;
  background-color: rgb(35, 32, 42);
  border-radius: 0.3rem;
  border: 1px solid rgb(68, 65, 75);
}

.imageBtn div, .imageBtn a {
  padding: 0.5rem;
  opacity: 0.5;
  width: calc(100% - 1rem);
  height: calc(100% - 1rem);
}

.imageBtn a {
  text-decoration: none;
  display: block;
}

.imageBtn a:hover, .imageBtn div:hover {
  opacity: 1;
  cursor: pointer;
}

.imageBtn img {
  width: 100%;
  height: 100%;
}

/* PAGINATION */
#pagination {
  display: flex;
  gap: 0.2rem;
  margin-top: 1rem;
}

#pagination div {
  background-color: rgb(35, 32, 42);
  border: 1px solid rgb(68, 65, 75);
  width: 1.5rem;
  height: 1.5rem;
  padding: 0.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

#count {
  width: fit-content !important;
  min-width: 1.5rem !important;
}

#pagination input {
  field-sizing: content;
  background: none;
  width: 100%;
  height: 100%;
  border: none;
  color: white;
  font-weight: 600;
  text-align: center;
  font-size: 16px;
}

#pagination img {
  width: 100%;
  opacity: 0.5;
}

.enabled img {
  cursor: pointer;
  opacity: 1 !important;
}

strong {
  margin: 0.5rem 0 0.3rem 0;
  opacity: 0.5;
}

select {
  background-color: rgb(35, 32, 42);
  border: 1px solid rgb(68, 65, 75);
  color: white;
}

#photoDump {
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.1;
}

#photoDump img {
  width: 1px;
  height: 1px;
}