:root,
body,
#root {
  --b: 0, 12, 36;
  --header: 0, 12, 36;
  --hero: 252, 214, 13;
  --accent: 252, 214, 13;
  --oc-1: 16, 145, 33;
  --oc-2: 255, 215, 0;
  --tab-navigation: 0, 12, 36;
  --tab-navigation-sc: 255, 255, 255;
  --mobile-header-main-section-height: 49px;
  --mobile-header-navigation-height: 40px;
  --tab-navigation-height: 53px;
}

html,
body,
#root {
  min-height: 100%;
  margin: 0;
  background: #000c24;
  color: #fff;
  font-family: Roboto, Arial, Helvetica, sans-serif;
}

body {
  padding-bottom: 53px;
}

body.wnet-menu-open {
  overflow: hidden;
}

.wnet-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
  background: rgba(0, 0, 0, .62);
  opacity: 0;
  transition: opacity .22s ease;
}

.wnet-menu-overlay.is-open {
  opacity: 1;
}

.wnet-side-menu {
  position: absolute;
  inset: 0 auto 0 0;
  box-sizing: border-box;
  width: min(82vw, 300px);
  min-height: 100%;
  border-right: 1px solid rgba(252, 214, 13, .45);
  background: #000c24;
  transform: translateX(-100%);
  transition: transform .22s ease;
}

.wnet-menu-overlay.is-open .wnet-side-menu {
  transform: translateX(0);
}

.wnet-side-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  height: 58px;
  padding: 5px 10px 5px 7px;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.wnet-side-menu-head img {
  width: 138px;
  height: 46px;
  object-fit: contain;
}

.wnet-side-menu-head button {
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  font: 300 26px/32px Arial, sans-serif;
}

.wnet-side-menu nav {
  display: grid;
}

.wnet-side-menu nav a {
  box-sizing: border-box;
  min-height: 48px;
  padding: 0 17px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .86);
  font: 500 12px/48px Roboto, Arial, sans-serif;
  text-decoration: none;
}

.wnet-language-switch {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 16px;
  border-top: 1px solid rgba(255, 255, 255, .08);
}

.wnet-language-switch a {
  box-sizing: border-box;
  min-height: 42px;
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 4px;
  color: rgba(255, 255, 255, .78);
  font: 700 12px/14px Roboto, Arial, sans-serif;
  text-align: center;
  text-decoration: none;
}

.wnet-language-switch a span {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 400;
}

.wnet-language-switch a.active {
  border-color: #fcd60d;
  background: rgba(252, 214, 13, .12);
  color: #fcd60d;
}

.wnet-shell-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 951;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  height: 49px;
  padding: 0 14px 0 7px;
  background: #000c24;
}

.wnet-shell-logo {
  flex: 1 1 auto;
  min-width: 138px;
  height: 46px;
  margin-right: 5px;
  overflow: hidden;
}

.wnet-shell-logo img {
  display: block;
  width: 138px;
  height: 46px;
  object-fit: contain;
}

.wnet-shell-auth {
  display: flex;
  align-items: center;
  height: 28px;
}

.wnet-shell-login,
.wnet-shell-register,
.wnet-shell-menu {
  box-sizing: border-box;
  height: 28px;
  border: 0;
  font: 500 12px/28px Roboto, Arial, sans-serif;
  cursor: default;
}

.wnet-shell-login {
  width: 51.4px;
  padding: 0 10px;
  border: 1px solid #fcd60d;
  border-radius: 4px;
  background: transparent;
  color: #fff;
}

html[lang="de"] .wnet-shell-login,
html[lang="el"] .wnet-shell-login {
  width: 78px;
  padding: 0 8px;
  font-size: 10px;
}

.wnet-shell-register {
  width: 48.7px;
  margin-left: 12px;
  padding: 0 8px;
  border-radius: 4px;
  background: #fcd60d;
  color: #000205;
}

.wnet-shell-menu {
  width: 28px;
  margin-left: 6px;
  padding: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .1);
  color: rgba(255, 255, 255, .8);
  font-size: 20px;
  line-height: 24px;
  cursor: pointer;
}

.wnet-primary-navigation {
  position: fixed;
  inset: 49px 0 auto;
  z-index: 951;
  display: flex;
  width: 100%;
  height: 40px;
  overflow-x: auto;
  overflow-y: hidden;
  background: #000c24;
  scrollbar-width: none;
}

.wnet-primary-navigation::-webkit-scrollbar {
  display: none;
}

.wnet-primary-navigation a {
  flex: 1 1 20%;
  min-width: 0;
  box-sizing: border-box;
  height: 40px;
  padding: 0 3px;
  color: rgba(255, 255, 255, .8);
  font-size: 10px;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: inset 0 -2px 0 rgba(255, 255, 255, .05);
}

.wnet-primary-navigation a.active {
  color: #fff;
  background: rgba(255, 255, 255, .05);
}

.wnet-home-nav-collapsed .wnet-primary-navigation {
  transform: translateY(-40px);
}

@media (max-width: 340px) {
  .wnet-primary-navigation a {
    font-size: 8.5px;
    letter-spacing: -.25px;
  }
}

#root > .layout-header-holder-bc,
#root .layout-header-holder-bc {
  display: none !important;
}

#root .layout-content-holder-bc {
  padding-top: 89px !important;
}

.layout-header-holder-bc {
  height: 49px;
}

.layout-header-holder-bc .header-bc {
  position: fixed;
  inset: 0 0 auto;
  z-index: 950;
  height: 49px;
  overflow: visible;
  background: #000c24;
}

.layout-header-holder-bc .hdr-main-content-bc {
  min-height: 49px;
  padding: 0 14px 0 7px;
  background: #000c24;
}

.layout-header-holder-bc .hdr-logo-bc {
  width: 138px;
  height: 46px;
  object-fit: contain;
}

.layout-header-holder-bc .btn.sign-in,
.layout-header-holder-bc .btn.register {
  height: 28px;
  min-height: 28px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.layout-header-holder-bc .btn.sign-in {
  border-color: #fcd60d;
  background: transparent;
  color: #fff;
}

.layout-header-holder-bc .btn.register {
  background: #fcd60d;
  color: #000205;
}

.layout-header-holder-bc .hdr-toggle-button-bc {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: rgba(255, 255, 255, .8);
  background: rgba(255, 255, 255, .1);
}

.hdr-navigation-scrollable-bc-holder,
.hdr-navigation-scrollable-content,
.hdr-navigation-link-bc {
  height: 40px;
  background: #000c24;
}

.hdr-navigation-link-bc {
  padding-inline: 10px;
  color: rgba(255, 255, 255, .8);
  font-size: 10px;
}

.hdr-navigation-link-bc.active {
  color: #fff;
  box-shadow: inset 0 -2px 0 #fcd60d;
}

.tab-navigation-w-bc {
  position: fixed;
  inset: auto 0 0;
  z-index: 950;
  height: 53px;
  border-top: 1px solid rgba(255, 255, 255, .3);
  background: rgba(0, 12, 36, .9);
}

.tab-navigation-w-bc .tab-nav-item-bc {
  flex: 0 0 20%;
  width: 20%;
  padding: 4px 4px 8px;
  color: rgba(255, 255, 255, .5);
  font-size: 10px;
}

.tab-navigation-w-bc .tab-nav-item-bc.active {
  color: #fcd60d;
}

.tab-navigation-w-bc > #smart-panel-holder {
  position: static;
  display: flex;
  flex: 0 0 20%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  width: 20%;
  height: 52px;
  margin: 0;
  padding: 4px 4px 8px;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, .5);
  font-size: 10px;
  font-style: normal;
}

.tab-navigation-w-bc > #smart-panel-holder::before {
  display: block;
  height: 28px;
  font-size: 22px;
  line-height: 28px;
}

.tab-navigation-w-bc > #smart-panel-holder::after {
  display: block;
  overflow: hidden;
  width: 100%;
  content: "MENÜ";
  font: 400 10px/12px Roboto, Arial, sans-serif;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hdr-smart-panel-holder-arrow-bc {
  display: none !important;
}

.market-bc .market-odd-bc {
  color: #ffd700;
}

.market-bc.active {
  background: #fcd60d;
  color: #000205;
}

.horizontal-sl-item-bc.Soccer.active {
  background: #109121;
}
