@import "mixins";

.nav.nav-tabs {
    margin: 0 0 50px;
    border-bottom: 0;
    display: flex;
    > li {
        flex: 1 0;
        a {
            padding: 16px 10px 20px;
            margin: 0;
            border: 0 !important;
            border-top: 3px solid $secondary_color !important;
            border-radius: 0;
            font-size: 15px;
            font-weight: 600;
            background-color: $secondary_color;
            text-align: center;
            color: $dark;
            &:hover {
                color: $dark;
            }
        }
        &.active {
            a {
                border-top-color: $main_color !important;
                background-color: #fff;
                color: #273044;
            }
        }
    }
}

@include breakpoint(mobile) {
    .nav.nav-tabs>li:last-child a {
        border-bottom: 3px solid $main_color !important;
    }
}