.blook-navbar-section{
    position: relative;
    a{
        color: $color_white;
    }
    button{
        height: 40px;
        padding: 0;
        border-radius: 0;
        border: 0;
        line-height: 40px;
        cursor: pointer;
       
    }
    .blook-site-feature{
        display: flex;
        flex-wrap: wrap;
        button{
            width: 100%;
            position: relative;
            &:after{
                content: '';
                width: 100%;
                height: 4px;
                position: absolute;
                left: 0;
                bottom: 0;
                background-color: $color_black
            }
        }
        .blook-feature{
            &:not(.blook-trending){
                width: 40px;
                button{
                    background-color: $color_light_gray;
                   
                }
                
            }
            &.blook-trending{
                width: 140px; 
            }
            &.blook-search{
                button{
                    background-color: $color_white;
                }
            }
           
        }
        .blook-trending{
            button{
                background-color: $color_black;
                color: $color_white;
                span{
                    display: inline-block;
                    padding: 0 5px;
                }
            }
        }
        
    }
    .main-navigation{
        @include media(lg){
            padding-left: 30px;
        }
        button{
            width: 40px;
            background-color: $color_black;
            color: $color_white;
            @include media(lg){
                display: none;
            }
        }
    }
}
.blook-navbar-layout-1{
    .main-navigation{
        flex: 0 0 calc(100% - 220px);
        max-width: calc(100% - 220px);
    }
    .blook-site-feature{
        flex: 0 0 220px;
        max-width: 220px;
    }
}
.blook-navbar-layout-2{
    .main-navigation{
        flex: 0 0 calc(100% - 260px);
        max-width: calc(100% - 260px);
    }
    .blook-site-feature{
        flex: 0 0 260px;
        max-width: 260px;
        .blook-mode{
            order: 1;
        }
       
        .blook-search{
            order: 2;
        }
       
        .blook-newsletter{
            order: 3;
        }
        .blook-trending{
            order: 4;
        }
    }
}