/* ---------------------------------------- */
/* Tables                                   */
/* ---------------------------------------- */
table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(0, 0, 0, 0.05);
  border-top: 1px solid var(--color-border-light-tertiary);
  border-bottom: 1px solid var(--color-border-light-tertiary);
  margin: 0.5em 0;
}

table thead {
  background: rgba(0, 0, 0, 0.5);
  color: var(--color-text-light-highlight);
  text-shadow: 1px 1px var(--color-shadow-dark);
  border-bottom: 1px solid var(--color-border-dark);
}

table tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.2);
}

table td:first-child {
  padding-left: 2px;
}

table td,
table th {
  padding: 0.25em 0;
}


/* ---------------------------------------- */
/*  Forms                                   */
/* ---------------------------------------- */
form .form-group,
form .form-group-stacked {
  clear: both;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 3px 0;
  align-items: center;
}

form .form-group>* {
  flex: 3;
}

form .form-group>label {
  flex: 2;
}

form .form-group label {
  line-height: var(--form-field-height);
}

form .form-group .form-fields {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
}

form .form-group .form-fields>* {
  flex: 1;
  margin: 0 3px 0 0;
}

form .form-group .form-fields>*:last-child {
  margin-right: 0;
}

form .form-group .form-fields>label {
  flex: 0;
  padding: 0 4px;
  text-align: center;
}

form .form-group .form-fields>label.checkbox {
  flex: none;
  padding: 0;
}

form .form-group .form-fields>input[type="checkbox"] {
  flex: 0 0 20px;
}

form .form-group .form-fields button {
  flex: 0;
  line-height: calc(var(--form-field-height) - 4px);
}

form .form-group .form-fields span.sep {
  flex: none;
}

form .form-group span.units {
  flex: 0;
  line-height: 28px;
  font-size: var(--font-size-12);
  color: var(--color-text-dark-secondary);
}

form .form-group-stacked>*,
form .form-group.stacked>* {
  flex: 0 0 100%;
}

form .form-group.slim .form-fields>label {
  flex: none;
  font-size: var(--font-size-12);
  color: var(--color-text-dark-secondary);
  text-align: right;
}

form .form-group.slim .form-fields>input[type="number"],
form .form-group.slim .form-fields>input[type="text"] {
  flex: 0 0 64px;
}

form .form-group.hidden {
  display: none;
}

form h1.form-header,
form h2.form-header,
form h3.form-header {
  margin: 0 0 5px;
  padding: 3px 0;
  color: var(--color-text-dark-header);
  border-top: 1px solid var(--color-border-light-primary);
  border-bottom: 1px solid var(--color-border-light-primary);
}

form .notes,
form .hint {
  flex: 0 0 100%;
  font-size: var(--font-size-12);
  line-height: var(--line-height-16);
  color: var(--color-text-dark-secondary);
  margin: 3px 0;
}


/* Flexbox */
.flexrow {
  display: flex;
  flex-direction: row;
  /*flex-wrap: wrap;*/
  justify-content: flex-start;
}

.flexcol {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.flexrow>*,
.flexcol>* {
  flex: 1;
}

.flexrow>.flex0,
.flexcol>.flex0 {
  display: block;
  flex: 0;
}

.flexrow>.flex1,
.flexcol>.flex1 {
  flex: 1;
}

.flexrow>.flex2,
.flexcol>.flex2 {
  flex: 2;
}

.flexrow>.flex3,
.flexcol>.flex3 {
  flex: 3;
}


/* ----------------------------------------- */
/* General Sheet Styling
/* ----------------------------------------- */
.sheet {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.sheet>* {
  flex: 1;
}

.sheet>.flex0 {
  display: block;
  flex: 0;
}

.sheet>.flex1 {
  flex: 1;
}

.sheet>.flex2 {
  flex: 2;
}

.sheet>.flex3 {
  flex: 3;
}

.sheet header.sheet-header {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}

.sheet header.sheet-header>* {
  flex: 1;
}

.sheet header.sheet-header>.flex0 {
  display: block;
  flex: 0;
}

.sheet header.sheet-header>.flex1 {
  flex: 1;
}

.sheet header.sheet-header>.flex2 {
  flex: 2;
}

.sheet header.sheet-header>.flex3 {
  flex: 3;
}

.sheet header.sheet-header img {
  flex: 0 0 64px;
  height: 64px;
  margin-right: 6px;
}

.sheet header.sheet-header h1 {
  flex: 1;
  margin: 0;
  border-bottom: none;
}

.sheet header.sheet-header h1 input {
  height: 48px;
  line-height: 48px;
  margin: 8px 2%;
  width: 96%;
}

.sheet nav.sheet-tabs {
  margin: 4px 0;
  border-top: 1px solid var(--color-border-light-primary);
  border-bottom: 1px solid var(--color-border-light-primary);
  padding: 7px 0;
}

.sheet nav.sheet-tabs .item i {
  margin-right: 2px;
}

.sheet footer.sheet-footer {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  flex: 0 0 32px;
  line-height: 32px;
}

.sheet footer.sheet-footer>* {
  flex: 1;
}

.sheet footer.sheet-footer>.flex0 {
  display: block;
  flex: 0;
}

.sheet footer.sheet-footer>.flex1 {
  flex: 1;
}

.sheet footer.sheet-footer>.flex2 {
  flex: 2;
}

.sheet footer.sheet-footer>.flex3 {
  flex: 3;
}

.sheet .editor-content {
  height: 100%;
  overflow-y: auto;
  word-break: break-word;
}

.li-no-style {
  list-style-type: none;
}

/* Tooltip container AAA */
.beneos-tooltip {
  position: relative;
  display: inline-block;
}

.beneos-tooltip-dotted {
  border-bottom: 1px dotted black;
  /* If you want dots under the hoverable text */
}

.beneos-tooltip .beneos-tooltip-content {
  width: 490px;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.9rem;
  top: 0.8rem;
  left: 2rem;
}

.beneos-tooltip .beneos-tooltip-content-bmap {
  height: 256px;
  max-height: 256px;
  width: 620px;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.9rem;
  top: 0.8rem;
  left: 2rem;
}

.beneos-tooltip .beneos-tooltip-purpose {
  width: 220px;
  margin: 4px;
  padding: 4px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.8rem;
  top: 0.8rem;
  left: 2rem;
}

.beneos-search-icons-result {
  border: 0;
  width: 120px;
  height: 120px;
  margin-right: 4px;
  max-width: 128px;
  flex-grow: 1;
}

.beneos-search-icons-bmap-result {
  border: 0;
  width: 212px;
  height: 120px;
  margin-right: 4px;
  min-width: 216px;
  max-width: 216px;
  flex-grow: 1;
}

.beneos-search-middle {
  flex-grow: 3;
}

.beneos-search-last {
  flex-grow: 1;
  max-width: 128px;
}

.beneos-search-stat {
  margin-left: 12px;
}

.beneos-search-button {
  border-width: 1px;
  border-style: ridge;
  border-color: black;
  padding-left: 4px;
  padding-right: 4px;
  margin-top: 12px;
  margin-right: 12px;
  background-color: #cecdc8;
  max-height: 18px;
}

.beneos-button-rarity,
.beneos-button-origin,
.beneos-button-item_type,
.beneos-button-tier,
.beneos-button-price {
  color: black;
}

.beneos-search-button:hover,
.download-item:hover,
.download-spell:hover,
.download-token:hover,
.beneos-button-rarity:hover,
.beneos-button-origin:hover,
.beneos-button-item_type:hover,
.beneos-button-tier:hover,
.beneos-button-price:hover,
.beneos-button-cr:hover {
  background-color: #d6d6d5;
  cursor: pointer;
}

.beneos-search-installed {
  font-weight: bold;
  color: black;
}

.beneos-search-new {
  font-weight: bold;
  color: black;
}

.beneos-search-notinstalled {
  border-width: 0px;
  padding-left: 4px;
  padding-right: 4px;
  color: #6e1212;
  text-align: center;
  max-height: 18px;
}

.beneos-search-journal-button {
  text-align: center;
  border-width: 1px;
  border-style: ridge;
  border-color: black;
  padding-left: 4px;
  padding-right: 4px;
  background-color: #d6d6d5;
  flex-grow: 1;
  max-height: 18px;
}

.beneos-search-logo-left {
  max-width: 64px;
  max-height: 64px;
  flex-grow: 1;
  margin-right: 12px;
}

.beneos-search-logo-middle {
  flex-grow: 1;
}

.beneos-search-logo-middle label {
  color: #191813;
}

.beneos-search-logo {
  border: 0;
  max-width: 64px;
  max-height: 64px;
}

.beneos-search-small-icons {
  border: 0;
  max-width: 16px;
  max-height: 16px;
  flex-grow: 1;
}

.beneos-title-center {
  font-weight: strong;
  color: #3e0706;
  text-align: center;
}

.beneos-search-small-text {
  background-color: #dfdfdf;
}

.beneos-not-installed {
  background-color: #ff00000E;
}

.beneos-description-text {
  font-size: 0.8rem;
  color: black;
}

.beneos-buttons-biom-purpose {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
}

#token-hud .beneos-selector-wrap,
#token-hud .beneos-selector-idle-wrap {
  position: absolute;
  left: 75px;
  display: none;
  top: 50%;
  transform: translate(0%, -50%);
  width: max-content;
  max-width: 400px;
  max-height: 350px;
  text-align: start;
  overflow-y: auto;

}

#token-hud .beneos-variants-wrap {
  position: absolute;
  left: 75px;
  display: none;
  top: 50%;
  transform: translate(0%, -50%);
  width: max-content;
  max-width: 300px;
  max-height: 350px;
  text-align: start;
  overflow-y: auto;

}

#token-hud .beneos-button-select {
  max-width: 380px;
  width: 100%;
  overflow-wrap: break-word;
  padding-top: 0;
  padding-bottom: 0;
  width: max-content;
  padding: 0;
  margin: 0;
  line-height: 40px;
}

#token-hud .beneos-variants-wrap .beneos-button-select {
  padding-left: 20px;
}

#token-hud .beneos-token-button {
  max-width: 380px;
  height: 50px;
  margin: 4px 0px 4px 8px;
  object-fit: contain;
}


#token-hud img {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  margin: auto;
}

#token-hud video {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  margin: auto;
}

#token-hud span {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  font-size: 18px;
  margin: auto;
}

#token-hud .beneos-button-select {
  width: 100%;
  text-align: left;

}

#token-hud .beneos-active {
  display: block;
}

.token-sheet .beneos-disabled {
  display: none;
}

.li-no-style {
  list-style-type: none;
}

/* Tooltip container */
.beneos-tooltip {
  position: relative;
  display: inline-block;
}

.beneos-tooltip-description {
  color: #000000
}

.beneos-tooltip-dotted {
  border-bottom: 1px dotted black;
  /* If you want dots under the hoverable text */
}

/* Tooltip text */
.beneos-tooltip .beneos-tooltiptext {
  text-align: left;
  /* Position the tooltip text */
  position: absolute;
  margin-left: 2rem;
  margin-top: 2rem;
  z-index: 999;
  /* Fade in tooltip */
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
  overflow-wrap: anywhere;
}

.tooltip-word-wrap {
  overflow-wrap: anywhere;
}

.beneos-tooltip:hover .beneos-tooltiptext {
  visibility: visible;
  opacity: 1;
}

.beneos-tooltip .beneos-tooltiptext-button {
  text-align: left;
  /* Position the tooltip text */
  position: absolute;
  max-width: 200px;
  margin-left: 2rem;
  margin-top: 2rem;
  z-index: 999;
  /* Fade in tooltip */
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
}

.beneos-tooltip:hover .beneos-tooltiptext-button {
  visibility: visible;
  opacity: 1;
  transform: translate(4px, -60px);
}

.beneos-tooltip .beneos-tooltip-content-item {
  width: 620px;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.9rem;
  border: 1px solid black;
  top: 0.8rem;
  left: -2rem;
}

.beneos-tooltip .beneos-tooltip-content-left-buttons {
  width: 280px;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-width: 1px;
  border-style: solid;
  border-radius: 12px;
  font-size: 0.9rem;
  transform: translate(-300px, -40px);
  color: #000000;
}

.beneos-tooltip .beneos-tooltip-content-installed {
  width: 220px;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  border-width: 1px;
  border-style: solid;
  font-size: 0.9rem;
  flex-wrap: wrap;
  flex-grow: 1;
  color: #000000;
  transform: translate(-100px, 0px);
}

.beneos-tooltip .beneos-tooltip-content {
  width: 490px;
  border: 1px solid black;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.9rem;
  top: 0.8rem;
  left: 2rem;
}

.beneos-tooltip .beneos-tooltip-content-button {
  width: 220px;
  border: 1px solid black;
  margin: 8px;
  padding: 8px;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.9rem;
  top: 0.8rem;
  left: 2rem;
}

.beneos-tooltip .beneos-tooltip-keyword {
  width: 220px;
  height: 96px;
  margin: 4px;
  padding: 4px;
  white-space: wrap;
  border: 1px solid black;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.8rem;
  top: 0.8rem;
  left: -2rem;
}

.beneos-tooltip .beneos-tooltip-purpose {
  width: 220px;
  height: 96px;
  margin: 4px;
  padding: 4px;
  white-space: wrap;
  border: 1px solid black;
  background: rgba(233, 226, 218, 0.9);
  border-radius: 12px;
  font-size: 0.8rem;
  top: 0.8rem;
  left: -2rem;
}

.beneos-rebuild-compendium-button {
  margin-top: 12px;
}

.beneos-tooltip-icon-group {
  vertical-align: top;
  padding: 0px;
  max-width: 128px;
  min-width: 128px;
  /*transform: translate(8px, -14px);*/
}

.beneos-tooltip-icon-group-compendium {
  vertical-align: center;
  padding: 0px;
  min-width: 128px;
}

.beneos-icon-group {
  padding: 0px;
  position: relative;
  max-width: 128px;
  min-width: 128px;
}

.beneos-icon-child {
  padding: 0px;
  position: absolute;
  top: 2px;
  left: 2px;
  transform: scale(0.98);
}

.beneos-icon-child-battlemap {
  padding: 0px;
  position: absolute;
  width: 124px;
  height: 124px;
  top: 2px;
  left: 2px;
  object-fit: cover;
}

.beneos-search-icons-result {
  padding: 0px;
  border: 0;
  max-width: 128px;
  flex-grow: 1;
  transform: translate(0px, -4x);
  background-image: url("../ui/result_item_icon_bg.webp");
}

.beneos-icon-background {
  border: 0;
  min-width: 132px;
  max-width: 132px;
  flex-grow: 1;
}

.beneos-search-icons-result-tooltip {
  object-fit: contain;
  width: 256px;
  height: 256px;
  max-width: 256px;
  max-height: 256px;
  border: 0;
  margin-right: 4px;
  flex-grow: 1;
}

.beneos-search-icons-result-tooltip-item {
  border: 0;
  width: 256px;
  margin-right: 4px;
  transform: translate(-100px, 0px);
  flex-grow: 1;
}

.beneos-search-icons-bmap-result {
  border: 0;
  width: 212px;
  height: 120px;
  margin-right: 4px;
  min-width: 216px;
  max-width: 216px;
  flex-grow: 1;
}

.beneos-search-middle {
  min-width: 420px;
  max-width: 420px;
  /*flex-grow:3;*/
}

.search-engine-section a {
  text-decoration: none;
}

.beneos-search-last {
  justify-content: flex-start;
  flex-grow: 0;
  max-width: 128px;
}

[data-tooltip]:not(a, button, input, [role=button]) {
  border-bottom: 0px;
}

.beneos-search-title {
  font-size: 1.2rem;
  display: flex;
  color: #ffffff;
  padding-left: 4px;
  padding-right: 8px;
}

.beneos-search-title-result {
  font-size: 1.15rem;
  display: flex;
  background-color: #3e0706;
  color: #ffffff;
  padding-left: 4px;
  padding-right: 8px;
  font-size: 1.1rem;
}

.triangle-topleft {
  width: 0;
  height: 0;
  border-top: 1.5rem solid #3e0706;
  border-right: 1.5rem solid transparent;
}

.triangle-topright {
  margin-top: 12px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 1px;
  border-top: 1.2rem solid #ebe8e0;
  border-left: 1.2rem solid transparent;
}

.beneos-spell-description {
  color: black;
  padding-left: 8px;
  margin-right: 12px;
}

.beneos-search-text01,
.beneos-search-stat {
  padding-left: 4px;
  margin-right: 12px;
}

.beneos-classes {
  margin-left: 4px;
}

.beneos-fitting-button {
  text-align: center;
  border-width: 1px;
  max-width: 7.2rem;
  border-style: ridge;
  border-color: black;
  padding-left: 4px;
  padding-right: 4px;
  margin-top: 6px;
  margin-right: 12px;
  margin-bottom: 4px;
  background-color: #cecdc8;
  max-height: 18px;
}

.beneos-search-button-token {
  background-color: #ebe8e0;
  white-space: nowrap;
  color: #191813;
  border: 1px solid;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  padding-left: 4px;
  padding-right: 4px;
  margin-top: 0px;
  margin-right: 4px;
  margin-bottom: 4px;
  min-height: 1.2rem;
  max-height: 1.2rem;
  max-width: 8rem;
}


.beneos-search-journal-button {
  text-align: center;
  border-width: 1px;
  border-style: ridge;
  border-color: black;
  padding-left: 4px;
  padding-right: 4px;
  background-color: #d6d6d5;
  flex-grow: 1;
  max-height: 18px;
}

.flexpacked {
  flex-grow: 0;
}

.beneos-search-grid-button,
.beneos-search-brightness-button,
.beneos-search-casting-button,
.beneos-release-url-button,
.beneos-search-tier-button,
.beneos-search-price-button,
.beneos-search-spell-type-button,
.beneos-search-action-button,
.beneos-search-cr-button {}

.beneos-search-yt-icons {
  max-height: 18px;
  border: 0;
  opacity: 50%;
  padding-left: 2.4rem;
}

.token-name-new {
  color: #c7f0a9;
}

.token-name-update {
  color: #f4ecbf;
}

.beneos-search-yt-button {
  align-self: center;
  text-align: center;
  margin-top: 6px;
  margin-left: 0rem;
  padding-left: 4px;
  padding-right: 4px;
  max-height: 2.4rem;
  max-width: 6rem;
}

.download-token {
  color: black;
}

.beneos-search-yt-button {
  align-self: center;
  text-align: center;
  margin-top: 2px;
  max-height: 1.2rem;
  max-width: 4rem;
}

.beneos-search-yt-button-shifted {
  margin-left: 1.0rem;
}

.moulinette-button-container,
.video-button-container {
  /*width: 100%;*/
  align-items: center;
  align-content: center;
}

.beneos-search-logo-left {
  max-width: 64px;
  max-height: 64px;
  flex-grow: 1;
  margin-right: 12px;
}

.beneos-search-logo-middle {
  flex-grow: 3;
}

.beneos-search-logo-middle label {
  color: #191813;
}

.beneos-search-logo {
  border: 0;
  max-width: 64px;
  max-height: 64px;
}

.beneos-search-small-icons {
  border: 0;
  max-width: 16px;
  max-height: 16px;
  margin-right: 8px;
  transform: translate(0px, 4px);
  flex-grow: 1;
}

.beneos-title-center {
  text-align: center;
}

.beneos-search-main-choice {
  background-color: #3e0706;
  color: white;
}

.beneos-search-main-choice input:checked+label {
  color: rgba(233, 226, 218, 0.9);
}

.beneos-search-small-text {
  color: #3e0706;
  justify-self: center;
  justify-content: center;
  justify-items: center;
}

.beneos-search-small-text a {
  color: #3e0706;
}

.beneos-not-installed {
  background-color: #ff00000E;
}

.beneos-description-background {
  padding: 4px;
}

.beneos-description-text {
  font-size: 0.8rem;
}

.beneos-actor-menu .beneos-token-menu-element {
  max-width: 380px;
  width: 100%;
  align-self: start;
}

.beneos-actor-menu .beneos-button-select {
  max-width: 380px;
  width: 100%;
  align-items: start;
  align-content: start;
  padding-top: 0;
  padding-bottom: 0;
  padding: 0;
  margin: 0;
  text-align: left;
}

.beneos-actor-menu .beneos-token-button {
  height: 50px;
  border-width: 0px;
  margin: 4px 0px 4px 8px;
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  margin: auto;
}

.beneos-actor-menu .beneos-token-text {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  font-size: 18px;
  margin: auto;
}

.app.window-app.beneos_search_results {
  box-shadow: none;
  border: 0px solid;
  background: url(../ui/result_form_bg.webp) no-repeat;
  pointer-events: all;
  background-size: 720px 784px;
  /*border-image: url(../ui/result_form_bg.webp);
  background: none;
  border-image-slice: 59;
  border-image-width: 59px;
  border-image-outset: 0px;*/
  min-width: 720px;
  max-width: 720px;
  min-height: 790px;
  overflow-y: hidden;
  /*position: fixed;*/
  /* width: 540px !important; */
  /* height: 552px !important; */
}

.beneos_search_results::-webkit-scrollbar {
  display: none !important;
  width: 0px !important;
  height: 0px !important;
}

.beneos_search_results .window-header {
  overflow-y: hidden;
  border: 0px solid;
  /*display: none;*/
  pointer-events: all;
  height: 2.6rem;
  min-height: 2.6rem;
  text-shadow: 1px 1px 2px black;
}

.beneos_search_results .window-header .window-title {
  margin-top: 14px;
  margin-left: 16px;
  height: 2.6rem;
  /*display: none;*/
}

.beneos_search_results .window-header .header-button {
  display: none;
}

.bsr_title {
  transform: translate(0px, -26px);
  margin-left: 8px;
  margin-top: 12px;
  max-width: 230px;
  max-height: 20px;
  border-width: 0px;
  z-index: 999;
}

.beneos_search_results .window-content {
  background: none;
}

.bsr_result_box {
  margin-left: 8px;
  margin-top: 8px;
  margin-right: 8px;
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 804px;
  min-height: 804px;
  height: 804px;
}

.beneos-items-font-size {
  font-size: 0.75rem;
}

.item-properties-box label {
  color: #191813;
  display: inline;
  margin-bottom: 0px;
  margin-top: -4px;
}


#beneos-search-ui {
  width: 720px;
  max-width: 720px;
  align-content: center;
  align-items: center;
}

.search-engine-form {
  width: 720px;
  max-width: 720px;
  margin: auto;
}

.search-engine-section {
  width: 720px;
  max-width: 720px;
  height: 820px;
  max-height: 820px;
}

.bsr_item_title {
  background-image: url("../ui/result_title_bg_gradient.webp");
  /*background-position-x: 40px;*/
  width: 100%;
  display: flex;
  height: 1.9rem;
  max-height: 1.9rem;
  font-size: 1.1rem;
}


.bsr_top_border {
  position: relative;
  top: 3px;
  max-height: 3px;
}

.bsr_grid,
.bsr_grid-2col {
  display: grid;
  grid-column: span 2 / span 2;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 10px 0;
  padding: 0;
}

.bsr_grid-3col {
  grid-column: span 3 / span 3;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.item-container {
  background-color: #eaeaea;
  max-height: 128px;
  margin-bottom: 6px;
}

.item-container:hover {
  background-color: #d5c8c3;
}

.item-middle-line {
  min-height: 1.8rem;
  max-height: 1.8rem;
  margin-left: 2px;
}

.item-properties-box {
  background-color: #ebe8e0;
  color: #191813;
  border-width: 1px;
  border-color: #191813;
  border-style: ridge;
  margin-left: 6px;
  margin-top: 6px;
  margin-bottom: 6px;
  min-height: 1.6rem;
  max-height: 1.6rem;
  min-width: 20rem;
  max-width: 20rem;
  align-content: left;
  text-align: left;
  font-size: 0.9rem;
}

.beneos-search-attunement-button {
  color: black;
  font-size: 0.7rem;
  font-weight: normal;
  min-height: 1.6rem;
  max-height: 1.6rem;
  margin-top: 2px;
}

.item-properties-box-spells {
  margin-top: 4px;
  margin-bottom: 0px;
  color: black;
  min-width: 25.1rem;
  max-width: 25.1rem;
}

.item-properties-box-battlemaps {
  justify-content: center;
  min-width: 25rem;
  max-width: 25rem;
}

.item-properties-tokens {
  margin-top: 4px;
  margin-bottom: 8px;
  min-width: 25.1rem;
  max-width: 25.1rem;
  min-height: 1.4rem;
}


.token-button-rows {
  margin-top: 8px;
  margin-left: 8px;
  align-self: flex-start;
  align-items: start;
  align-content: start;
}

.item-attenument-box {
  align-content: center;
  text-align: center;
  background-color: #ebe8e0;
  color: #191813;
  border-width: 1px;
  border-color: #191813;
  border-style: ridge;
  margin-left: 6px;
  margin-top: 6px;
  margin-bottom: 6px;
  min-height: 1.6rem;
  max-height: 1.6rem;
  min-width: 5rem;
  max-width: 5rem;
}

.item-description-box {
  margin-left: 6px;
  margin-top: 6px;
  margin-bottom: 6px;
  max-height: 3.4rem;
  min-height: 3.4rem;
  min-width: 25.4rem;
  max-width: 25.4rem;
  text-align: left;
}

.item-description-box-spells {
  max-height: 3.7rem;
  min-height: 3.7rem;
  margin-top: 4px;
  margin-bottom: 6px;
  min-width: 25.1rem;
  max-width: 25.1rem;
}

.item-description-box-battlemaps {
  max-height: 3.7rem;
  min-height: 3.7rem;
  margin-top: 6px;
  margin-bottom: 6px;
}

.item-right-text-box {
  border: 0px solid;
  position: relative;
  border-width: Opx;
  margin-left: 0px;
  margin-bottom: 4px;
  margin-top: 4px;
  max-height: 26px;
  min-height: 26px;
  min-width: 8rem;
  max-width: 8rem;
  text-align: center;
}

.item-right-text-content {
  position: absolute;
  font-size: 0.65rem;
  border-width: 0px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -64%);
  color: black;
  white-space: nowrap;
}


.item-right-text-content-2 {
  position: absolute;
  transform: translate(-75%, 0%);
  border-width: 0px;
}

.flex-content-left {
  justify-content: flex-end;
  max-height: 26px;
}

.item-origin-icon {
  margin-top: 4px;
  align-content: center;
  width: 100%;
}

.item-origin-icon {
  align-self: center;
  border-width: 0px;
  max-width: 36px;
  max-height: 36px;
  margin-left: 4px;
  margin-right: 4px;
}

.bsr_bottom_border {
  transform: translate(128px, -11px);
  max-height: 3px;
  opacity: 0.2;
  max-width: 550px;
  z-index: 0;
}

.description-margin {
  margin-left: 4px;
}

.release-url {
  margin-left: 8px;
  color: #3e0706;
  align-self: flex-start;
}

.asset-short-desc {
  margin-left: 8px;
  color: #3e0706;
  align-self: flex-start;
  max-width: 25.1rem;
  min-width: 25.1rem;
  font-size: 0.9rem;
}

.release-url-color a,
.release-url a {
  color: #3e0706;
}

.beneos-search-header {
  justify-content: center;
  width: 100%;
}

.beneos_search_engine .window-header {
  background-color: #3e0706;
}

.beneos-search-margin {
  margin-left: 12px;
}

.search-label {
  margin-top: 4px;
  margin-right: 15px;
  text-align: right;
  margin-left: auto;
}

.flex-center-content {
  justify-content: center;
  align-items: center;
  text-align: center;
}

.beneos-selector {
  min-width: 8rem;
  max-width: 8rem;
}

.beneos-bottom-links {
  text-align: center;
  color: white;
  max-width: 12rem;
  align-self: center;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-self: center;
  justify-items: center;
}

.beneos-bottom-links a:link {
  color: white;
}

.beneos-bottom-links a:visited {
  color: white;
}

.beneos-search-text-input {
  align-items: center;
  align-self: center;
  align-content: center;
  flex-grow: 0;
}

.beneos-search-text-title {
  margin-right: 6px;
}

.beneos-search-text-input input {
  text-align: left;
}

.beneos-background-picture {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.beneos-background-color {
  background-color: black;
}


.search-first-line {
  margin-top: 18px;
}


.beneos-footer {
  width: 100%;
  height: 32px;
  top: 95vh;
}

.beneos-footer-container {
  background-color: rgba(62, 7, 6, 0.66);
  justify-content: center;
  align-items: center;
  align-content: center;
  align-self: center;
  flex-grow: 0;
  width: 100%;
  height: 100%;
}

.beneos-button-class,
.beneos-button-school,
.beneos-button-level {
  color: black;
}

.beneos-button-spell-type:hover,
.beneos-button-casting:hover,
.beneos-button-class:hover,
.beneos-button-school:hover {
  cursor: pointer;
}

.beneos-button-spell-type,
.beneos-button-casting {
  font-size: 0.6rem;
}

.beneos-search-overflow-section {
  margin-top: 4px;
}

#beneos-search-overflow {
  align-self: center;
  align-content: center;
  margin-top: 2px;
}

.h2-no-result {
  color: #3e0706;
  font-size: 3rem;
}

.text-no-result {
  color: #3e0706;
  font-size: 1.2rem;
  margin-top: 12px;
  margin-bottom: 12px;
}

.beneos-no-result-pic {
  width: 320px;
  border-width: 0;
}