.dictionary {
  width: 100vw;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  margin-top: 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 5rem;
}

.title {
  margin-top: 5vh;
}

mark {
  padding: calc(var(--margin) * 0.5);
  margin: 0 calc(var(--margin) / 4);
  border-radius: calc(var(--radius) * 0.5);
}

.searchCont {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: var(--margin);
  gap: var(--margin);
  font-size: max(2vw, 1em, 2rem);
}

.searchLabel {
  font-size: max(2vw, 1em, 2rem);
  pointer-events: none;
  transition: all 0.3s ease-in-out;
}

.search {
  background-color: var(--back-light);
  padding: var(--margin) calc(var(--margin) * 2);
  border: 1px solid var(--back-light);
  color: var(--text);
  border-radius: var(--radius);
  font-size: max(1vw, 1em, 1rem);
  transition: all 0.3s ease-in-out;
}

.search:hover {
  border: 1px solid var(--text);
}

.table {
  width: calc(100% - 3vw);
  border-collapse: collapse;
  border: 1px solid var(--text);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  transition: all 0.3s ease-in-out;
  margin: 1.5vw;
  margin-bottom: var(--margin);
  font-size: max(1.5vw, 1em, 2rem);
}

.table td {
  border: 1px solid var(--text);
  padding: var(--margin);
}

.table th:nth-child(1), .table th:nth-child(2), .table th:nth-child(3) {
  background-color: var(--main);
  border-right: 1px solid var(--text);
  width: 25%;
  padding: var(--margin);
}