html, body {
    background-color: var(--c-background);
    font-family: "Roboto", Arial, sans-serif;
    font-family: var(--c-font), Arial, sans-serif;
    font-size: 13px;
    line-height: 1;
    height: 100%;
    margin: 0;
    position: relative;
    max-width: 100% !important;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
}

ul {
    list-style-type: none;
}

.body li {
    cursor: pointer;
    padding: 4px;
    white-space: nowrap;
}
body .content-loader:before {
    background-color: var(--c-primary);
    background-image: url(/v1.001/r/logo-maxi90.png);
    background-repeat: no-repeat;
    background-position: 50% 45%;
    background-size: 160px auto
}

body .content-loader:after, body .content-loader:not(:required):after {
    width:100px;
    height:63px;
    margin-top: 5em;
    background-image:url(/v1.83/r/images/site/loader/footballerloader.gif);
    background-size:100px 63px;
    display:flex;
    animation:none;
    transform:rotate(0deg) translate(-50%, 0%);
    
    -webkit-box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgb(255, 255, 255,0.75) 1.1em -1.1em 0 0;
    box-shadow:none;
}
#root app-widget-host {
    width: 100%;
    height: 100%;
    display: inherit;
    flex-direction: inherit;
    align-items: inherit;
    justify-content: inherit;
    flex-wrap: inherit;
}

.doc > app-widget-host > app-block {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

.column {
    display: flex;
    flex-direction: column;
}

.row {
    display: flex;
    flex-direction: row;
}

.height-full {
    height: 100%
}

width-full {
    width: 100%
}

.mobile .body {
    margin-top: 54px;
}

app-image {
    display: flex;
}

app-image img {
    width: 100%;
    height: auto
}

.generic-form {
    display: flex;
    flex-direction: column;
    max-width: 720px;
    width: 100%;
    text-align: right;
}

#root .generic-form input {
    color: var(--c-primary-c)
}

.generic-form label {
    padding: 8px;
    display: block;
    text-align: left
}

.generic-form button[type="submit"] {
    margin-top: 8px;
    background-color: var(--c-primary-b)
}

.ui-calendar {
    display: flex;
}

#root .ui-calendar button {
    background-color: var(--c-primary-c)
}

.desktop ::-webkit-scrollbar {
    width: 8px;
    height: 5px;
}

::-webkit-scrollbar {
    height: 4px;
    /* height of horizontal scrollbar */
    width: 4px;
    /* width of vertical scrollbar */
}

::-webkit-scrollbar-track {
    border-radius: 0;
}

::-webkit-scrollbar-thumb {
    border-radius: 2px;
}

::-webkit-scrollbar-track {
    border-radius: 0;
    background: var(--scrollbar-track);
}

::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background: var(--scrollbar-thumb);
}

.desktop ::-webkit-scrollbar-thumb:vertical {
    background-color: var(--scrollbar-thumb);
    border: solid 2px var(--scrollbar-thumb);
    border-top: none;
    border-bottom: none;
    border-radius: 3px
}

.desktop .body ::-webkit-scrollbar-thumb:vertical {
    background-color: var(--scrollbar-thumb);
    border: solid 2px var(--scrollbar-thumb);
    border-top: none;
    border-bottom: none;
    border-radius: 3px
}

.desktop :hover::-webkit-scrollbar-thumb:vertical {
    background-color: var(--scrollbar-thumb);
}

.desktop ::-webkit-scrollbar-thumb:vertical:hover {
    background-color: var(--c-primary-c);
    border: solid 2px var(--c-primary-c);
    border-top: none;
    border-bottom: none;
}

.desktop ::-webkit-scrollbar-thumb:horizontal {
    border-radius: 2px;
    background-color: var(--scrollbar-thumb);
}

.desktop .body.scroll-independent .left-sidebar, .desktop .body.scroll-independent .content > app-widget-host, .desktop .body.scroll-independent .right-sidebar {
    max-height: calc(100vh - (var(--c-header-top) + var(--c-header-bottom) + 8px));
    min-height: calc(100vh - (var(--c-header-top) + var(--c-header-bottom) + 8px));
    overflow: hidden;
    overflow-y: scroll;
}

.desktop .body .left-sidebar {
    flex: 0 0 var(--c-l-sidebar-min);
    max-width: var(--c-l-sidebar-max);
    min-width: var(--c-l-sidebar-min);
    margin-left: 8px;
}

.desktop .body .content {
    min-width: 320px;
    margin: 0;
    flex: 5 1 480px;
}

#root .app-body .mobile .content {
    min-height: calc(100vh - var(--c-header-mobile))!important;
}

.desktop .body .content.collapsible {
    flex: 1 5 360px;
}

.desktop .body .right-sidebar {
    flex: 1 0 var(--c-r-sidebar-min);
    min-width: var(--c-r-sidebar-min);
    max-width: var(--c-r-sidebar-max);
}

app-block.footer {
    display:flex;
    flex-direction: column;
}

#root .footer {
    background-color: var(--c-primary);
    color: var(--c-white);
    font-size: 1.1rem;
    width:100%;
    padding-bottom: 56px;
}

#root .desktop .footer {
    padding: 36px 15%;
    margin-top: 8px;

}

#root .footer .logo img {
    display: block;
    margin: 10px auto;
    width: 120px;
    height: 65px;
    object-fit: contain;
}

#root .beta-warning div {
    text-align: center;
}

#root .footer .links > app-widget-host {
    display: inline-block;
    padding: 6px 12px;
    color: #d8d8d8;
    text-align: center;
}

#root .footer .links .link {
    display: inline-block;
    padding: 6px 12px;
    color: #d8d8d8;
}

#root .footer .copyright {
    color: #d8d8d8;
    text-align: center;
    padding: 10px;
}

#root .footer .copyright div {
    text-align: center
}

#root .mobile .footer app-language {
    max-width: 140px;
    width: 100%;
    margin: 0 auto
}

#root .mobile .beta-warning {
    margin: 12px 0px;
}

#root .footer .save-to-device.link {
    position: relative;
    display: block;
    width: 150px;
    margin: 8px auto;
}

#root .device-mobile.os-android .footer .save-to-device.save-to-ios.link, #root .device-tablet.os-android .footer .save-to-device.save-to-ios.link {
    display: none;
}

#root .mobile .footer app-time .filter-time {
    text-align: center;
    padding-top: 10px;
}

.unread-messages {
    width: 24px;
    height: 24px;
    position: relative;
    background-image: url(/v1.001/r/images/site/icons/envelope.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.unread-messages data-view[value="user.messages.unread"] {
    position: absolute;
    width: 15px;
    height: 15px;
    background-color: var(--c-red);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    border-radius: 50%;
    right: -8px;
}

#root .default-sport {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 22px;
}

#root .nav-sport-wrapper .nav-sport .nav-sport-icon, #root .default-sport-icon, #root .sport-icon {
    background-size: var(--c-icon-width) var(--c-icon-width);
    background-repeat: no-repeat;
    background-position: center center;
    height: var(--c-icon-width);
    width: var(--c-icon-width);
}

#root .events-tournament-header .events-category-tournament-names {
    display: inline-flex;
    width: unset;
    overflow: hidden;
    flex-direction: row;
}

#root .live-betting-menu {
    display: flex;
    height: 30px;
    position: sticky;
    top: 0px;
    z-index: 20
}

#root .content .menu {
    width: 100%;
    background-color: var(--c-primary-c);
    border-bottom: 1px solid var(--c-primary-b)
}

#root .content .menu a {
    color: var(--c-white);
    padding: 0 8px;
}

#root .content .menu a.active {
    color: var(--c-white-e);
    background-color: var(--c-primary-b);
    font-weight: 700;
}

#root .content .menu li {
    padding: unset;
}

#root .content .menu li: hover {
    background-color: var(--c-primary-b)
}

#root .content-header {
    height: 36px;
    background-color: var(--c-primary);
    position: sticky;
}

#root .desktop .content-header {
    top: 0px;
    z-index: 20
}

#root .desktop .content-header.live-match {
    top: 30px;
}

#root .mobile .content-header {
    top: var(--c-header-mobile);
    z-index: 20;
    background-color: var(--c-primary-b)
}

#root .betslip-panel-menu {
    background-color: var(--c-primary-c);
    color: var(--c-white);
    font-size: 1.1rem
}

#root .betslip-panel-menu-item {
    width: 50%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#root .betslip-panel-menu-item.betslip {
    border-right: 1px solid var(--c-white-e)
}
#root .betslip-panel-menu-item app-openbets-counter.openbets-counter-container {
    margin-left: auto;
    margin-right: 5px;
}

#root .betslip-panel-menu-item app-openbets-counter.openbets-counter-container .bets-number-container:not(.no-open-bets) {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--c-primary-d);
    border-radius: 50%;
    font-size: 0.9em;
}
#root .betslip-panel-menu-item.bet-history .menu-item-content {
    margin-left: auto;
}
#root .betslip-panel-menu-item.betslip .menu-item-content {
    margin-right: auto
}

#root app-betslip-counter {
    margin-right: auto
}

#root app-betslip-counter .bets-number {
    min-width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    background-color: var(--c-shade);
    margin: 0px 8px;
    font-weight: bold
}

#root app-betslip-counter .betslip-counter-name {
    display: none
}

#root app-betslip-clear {
    min-width: 40px
}

#root app-betslip-clear label {
    display: none
}

#root app-betslip-clear .betslip-clear-wrapper button {
    background: url(/v1.02/r/images/site/icons/Trash_Can.svg) center center no-repeat;
    color: var(--c-shade);
    border: 1px solid var(--c-shade);
    height: 24px;
    width: 24px;
    opacity: 0.7;
    margin-right: 8px;
    background-color: var(--c-shade);
}

#root .checkbox-wrapper input.check-box:checked, #root .nav-category.checked .nav-category-selector.checked, #root .nav-sport-selector.checked .nav-category-selector, #root .nav-sports .nav-tournament .nav-tournament-selector.checked {
    background-image: url(/v1.06/r/images/site/icons/Checkbox-On.svg);
    background-position: center center;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: var(--c-shade);
}

body#root .ui-paginator .ui-paginator-pages .ui-paginator-element {
    color: var(--c-primary-c);
}

body#root .ui-paginator .ui-paginator-pages .ui-paginator-page.ui-state-active {
    background-color: var(--c-primary-c);
    color: var(--c-white-e);
}

#root .mobile .navigation-link {
    height: 45px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--c-tint-b)
}

#root .mobile .navigation .featured-league-sport {
    display: flex;
    margin-left: auto;
}

#root .mobile .navigation .featured-leagues-header {
    border-radius: unset
}

#root .mobile .navigation .featured-leagues-content {
    /* display: none; */
}

#root .mobile .navigation  .featured-leagues-content {
    /* display: flex; */
    background-color: transparent;
}

#root .mobile .navigation .featured-league {
    height: 45px;
    display: flex;
    align-items: center;
    border: 1px solid #5db2f563;
    background: linear-gradient( 80deg , var(--c-shade-b), var(--c-primary-b));
}

#root .mobile .navigation .featured-league a {
    width: 100%;
    color: var(--c-white);
}

#root .show-on-collapse {
    display: none
}

@media screen and (max-width: 1500px) {
    #root .show-on-collapse {
        display:flex;
        width:100%
    }

    #root .content.collapsible {
        display: none
    }
}

#root .signup-menu .signup-menu-item {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

#root .signup-menu .signup-menu-item div {
    text-align: center
}

#root app-login, #root app-register {
    padding: 24px;
    display: block
}

#root app-login .form-row, #root .mobile app-login.login-form form .form-row {
    display: flex;
    flex-direction: row;
    margin-top: 8px;
}

#root app-login.login-form .form-row .form-label {
    display: none;
}

#root app-login .form-row:not(.error-row)::before {
    content: "";
    width: 28px;
    height: 28px;
    background-color: var(--c-primary);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 28px;
}

#root app-login .form-row.username-row::before {
    background-image: url(/v1.001/r/images/site/icons/User_Username.svg)
}

#root app-login .form-row.password-row::before {
    background-image: url(/v1.001/r/images/site/icons/User_Password.svg)
}

#root app-login button[type="submit"] {
    margin: unset;
    width: 100%;
}

#root app-login form ui-button {
    margin-top: 8px;
}

#root .login-popup .forgot-password-link {
    padding: 0px 24px 8px
}

#root .login-popup .forgot-password-link > div {
    text-align: center;
}

#root app-register #general .form-row {
    display: flex;
    flex-direction: column;
}

#root .desktop app-register {
    max-height: 50vh;
    overflow: auto;
}

#root app-register #communication > div:not(.fld-marketingsubscribe) {
    padding-left: 28px;
}

#root app-register #communication app-checkbox-field .checkbox-wrapper {
    align-items: center;
}

#root app-register app-checkbox-field .checkbox-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
}

#root app-register #communication app-checkbox-field p-checkbox {
    margin-right: 5px;
    position: relative;
}

#root app-register p-checkbox {
    position: relative;
}

#root app-register .required {
    margin-left: 5px;
}

#root app-register app-checkbox-field .field-label {
    text-align: left;
    padding-left: 5px;
}

#root app-register form .form-element-error {
    padding: 5px;
    width: 100%;
    border-bottom: 1px solid var(--c-red);
    position: relative;
    overflow: hidden;
}

#root app-register form .form-element-error::before {
    content: "";
    width: 10px;
    height: 10px;
    background-color: var(--c-red);
    position: absolute;
    left: 5px;
    bottom: -5px;
    transform: rotate(45deg)
}

#root app-register .reset-next-buttons-wrapper {
    margin-bottom: 5px;
}

#root app-register .reset-next-buttons-wrapper button {
    margin: unset;
    width: calc(50% - 5px);
}

#root app-register .reset-next-buttons-wrapper button.button-reset-register, #root app-register .reset-next-buttons-wrapper button.button-reset-register-no {
    background-color: var(--c-primary)
}

#root app-register .reset-next-buttons-wrapper button.button-reset-register-yes {
    background-color: var(--c-primary-c)
}

#root app-register .reset-next-buttons-wrapper ui-button:first-child, #root app-register .reset-register-confirm + ui-button {
    margin-right: 5px
}

#root app-register .reset-register-confirm {
    margin-bottom: 5px;
    text-align: center;
    font-size: 1.1rem
}

#root app-forgot-password {
    width: 100%;
    padding: 24px;
}

#root app-forgot-password > div {
    width: 100%;
}

#root app-forgot-password #forgotpass .form-row {
    display: flex;
    flex-direction: column
}

#root .page-header {
    text-align: center;
    padding: 12px;
    font-weight: 700;
    font-size: 1.5rem
}

#root .page-header + app-login, #root .page-header + app-register {
    padding-top: 0px;
}

#root .homepage-links {
    padding: 4px 0px;
    background-color: var(--c-primary);
}

#root .homepage-link {
    width: 50%;
    display: flex;
    height: 35px;
    align-items: center;
    background-color: var(--c-primary-c);
    font-size: 1.1rem;
    color: var(--c-white);
    margin: 2px 2px 0 2px;
    position:relative;
}

#root .homepage-link div {
    text-indent: 38px;
}

#root .homepage-link::before {
    content: '';
    width: 20px;
    height: 20px;
    display: inline-block;
    top: 8px;
    left: 4px;
    margin: 0 2px;
    position: absolute;
    opacity: 0.8;
}
#root .homepage-link.todays-coupon::before {
    background: url(/v1.001/r/site/icons/sport-today.svg) center center no-repeat;
}
#root .homepage-link.live::before {
    background: url(/v1.001/r/site/icons/live-icon-maxi.svg) center center no-repeat;
   
}
.goto {
    width: 100%;
    height: 40px;
    min-height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    z-index: 800;
    overflow: visible;
    background-color: #d6d6d6;
    border-bottom: 1px solid rgb(68 99 118);
    color: #446376;
}

#root .info-warn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    max-width: 100%;
    font-size:1.2rem
}
#root .desktop .info-warn {
    background-color: #eaeaea;
    color: #001e2e;
}
#root .info-warn div {
    max-width: 700px;
}
#root .site-text-content {
    padding:10px;
}
#root .antepost.side-link div {
    padding:10px;
    width: 100%;
    border-top: 1px solid var(--c-shade-b);
    border-bottom: 1px solid var(--c-shade-b);
    position: relative;
    background-color: #8b8f11;
    color: var(--c-text-light-e);
}
#root .antepost.side-link div::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    width: 32px;
    height: 100%;
    background-image: url(/v1.37/r/images/site/icons/Arrow_Down.svg);
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(-90deg);
}
:lang(en)  .image-block:not(.lang-en),
:lang(de)  .image-block:not(.lang-ge),
:lang(el)  .image-block:not(.lang-en),
:lang(tr)  .image-block:not(.lang-en) {
    display:none;
}
#root .side-banner img {
    width: 100%;
   
}
#root .side-banner img {
    border-radius: 4px;
    margin-bottom: -3px
}
.side-banner {
    margin-top: 8px;
}
.site-menu {
width:100%;
    overflow:hidden;
}
.site-menu ul {
overflow:auto;
    overflow-y:hidden;
    background-color:var(--c-primary-c)
}
#root .site-menu ul li span{
    padding:5px;
    height:30px;
    display:flex;
    align-items:center;
    color:var(--c-text-light-e);
    white-space:nowrap;
    
}
#root  .site-menu ul li a{
    border-top:4px solid var(--c-primary-c);
}
#root  app-menu.site-menu ul li .active,
#root .content app-menu.site-menu ul li .active{
    background-color:unset;
    border-top:4px solid var(--c-primary-d);
    border-right:4px solid var(--c-primary-c);
    border-left:4px solid var(--c-primary-c);
}
.ct-live-0 .live {
    display:none;
}
.mobile .sports-search-block div{
    padding:15px 8px;
    background-color:var(--c-primary-c);
    color:var(--c-white-e);
    position:relative;
}
.mobile .sports-search-block div::after {
    content:"";
    width:24px;
    height:24px;
    position:absolute;
    background-image:url(/v1.002/r/images/site/icons/Arrow_Down.svg);
    background-position:center;
    right:5px;
    top:50%;
    border-radius:50%;
    background-color:var(--c-shade-b);
    transform:translate(0%,-50%) rotate(-90deg)
}
#root .mobile.view-page-my-bets .content-header {
    background-color:var(--c-primary-c)
}
.license {
    text-align:center;
}
#root .homepage-link.antepost  {
    
    width:100%;
}
#root .homepage-link.antepost div {
    width:100%;
    height: 100%;
    display:flex;
    align-items:center;
}
#root .homepage-link.antepost:before {
  background-image:url(/v1.012/r/images/flags/featured.png);
background-size:20px;
}
.payment-frame {
    position:relative;
    min-height:100vh;
}
.payment-frame iframe {
    position:absolute;
    width:100%;
    height:100%;
}
.notice {
    width:100%;
    display:none;
}
.warning {
    background-color:orangered;
    color:var(--c-white-e);
    font-weight:700
}
.danger {
    background-color:var(--c-red)
}
.notice-visible .notice {
    display:flex;
    overflow:hidden;
}
.notice-visible .notice div{
    display:flex;
    padding:8px;
    align-items:center;
    justify-content:center;
    text-align:center;
    width:100%;
    max-height:50px;
}
#root .desktop .notice-visible.header{
    height:144px;
}
#root .notice-visible ~ .body .left-sidebar .hides-sidebar {
    top:calc(138px - 30px)
}

#root .mobile .notice-visible .notice {
    position:fixed;
    top:54px;

}
#root .mobile .notice-visible ~ .body {
    margin-top: 104px;
}

#root .notice-visible ~ .body .league-select-page .league-select-go.has-options {
    opacity: 1;
    top: 150px;
}
.sticky-menu {
    position:fixed;
    bottom:0px;
    width:100%;
    left:0px;
    background-color:var(--c-primary);
    z-index:1000;
    color:var(--c-white)
}
#root .sticky-menu > app-widget-host {
   
    height:56px;
}
.sticky-menu .sticky-menu-tab {
    flex:1;
    height:100%;
    justify-content:center;
    align-items:center;
}
.sticky-menu .sticky-menu-tab > app-widget-host {
    justify-content:center;
    height:100%;
    padding:5px
}
.sticky-menu .sticky-menu-tab .sticky-menu-tab-icon {
    width:24px;
    margin-bottom:2px;
}
#root .content .antepost-menu .menu {
    background-color:transparent;
}
#root .content .antepost-menu {
    padding:5px;
}
#root .content .antepost-menu .menu {
    max-width:200px;
    width:100%;
    margin:0 auto;
    border:1px solid var(--c-shade);
    border-radius:5px;
    overflow:hidden;
}
#root .content .antepost-menu .menu li {
    width:50%;
}
#root .content .antepost-menu .menu li a {
    min-height:35px;
    display:flex;
    align-items:center;
    justify-content:center;
   color: var(--c-text-dark-e); 
}
#root .content .antepost-menu .menu li a.active {
    border-radius:5px;
    border:0;
    color:var(--c-text-light-e)
}
.euro-banner {
   padding-top: 10%;
   background-image:url(/v1.071/r/images/site/banners/Club_WC_Header.webp);
   background-size:cover;
   /* background-position: center 83%; */
   background-repeat:no-repeat;
}
.mobile .euro-banner {
    padding-top: 30%;
    background-image:url(/v1.071/r/images/site/banners/Club_WC_Header_Mobile.webp);
    background-size:cover;
    /* background-position: center 83%; */
    background-repeat:no-repeat;
}
.selected-match {
    background-color: #bef78b;
}
li:empty {
  display: none;
}