button {
  font-family: var(--font-mono);
  font-size: 1rem;
  padding: 0.5rem 1rem;
  border: none;
  border-radius: var(--border-radius);
  background: none;
  background-color: aqua;
  color: inherit;
  cursor: pointer;
  transition: background 0.2s;
}

.gallery-home-row {
}
h5.grid2-title {
  color: blueviolet;
  background-color: rgb(247, 236, 137) !important;
  font-size: 1.5rem;
  font-weight: 500;
}

h5.grid3-title {
  color: blue;
  font-size: 1.2rem;
  font-weight: 500;
}
h5.grid4-title {
  /* color: blueviolet; */
  font-size: 1.2rem;
  font-weight: 500;
}
label {
  /* 
  font-size: 1rem;
  color: lightslategray;
  currently defined in layout.css */
}
.loading {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.5rem;
  color: aqua;
}
.pointer {
  cursor: pointer;
}
.srchwidget {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  background-color: blueviolet;
}
.srchwidget > div > div > label {
  color: white;
}

th {
  font-weight: 300;
  color: lightslategray;
}

thead {
  /* currently defined in layout.css */
}
tbody {
} /* currently defined in layout.css */
button.hamburger-menu {
  position: relative;
  z-index: 1;
}
ul.hamburger-menu {
  position: absolute;
  top: 10;
  left: 0;
  width: 200px; /* Or whatever width you want for the menu */
  /*height: 100vh; /* Make the menu the full height of the viewport */
  background-color: #fff; /* Or whatever background color you want for the menu */
  overflow-y: auto; /* Add a scrollbar if the menu content is taller than the viewport */
  transform: translateX(
    -100%
  ); /* Start the menu off the left edge of the viewport */
  transition: transform 0.3s ease-in-out; /* Animate the menu sliding in and out */
  list-style: none;
}

ul.hamburger-menu.open {
  transform: translateX(
    0
  ); /* Slide the menu in to cover the left edge of the viewport */
}
ul.hamburger-menu-2 {
  background-color: rgb(214, 219, 220);
  z-index: 1000;
  position: absolute;
  top: 20;
  left: 0;
  width: 20%;
  list-style: none;
}
ul.hamburger-menu-3 {
  background-color: rgb(214, 219, 220);
  z-index: 1000;
  list-style: none;
  width: 200px;
  margin-left: -60px;
  padding-left: 80px;
}
#menuLevel1 {
  background-color: rgb(214, 219, 220);
  z-index: 1000;
  list-style: none;
  width: 20%;
}

.bar1,
.bar2,
.bar3 {
  width: 30px;
  height: 5px;
  background-color: #333;
  margin: 3px 0;
  transition: 0.4s;
}

.change.bar1 {
  transform: rotate(-45deg) translate(-5px, 5px);
}

.change.bar2 {
  opacity: 0;
}

.change.bar3 {
  transform: rotate(45deg) translate(-5px, -5px);
}
.icon-bar {
  width: 22px;
  height: 2px;
  background-color: #333;
  display: block;
  margin: 4px 0;
}
.navbar-collapse {
  position: absolute;
  top: 50px; /* Adjust based on your navbar height */
  left: 0;
  width: 100%;
  background-color: white; /* Ensure the background covers content below */
  z-index: 1000; /* Ensure it appears above other content */
}
.dropdown-menu.open {
  display: block;
}

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --max-width: 1100px;
  --border-radius: 12px;
  --font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono",
    "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro",
    "Fira Mono", "Droid Sans Mono", "Courier New", monospace;

  --foreground-rgb: 0, 0, 0;
  --background-start-rgb: 214, 219, 220;
  --background-end-rgb: 255, 255, 255;

  --primary-glow: conic-gradient(
    from 180deg at 50% 50%,
    #16abff33 0deg,
    #0885ff33 55deg,
    #54d6ff33 120deg,
    #0071ff33 160deg,
    transparent 360deg
  );
  --secondary-glow: radial-gradient(
    rgba(255, 255, 255, 1),
    rgba(255, 255, 255, 0)
  );

  --tile-start-rgb: 239, 245, 249;
  --tile-end-rgb: 228, 232, 233;
  --tile-border: conic-gradient(
    #00000080,
    #00000040,
    #00000030,
    #00000020,
    #00000010,
    #00000010,
    #00000080
  );

  --callout-rgb: 238, 240, 241;
  --callout-border-rgb: 172, 175, 176;
  --card-rgb: 180, 185, 188;
  --card-border-rgb: 131, 134, 135;
}

@media (prefers-color-scheme: dark) {
  :root {
    --foreground-rgb: 255, 255, 255;
    --background-start-rgb: 0, 0, 0;
    --background-end-rgb: 0, 0, 0;

    --primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
    --secondary-glow: linear-gradient(
      to bottom right,
      rgba(1, 65, 255, 0),
      rgba(1, 65, 255, 0),
      rgba(1, 65, 255, 0.3)
    );

    --tile-start-rgb: 2, 13, 46;
    --tile-end-rgb: 2, 5, 19;
    --tile-border: conic-gradient(
      #ffffff80,
      #ffffff40,
      #ffffff30,
      #ffffff20,
      #ffffff10,
      #ffffff10,
      #ffffff80
    );

    --callout-rgb: 20, 20, 20;
    --callout-border-rgb: 108, 108, 108;
    --card-rgb: 100, 100, 100;
    --card-border-rgb: 200, 200, 200;
  }
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html,
body {
  max-width: 100vw;
  overflow-x: hidden;
}

body {
  color: rgb(var(--foreground-rgb));
  background: linear-gradient(
      to bottom,
      transparent,
      rgb(var(--background-end-rgb))
    )
    rgb(var(--background-start-rgb));
}

a {
  color: inherit;
  text-decoration: none;
}

@media (prefers-color-scheme: dark) {
  html {
    color-scheme: dark;
  }
}

h1 {
  color: blue;
  font-family: "Times New Roman", Times, serif;
  font-size: 50px;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-transform: capitalize;
  word-spacing: 10px;
  letter-spacing: 5px;
}

.center-block {
  flex: 0 0 auto;
  width: 100%;
}
div {
  display: block;
  margin: 5px 5px 5px 5px;
}
label {
  display: inline-block;
  margin-bottom: 0.5rem;
  color: blue;
}
.cbPicker {
  display: none;
}
.red {
  color: red;
}
a {
  color: blue;
  text-decoration: none;
}
.border {
  border: 1px solid black;
}
.border2 {
  border: 2px solid black;
}
th.paintingTable {
  text-align: left;
  padding: 8px;
  background-color: lightgray;
  border: #fcd5fae6 !important;
}
.card-img-top {
  width: 100%;
  height: auto;
  object-fit: cover;
  max-width: 100%;
  max-height: 100%;
}
.z-100000 {
  z-index: 100000;
}
.z-10000 {
  z-index: 10000;
}
.z-1000 {
  z-index: 1000;
}
.z-100 {
  z-index: 100;
}
.z-10 {
  z-index: 10;
}
.z-1 {
  z-index: 1;
}
.z-0 {
  z-index: 0;
}

/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/55c55f0601d81cf3-s.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/26a46d62cd723877-s.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/97e0cb1ae144a2a9-s.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/581909926a08bbc8-s.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/df0a9ae256c0569c-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/6d93bde91c0c2823-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/a34f9d1faa5f3315-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: 'Inter Fallback';src: local("Arial");ascent-override: 90.44%;descent-override: 22.52%;line-gap-override: 0.00%;size-adjust: 107.12%
}.__className_d65c78 {font-family: 'Inter', 'Inter Fallback';font-style: normal
}

.error {
  color: red;
}
.bordered {
  border: 1px solid black;
}

.pad-10 {
  padding: 10px;
}
.margin-10 {
  margin: 10px;
}
.borders {
  border: 1px solid black;
}
table.borders th,
table.borders td {
  border: 1px solid black;
  padding: 5px;
}
/* table > tbody > tr:nth-child(odd) > td {
  background-color: #eee;
}
table > tbody > tr:nth-child(even) > td {
  background-color: #ccc;
} */
.center-text {
  text-align: center;
}
.btn-text {
  color: #00f;
}
.primaryRow {
  background-color: rgb(137, 230, 247) !important;
}
th {
  background-color: rgb(247, 236, 137) !important;
}
.blue {
  color: blue;
}