/* Responsive for mobile */

@media (min-width: 577px){
    #menu__toggle {
        display: none;
    }
    .humb_logo{
        display: none;
    }
    .mobile_search{
        display: none;
    }
    .mobile_logo{
        display: none;
    }
    .mobile_logo_person{
        display: none;
    }
    .filters_icon_mob{
        display: none;
    }
    .mob__inline_block{
        display: contents;
    }
    .mob__line1__banks, .mob__line2__banks, .mob__line3__banks, .mob__line__blocks, .svr__mob, .stl_1, .stl_2{
        display: none;
    }
    
}

@media (max-width: 576px){
.line, .svr, .caption{
display: none;
}
.header__burger {
 display: none;
}

.headerCss {
background-color: #101920;
}
.connectedLoans_div{
width: 0;
padding: 0;
}
.div_four_box {
display: flex;
flex-direction: column;
margin-left: 0;
}
.humb_logo{
position: absolute;
top: 0;
margin: 22px 119px 15px 16px;
}
.mobile_search{
    margin-top: 29px;
    margin: 29px auto;
    height: 36px;
    border-radius: 4px;
}
.search__submit__mob{
        position: absolute;
        top: 115px;
        font-size: 14px !important;
        margin-left: 25px;
        width: 14px;
}
input[type="search"]::-webkit-input-placeholder {
    color: #7C8184;
} 
input[type="search"]::-moz-placeholder {
    color: #7C8184;
}
.search__input_mob {
padding-left: 33px !important;
max-width: 357px;
height: 36px !important;
margin-left: 15px;
border: 1px solid #e7e7e7;
border-radius: 4px;
position: relative;
}
.mobile_logo{ 
    display: flex;
    position: fixed;
    justify-content: center;
    left: 131px;

    }
.mobile_logo_person{
    display: flex;
    position: fixed;
    background-image: url(../../assets/images/mob/phill_logo.svg);
    top: 14px;
    left: 364px;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    border: 1px solid white;
}
.page-title.text-grey.text-search{margin-top: 17px;}

    
    /* ========================Left Bar -> Burger menu============================= */

#menu__toggle {
    opacity: 0;
}
.mob_side_line{
    width: 100%;
    height: 1px;
    border: 1px solid #A5A8AA;
    margin: 0;
    padding: 0;
    opacity: 0.3;
    margin-top: -15px;
}

#menu__toggle:checked ~ .menu__btn > span {
transform: rotate(45deg);
left: 333px;
width: 18px;
}

#menu__toggle:checked ~ .menu__btn > span::before {
top: 0;
transform: rotate(0);
}
#menu__toggle:checked ~ .menu__btn > span::after {
top: 0;
transform: rotate(90deg);
}
#menu__toggle:checked ~ .menu__box {
visibility: visible;
left: 0;
}

.menu__btn {
display: flex;
align-items: center;
position: fixed;
top: 20px;
left: 20px;
width: 26px;
height: 26px;
cursor: pointer;
z-index: 1;
}

.menu__btn > span,
.menu__btn > span::before,
.menu__btn > span::after {
display: block;
position: absolute;
width: 100%;
height: 2px;
background-color: #FFFFFF;
transition-duration: .25s;
}
.menu__btn > span::before {
content: '';
top: -8px;
}
.menu__btn > span::after {
content: '';
top: 8px;
}
.dashicons, .dashicons-before:before {
    color: #A5A8AA;
}
.sideBar_left li svg {
    color: #A5A8AA;
}


.menu__box {
display: block;
position: fixed;
visibility: hidden;
top: 0;
left: -100%;
width: 100%;
height: 100%;
max-height: 453px;
margin: 0;
padding: 80px 0;
list-style: none;
background-color: #101920;
box-shadow: 1px 0px 6px rgba(0, 0, 0, .2);
transition-duration: .25s;
}

ul#menu-left-sidebar {
    top: 142px;
}

.menu-item {
    display: block;
    padding: 12px 24px;
    /* color: white; */
    font-size: 20px;
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 14px;
    margin: 1px 0 24px 37px!important;
    padding: 0;
    margin-left: 17px;
    text-decoration: none;
    transition-duration: .25s;
}

.menu-item:hover {
    color: #F15C70;
}
.sideBar_left .menu li:hover {
    color: #F15C70;
}

/* Button Filters on mobile */

.btn_filter.btn.active.btn__stl-filters{
    display: none;
}

.filters_icon_mob {
    display: flex;
    position: absolute;
    width: 34px;
    height: 34px;
    top: 69px;
    padding: initial;
    border-radius: 3px;
    left: 363px;
    border: none;
    justify-content: center;
    background-color: white;
    margin-top: 14px;
}

/* H Search*/
.text-search {
    margin-top: 0px;
    padding: 17px 0 24px !important;
    font-family: 'Poppins';
    font-size: 18px !important;
    line-height: 27px;
    color: #101920 !important;
    font-weight: 500;
}

/* -----------------------Filter Popup for mobile-------------------------------- */
.filters__mobile{
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 310px;
    position: relative;
    margin: auto;
    background-color: #F3F3F3;
    padding-top: 42px;
    padding-right: 15px;
    padding-left: 15px;
    padding-bottom: 30px;
    border-radius: 4px;
}

.img__popup_close{
    position: absolute;
    top: 15px;
    right: 15px;
}

.filter-container{
    display: flex;
    flex-direction: column;
}
.loanTerm__container{
    display: flex;
    flex-direction: column;
}
.line_afterFilters{ display: none;}

.item__mob-filter{
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    font-family: 'Poppins';
    font-weight: 600;
    font-size: 24px;
    line-height: 36px;
}
.select_IwantTo{
    width: 280px;
}

.first__filter__mob{
    margin-bottom: 20px;
}

.Dflex {
    margin-bottom: 5px;
}
.filter-container {
    align-items: flex-start;
}
.Dflex.select {
    margin-right: 0;
}
.borr_mob{
display: flex;
flex-direction: column;
margin: 0;
width: 100%;
min-width: 280px;
margin-bottom: 20px;
}

.block__mob{
    display: flex;
    position: relative;
    width: 280px;
    margin: 0 0 5px 0;
    padding: 0;
}

.clear_butt__mob{
display: flex;
position: absolute;
margin: 0;
padding: 0;
width: auto;
top: 2px;
right: 0px;
}

.clear-second{
    left: 252px;
}

.lender {
    margin-left: 0;
}

.lender__block_mob{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    max-width: 280px;
    margin: 0;
    padding: 0;
}
.clear-five {
    left: 252px;;
}
.Dflex.select button {
    margin-left: 0;
}
.lender_div {
    margin: 0;
}
.item_repaying {
    margin-right: 0;
}
.hidden_select_lender{
    width: 278px;
}
input[type="date"]:focus, input[type="datetime-local"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="month"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="week"]:focus, select:focus, textarea:focus {
    color: #101920; 
}

/* --------------------------Style filters Select --------------------------------- */

/* Borrow */
.boorow_filter {
    padding: 11px 10px 16px 10px;
}
.mob_apply_stl {
    padding: 0;
    margin-top: 16px;
    min-width: 252px;
    border-radius: 3px;
}
.stl_mob_input {
    min-width: 252px;
    border-radius: 4px !important;
    height: 36px !important;
    margin-top: 5px;
}


/* Loan Term */
.filter-body {
    display: flex;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #FFFFFF!important;
    min-width: 276px;
    z-index: 999;
    padding: 11px 14px 16px;
    display: none;
    color: black;
    border-radius: 4px;
    box-shadow: 0px 0.5px 2px;
    margin: 7px 0 0;
    margin-left: -6px;
    margin-bottom: -6px;
}
.stl_mob_input_loan {
    min-width: 252px;
    border-radius: 4px !important;
    height: 36px !important;
    margin-top: 5px;
}
.mob_apply_stl_loan {
    padding: 0;
    margin-top: 26px;
    margin-bottom: 16px;
    min-width: 252px;
    border-radius: 3px;
}
.loan_range_style {
    width: 100%;
    max-width: 252px;
    margin-top: 12px;
}
.end_number {
    margin-left: 89%;
}
.borrow-left {
    height: auto;
}
.boorow_filter{
    position: unset;
}
.filter-body-form{
    position: unset;
}
.repaying-label {
    height: auto;
}
.stl__mob{
    position: unset;
    margin-left: -7px;
}
.btn_repaying {
    width: 100%;
    max-width: 259px;
}
.mob__left{
    margin-left: 56px;
}
.variab_mob{
    height: auto;
    padding: 6px;
}
.filter-body.filter_features{
    position: unset;
    margin-left: -5px;
}
.loan_mob{
    height: auto;
    padding: 5px;
}
.filter-body.filter_loan{
    position: unset;
    margin-left: -4px;
    margin-bottom: -4px;
}


/*---------------------------------------------------------------------Style for banks proposition---------------------------------------------- */

.banks .item_head {
    padding-left: 0;
}

.mob__style_banks{
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 0px;
    height: auto;
}
.mob__logo{
    display: flex;
    order: 1;
    flex-direction: column;
    justify-content: center;
    margin: 38px auto 11px !important;
}
.addtocart{
    display: flex;
    position: absolute !important;
    top: -6px;
    right: 7px;
}

.upfront_fee{
    order: 2;
}

.mob_style_number{
    font-size: 22px;
    font-family: 'Poppins';
    font-weight: 600;
    line-height: 33px;
}
.mob_stl_p{
    font-size: 12px;
    font-family: 'Poppins';
    font-weight: 400;
    line-height: 18px;
}

.mob_stl_month{
    font-size: 12px;
    font-family: 'Poppins';
    font-weight: 400;
    line-height: 18px;
}

.mob__inline_block{
    display: flex;
    order: 3;
    margin-top: 7px;
    margin-bottom: 12px;
}
.crrate, .comprate {
    width: auto !important;
}
.monthly_repayment{
    order: 4;
}
/* .show-loan-details{
    order: 5;
    margin-bottom: 10px;
} */

.item__stl_mob{
    display: flex;
    flex-direction: column;
    background-color: white;
}

.show-loan-details{
    order: 6;
    margin-top: 20px !important;
    margin-bottom: 20px;
}

.mob__line1__banks{
    display: block;
    order: 2;
    height: 1px;
    border: 0;
    border-top: 1px solid #F3F3F3;
    margin: 1em 0;
    padding: 0;
    margin-top: 0;
    margin-bottom: 7px;
    margin-right: 10px;
    margin-left: 10px;

}
.mob__line2__banks{
    display: block;
    order: 3;
    height: 1px;
    border: 0;
    border-top: 1px solid #F3F3F3;
    margin: 1em 0;
    padding: 0;
    margin-top: 11px;
    margin-bottom: 0;
    margin-right: 10px;
    margin-left: 10px;
}
.mob__line__blocks{
    display: block;
    order: 3;
    height: 1px;
    border: 0;
    border-top: 1px solid #F3F3F3;
    margin: 1em 0;
    padding: 0;
    margin-top: 11px;
    margin-bottom: 0;
    margin-right: 10px;
    margin-left: 10px;
}
.stl_1{
margin: 0;
margin-bottom: 10px;
}


.mob__line3__banks{
    display: block;
    order: 3;
    height: 1px;
    border: 0;
    border-top: 1px solid #F3F3F3;
    margin: 1em 0;
    padding: 0;
    margin-top: 0;
    margin-bottom: 8px;
    margin-right: 10px;
    margin-left: 10px;
}
.btn_apply.register{
    width: 268px;
    margin-top: 20px;
    margin-bottom: 10px;
}

.loan_detail_background.buttons.show-loan-details{
    margin-bottom: 10px;
    height: auto;
}

.banks .item:nth-child(-n+3) {
    width: 100%;
    margin: auto;
    max-width: 288px;
    margin-bottom: 20px;

}
#results_container{
    width: 100%;
    max-width: 288px;
    margin: auto;

}
.banks .item {
    margin-bottom: 20px;
    border-radius: 5px;
}


/* -------------------------------Items on page Result------------------------------ */
.btn_apply.registered{
    width: 268px;
}
.column5{
    flex-direction: column;
    padding-left: 10px;
    padding-right: 10px;
}
.classic_home {
    display: flex;
    text-align: center;
    width: 159px;
    margin: auto;
    order: 5;
}
.caption{
    margin: 5px auto;
    order: 6;
}
.item_body_body-item {
    margin-left: 0;
}
.item_body_body-item_red {
    margin-left: 0; 
}
.blocks_flex__mob{
    display: flex;
}
.grey_block {
    margin-left: 0;
    margin-bottom: 0px;
}
.second_grey_block {
    margin-left: 0; 
    margin-bottom: 10px;
}
.item_body_body-item5 {
    margin-left: 0;
    width: 100%;
    max-width: 138px;
}
.green, .red{
    margin-bottom: 10px;
}
.black_block_item {
    margin-top: 0;
    margin-bottom: 0px;
}
.mob__setle_number{
    margin: 0;
}
.del_styl {
    margin-bottom: 0px;
}
.svr__mob {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: normal;
    order: 6;
    margin-top: 5px;
    text-align: center;
    margin: auto;
    font-size: 9px;
    line-height: 13.5px;
    color: #7C8184;
    margin: 5px 0 12px 0;
    font-weight: 400;
    text-transform: uppercase;
}

.stl_2{
    order: 0;
    margin: 0;
    margin-bottom: 12px;

}



}