/* Custom Piler CSS by cryMG */

:root {
  --color-theme: #007575;
  --color-theme-l: color-mix(in srgb, var(--color-theme), #fff 15%);
  --color-theme-d: color-mix(in srgb, var(--color-theme), #000 15%);
  --color-theme-disabled: color-mix(in srgb, var(--color-theme), #fff 50%);
}

h1, h2, h3, h4, h5, h6,
#logincontainer,
#menu,
.dropdown-menu {
  text-transform: none;
}

#logo-lg {
  width: 100%;
  max-width: 600px;
  text-align: center;
}

#logo-lg img {
  max-width: 100%;
  max-height: 100px;
}

.form-signin {
  max-width: 600px;
}

.compatibility {
  max-width: 600px;
  flex-basis: auto;
  font-size: 0.8em;
}

.menulink {
  padding: 10px 5px;
}

.menulink:first-child {
  padding: 0;
}
.menulink:first-child:hover {
  background-color: transparent;
}
.menulink:first-child .branding_logo {
  display: inline-block;
  max-height: 45px;
}

.menulink, .dropdown-menu {
  font-size: 16px;
}

#menu {
  background: var(--color-theme);
}

a {
  color: var(--color-theme);
}
a:hover {
  color: var(--color-theme-d);
}

.btn-primary {
  --bs-btn-bg: var(--color-theme);
  --bs-btn-border-color: var(--color-theme);
  --bs-btn-hover-bg: var(--color-theme-d);
  --bs-btn-hover-border-color: var(--color-theme-d);
  --bs-btn-active-bg: var(--color-theme-l);
  --bs-btn-active-border-color: var(--color-theme-l);
  --bs-btn-disabled-bg: var(--color-theme-disabled);
  --bs-btn-disabled-border-color: var(--color-theme-disabled);
}

.dropdown-menu li.dropdown-item:hover,
a.dropdown-item:hover {
  background-color: var(--color-theme);
}
