.filter_btn, .mobile_filter_btn{
    background-color : #ffffff;
    color            : #BD8B13;
    border           : 1px solid #BD8B13;
    border-radius    : 50px;
    padding          : 0 0px 0 15px;
    min-width        : 120px;
    margin-bottom    : 1rem;
}

.filter-row-container{
    position: relative;
    bottom: 3.5rem;
}

.filter_btn .stripe,
.mobile_filter_btn .stripe{
    content          : "";
    height           : 1px;
    position         : absolute;
    background-color : #BD8B13;
    width            : 10px;
    top              : 20px;
    left             : 18px;
}

.filter_btn .stripe::before,
.mobile_filter_btn .stripe::before{
    content          : "";
    width            : 20px;
    top              : -5px;
    left             : -5px;
    height           : 1px;
    position         : absolute;
    background-color : #BD8B13;
}

.filter_btn .stripe::after,
.mobile_filter_btn .stripe::after{
    content          : "";
    width            : 4px;
    top              : 3px;
    left             : 3px;
    height           : 1px;
    position         : absolute;
    background-color : #BD8B13;
}


.secondary_filter_btn{
    min-width     : 100px;
    border-radius : 50px;
    border        : 1px solid black;
    color         : black;
    line-height   : 20px;
    font-size     : 11px;
    padding-left  : 10px;
    padding-right : 10px;
}

input[type=range]:disabled {
    opacity: 0.5;
    pointer-events: none;
}

.overlay{
    position: absolute;
}

.overlay:target{
    visibility : visible;
    opacity    : 1;
}

.popup{
    padding    : 20px;
    background : #fff;
    border     : 1px solid #BD8B13;
    width      : 450px;
    position   : relative;
    transition : all 5s ease-in-out;
    bottom     : 31.5rem;
    z-index    : 9;

}

#range1, #range2, .price-dash{
    color : #BD8B13;
}

.popup h2{
    /*margin-top     : 0;*/
    color          : #333;
    text-align     : start;
    font-size      : 17px;
    text-transform : capitalize;
}

.price_filter_btn{
    min-width        : 97px;
    border-radius    : 50px;
    color            : black;
    line-height      : 34px;
    font-size        : 12px;
    padding-left     : 10px;
    padding-right    : 10px;
    box-shadow       : 0px 2px 15px rgba(0, 0, 0, 0.1);
    height           : 35px;
    background-color : #ffffff;
}

.filters_btn_wrapper{
    position : absolute;
    bottom   : 5rem;
}

.filter_btns_wrapper{
    position : relative;
}

.price_filter_btn.checked{
    border : 2px solid #BC8A15;
}

.popup .close{
    position        : absolute;
    top             : 20px;
    right           : 30px;
    transition      : all 200ms;
    font-size       : 30px;
    font-weight     : bold;
    text-decoration : none;
    color           : #000000;
}


.popup .content{
    width  : 100%;
    height : 100%;


}

.close-icon{
    margin-right : 5px;
    cursor       : pointer;
}

@media screen and (max-width : 769px){
    .box{
        width : 70%;
    }

    body.no-scroll{
        overflow : hidden; /* Prevent scrolling */
    }

    .popup .content{
        margin-top : 2rem;
    }

    .mobile_filter_btn{
        margin-bottom : 0px;
        min-width     : 100px;
    }

    .filter_btn{
        display : none;
    }

    .popup{
        width          : 100% !important;
        margin         : 0;
        top            : 4.5rem;
        bottom         : 0;
        left           : 0;
        right          : 0;
        display        : flex;
        position       : fixed;
        z-index        : 100000;
        border         : none;
        flex-direction : column;
        padding        : 40px;
        box-sizing     : border-box;
        height         : calc(100vh - 72px);
        overflow-y     : auto;
    }

    .popup .button-row{
        margin-top : 5rem;
    }

    .popup .close{
        border        : 1px solid #747474;
        border-radius : 50%;
        padding       : 1px 8px;
        top           : 30px;
    }

    .filter_btn{
        position : relative;
        top      : -41rem;
        left     : 12rem;
    }

    /*.values{*/
    /*    margin-top : 2rem;*/
    /*}*/
    #filters_btn_wrapper{
        display : none;
    }

    .filter_btns_wrapper {
        display: none !important;
    }

    .js-vivamap-keyboard{
        justify-content : space-between;
        padding-right   : 15px;
        padding-left    : 15px;
    }

}

.wrapper{
    position         : relative;
    background-color : #ffffff;
    width            : 100%;
}

.filter-wrapper {
    display: initial;

    .filter_widget_btn.margin {
        margin-right: .5rem;
    }

    .close-filter-btn {
        margin-right: 1rem;
    }
}

.filter-wrapper.off {
    display: none;
}

.price_range_header{
    color : #000;
}

.filter_section_header{
    font-size   : 12px;
    font-weight : 600;

    &.margin {
        margin-right : 1rem;
    }
}

.filter_widget_btn{
    border-radius    : 20px;
    font-size        : 12px;
    text-transform   : capitalize;
    background-color : #fff;
    color            : black;
    border           : 1px solid #000;
    letter-spacing   : 0;
    width            : auto;
    min-width        : fit-content;
    line-height      : 23px;
    padding          : 0px 13px;
}

.filter_widget_btn.active{
    border-color : #BD8B13;
    color        : #BD8B13;
}

.filter_widget_btn.active:before{
    font-family : 'Font Awesome\ 5 Free';
    content     : "\f00c"; /* FontAwesome Unicode */
}

input[type="range"]{
    -webkit-appearance : none;
    -moz-appearance    : none;
    appearance         : none;
    width              : 100%;
    outline            : none;
    position           : absolute;
    margin             : auto;
    top                : 16px;
    bottom             : 0;
    background-color   : transparent;
    pointer-events     : none;
}

.slider-track{
    width         : 100%;
    height        : 5px;
    position      : absolute;
    margin        : auto;
    top           : 16px;
    bottom        : 0;
    border-radius : 5px;
}

input[type="range"]::-webkit-slider-runnable-track{
    -webkit-appearance : none;
    height             : 5px;
}

input[type="range"]::-moz-range-track{
    -moz-appearance : none;
    height          : 5px;
}

input[type="range"]::-ms-track{
    appearance : none;
    height     : 5px;
}

input[type="range"]::-webkit-slider-thumb{
    -webkit-appearance : none;
    height             : 20px;
    width              : 20px;
    background-color   : #ffffff;
    cursor             : pointer;
    margin-top         : -9px;
    pointer-events     : auto;
    border-radius      : 50%;
    box-shadow         : 0px 0px 5px rgba(0, 0, 0, 0.6);
}


input[type="range"]::-moz-range-thumb{
    -webkit-appearance : none;
    height             : 20px;
    width              : 20px;
    background-color   : #ffffff;
    cursor             : pointer;
    margin-top         : -9px;
    pointer-events     : auto;
    border-radius      : 50%;
    box-shadow         : 0px 0px 5px rgba(0, 0, 0, 0.6);
}

input[type="range"]::-ms-thumb{
    appearance     : none;
    height         : 1.7em;
    width          : 1.7em;
    cursor         : pointer;
    border-radius  : 50%;
    pointer-events : auto;
}

input[type="range"]:active::-webkit-slider-thumb{
    background-color : #ffffff;
    border           : 1px solid #BD8B13;
}

.values{

    position    : relative;
    font-weight : 600;
    font-size   : 12px;
}

.values:before{
    content  : "";
    position : absolute;
    height   : 0;
    width    : 0;
    margin   : auto;
    bottom   : -14px;
    left     : 0;
    right    : 0;
}

.primary-filter-btn{
    min-width        : auto;
    background-color : #BD8B13;
    font-size        : 12px;
    letter-spacing   : normal;
    line-height      : 34px;
}

.close-filter-btn{
    min-width      : fit-content;
    color          : #BD8B13;
    background     : antiquewhite;
    letter-spacing : normal;
    line-height    : 34px;
}

#groupAmount{
    height : 40px;
    width  : 27%;
}


.filter_btn span.btn-text, .mobile_filter_btn span.btn-text{
    text-transform : capitalize;
}

.filter_btn .badge{
    position         : absolute;
    top              : -3px !important;
    right            : 0px;
    background-color : #bd8b13;
    color            : white;
    font-size        : 12px;
    padding          : 3px 6px;
    border-radius    : 50%;
    left             : 107px;
    width            : 19px;
}

.mobile_filter_btn .badge{
    position         : absolute;
    top              : -2px !important;
    right            : 0px;
    background-color : #bd8b13;
    color            : white;
    font-size        : 12px;
    padding          : 3px 6px;
    border-radius    : 50%;
    left             : 83px;
    width            : 19px;
}

.mobile_zone_price_filter_wrapper{
    position      : relative;
    margin-top    : 20px;
}

.mobile_zone_price_filter_wrapper > div{
    overflow-x    : scroll;
}

.mobile_zone_price_filter_wrapper.off{
    display: none;
}


.mobile_zone_price_filter_wrapper .price_filter_btn{
    background-color : #ffffff;
    z-index          : 0;
}

/* For laptops and larger screens */
@media (min-width : 1024px) and (max-width : 1280px){

    .popup{
        width : 400px !important;
    }
}

@media screen and (max-width: 1366px) and (max-height: 768px) {
    .filter-row-container {
        bottom: 2.8rem;
    }
    .popup {
        bottom: 29.8rem;
        z-index: 99999;
        padding:10px
    }
    .popup h2{
        margin-top : 2px!important;
    }

}