.tab-menu-wrap, #content .tab-menu-wrap {
    ul {
        margin: 0;
        font-size: 85%;
        position: relative;
        display: block;

        li {
            margin: 0 2em 0 0;
            display: inline-block;

            &#topMenuStartBetting {
                float: right;
                margin: 0 0 0 2em;

                ul {
                    text-align: right;

                    li {
                        margin: 0 0 0 2em;
                    }
                }
            }
            a {
                font-weight: normal;
                color: $black;
                line-height: 2;
                top: 1px;
                text-decoration: none;
                display: inline-block;
                position: relative;
                text-transform: capitalize;

                a.a-active, span.a-active {
                    color: $white;
                }
            }
            ul.sub_items {
                margin-top: 1px;
                display: none;

                li.sub_item {
                    font-size: 100%;
                }
            }
            ul.tm-ul-2 {
                margin-top: 1px;
                display: none;
                padding: 0;
                line-height: 2;

                li.tm-li-2 {
                    font-size: 100%;
                    margin-right: 20px;
                }
            }
        }
        li.hover {
            ul {
                display: block;
                position: absolute;
                left: 1px;
                width: 99%;
                z-index: 10;
                background: $white;

                li {
                    a, span {
                        top: auto;
                        border: 0;
                        color: $black;
                        display: inline-block;
                    }
                    a.a-active, span.a-active {
                        color: $secondaryBrandColor;
                    }
                }
            }
        }
        li.active {
            @extend li.hover;

            a {
                color: $secondaryBrandColor;
            }
            ul {
                z-index: 1;

                a {
                    background: none;
                }
            }
        }
    }
}

#content {
    ul.tm-ul {
        @include tab-list;
        margin-bottom: 2em;
        white-space: nowrap;
    }
    .tab-with-subsection, .content-tab-container {
        .tm-ul {
            border-bottom: 1px solid $black;
        }
    }
}

.has-tabs {
    border: none;
    border-radius: 0;
    margin: 0;
    padding: 0;

    /* fix jquery UI tabs to look more like our tabs */
    ul.ui-tabs-nav {
        @include tab-list;
        font: inherit !important;

        li {
            float: left;
        }
    }
}

#content .page-section {
    width: 100%;

    & > .tab-menu {
        width: 100%;
        height: 32px;
        background-color: $fillColor;
        border-bottom: 1px solid $borderColor;

        ul.tm-ul {
            margin: 0;
            background-color: $fillColor;
            border-bottom: 1px solid $borderColor;
            font-size: 100%;

            li {
                margin-right: 2em;
                color: $secondaryBrandColor;

                a:hover {
                    text-decoration: none;
                }
                &.active {
                    background: none;

                    a {
                        color: $secondaryBrandColor;
                    }
                }
            }
        }
        ul.tm-ul-2 {
            li.active {
                a.tm-a-2 {
                    color: $black;
                    background: none;
                }
                a.a-active {
                    color: $secondaryBrandColor;
                    background: none;
                }
            }
        }
    }
    & > .tab-content-wrapper {
        width: 100%;
        margin: 0 auto;
        margin-top: 2em;

        .full-width-content {
            width: 100%;
        }
    }
}

@media screen and (max-width: 768px) {
    #content .tab-with-subsection {
        .tm-ul {
            .tm-li {
                margin: 0;
                padding: 0;
                display: block;
                text-align: center;

                .tm-ul-2 {
                    width: 100% !important;
                    margin: 0 !important;
                    left: 0;

                    .tm-li-2 {
                        display: none;
                        padding-top: 5px;
                        margin: 0;

                        &:last-child {
                            padding-bottom: 5px;
                        }
                    }
                }
                &.active {
                    .tm-ul-2 .tm-li-2 {
                        display: block;
                    }
                }
            }
        }
    }
    ul.tm-ul-2 {
        display: block !important;
        top: 0 !important;
        position: relative !important;
    }
    ul.tm-li-2 {
        display: block !important;
    }
    li.tm-li.hover ul {
        display: block;
        position: relative !important;
        left: 0 !important;
        width: 99% !important;
        z-index: 1 !important;
        margin-top: 0 !important;
        background: $white;
        margin-left: 1px;
    }
    #page-wrapper #content .page-section > .tab-menu ul.tm-ul li.active a {
        background: none;
    }
}
