.filter-section .container {
    padding: 40px 0
}

.filter-btn {
    padding: 12px 48px
}

.filter-section p {
    color: #000
}

.filter-section select {
    width: 283px
}

.listing-section {
    padding: 48px 0
}

.heading h1 {
    font-size: 30px
}

.listing-section h2 {
    font-size: 22px !important
}

.listing-section .listing-div {
    border-radius: 8px;
    border: .5px solid #8080806e
}

.listing-div .company-image {
    width: 100px;
    height: 100px;
    border-radius: 8px
}

.listing-heading-box {
    padding: 16px;
    border-bottom: .5px solid #8080806e
}

.listing-heading-box h5 {
    font-size: 24px;
    font-weight: 600;
    color: #000
}

.listing-heading-box p {
    font-size: 14px;
    font-weight: 500
}

.listing-div span img {
    width: 21px;
    height: 21px
}

.listing-heading-box a {
    font-size: 16px;
    font-weight: 500
}

.listing-div .ratting-span {
    border-radius: 8px;
    background: #e4a201;
    padding: 4px 8px;
    color: #fff;
    font-size: 12px
}

.listing-div .btn-primary,
.listing-div .row .col-sm-12 .budget-div {
    padding: 16px !important
}

.listing-div .row .col-sm-12 .budget-div p {
    color: #000;
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 16px
}

.listing-content-section {
    border-color: #8080806e;
    border-style: solid;
    border-width: 0 1px;
    padding: 0
}

.listing-content-section div {
    padding: 16px;
    border-bottom: 1px solid #8080806e
}

.listing-content-section div:last-child,
.listing-div .buttons-div div:last-child {
    border: 0
}

.listing-content-section span {
    font-size: 14px;
    color: var(--secondary)
}

.requirements-section {
    border-radius: 8px;
    border: .5px solid var(--primary);
    background: #fff;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
    padding: 0 50px
}

.partner-section img,
.requirements-section img {
    width: 100%
}

.partner-section h2,
.requirements-section h2 {
    font-size: 30px;
    line-height: normal
}

.partner-section .btn-primary,
.requirements-section .btn-primary {
    margin-top: 32px
}

.partner-section {
    border-radius: 8px;
    background: #f7f9ff;
    padding: 5px 50px
}

.qa-section,
.relative-services {
    padding: 64px 0
}

.qa-section {
    background-color: #f7f9ff
}

.qa-section h2 {
    font-size: 24px;
    line-height: 36px
}

.qa-section .heading {
    padding: 0 38px
}

.relative-services h2 {
    font-size: 30px;
    line-height: 36px
}

.relative-services a {
    font-size: 15px;
    text-decoration: none;
    color: var(--primary) !important
}

.listing-div .col-lg-10,
.listing-div .col-lg-2 {
    padding: 16px
}

.listing-div .col-lg-10 {
    border-right: 1px solid #c8c8c8c4
}

.listing-div .btn-primary:hover {
    background-color: var(--primary) !important;
    color: #fff !important;
    border: 1px solid var(--primary)
}

.listing-div .border-top {
    border-top: 1px solid #c8c8c8c4
}

.listing-div .buttons-div div {
    padding: 20px;
    /* border-bottom: 1px solid #8080806e */
}

.listing-div .btn-tertiary {
    gap: 0;
    justify-content: space-between !important
}

.listing-div .btn-tertiary:hover {
    background-color: transparent !important;
    color: inherit !important
}

.hidden-filter-row {
    opacity: 0;
    display: none;
    transition: opacity .5s, visibility .5s
}

.visible-filter-row {
    opacity: 1;
    display: flex;
    transition: opacity .5s, visibility .5s;
    justify-content: center;
    align-items: flex-start
}

.visible-filter-row .btn.btn-primary {
    padding: 12px 48px !important;
    background-color: var(--orange);
    border-color: var(--orange)
}

.online-badge {
    color: var(--green);
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 2px
}

.online-badge img {
    width: 8px !important;
    height: 8px !important;
    animation: 2s ease-out infinite zoom-in-zoom-out
}

.visible-filter-row .filter-location span,
.visible-filter-row .filter-location span input {
    width: 100%;
    background-color: transparent !important
}

.visible-filter-row .filter-location {
    color: var(--secondary);
    border-radius: 8px;
    background: var(--bg-primary) !important;
    padding: 14px 16px;
    font-size: 14px !important;
    border: none
}

@keyframes zoom-in-zoom-out {

    0%,
    100% {
        transform: scale(1, 1)
    }

    50% {
        transform: scale(1.5, 1.5)
    }
}

@media screen and (min-width:992px) and (max-width:1024px) {
    .buttons-div {
        border-top: 0 !important;
        border-left: 1px solid #8080806e;
        border-right: 0 !important
    }
}

@media screen and (min-width:1025px) and (max-width:1205px) {
    .btn-tertiary {
        font-size: 13px
    }
}

@media (max-width:1024px) {

    .btn-tertiary,
    .listing-div .row .col-sm-12 .budget-div p {
        font-size: 11px
    }

    .buttons-div {
        border-top: 1px solid #8080806e;
        border-right: 1px solid #8080806e
    }

    .btn-tertiary {
        width: auto !important;
        padding: 11px 25px !important;
        gap: 20px !important
    }

    .bg-green,
    .btn.btn-primary {
        font-size: 12px !important
    }

    .listing-heading-box h5 {
        font-size: 20px
    }

    .listing-heading-box p {
        font-size: 10px
    }

    .btn.btn-primary {
        padding: 16px 32px
    }

    .btn.btn-primary img {
        width: 12px
    }

    .w-80 {
        width: 100%
    }
}

.listing-section .row.row-gap-4 {
    margin: 12px 0
}

@media (max-width:768px) {

    .filter-section .row,
    .listing-section .row.row-gap-4 {
        margin: 0
    }

    .listing-content-section {
        border: 0
    }

    .listing-div .row .col-sm-12.flex-column {
        /* flex-direction: row !important; */
        gap: 10px
    }

    .listing-div .row .col-sm-12.flex-column button {
        margin-top: 0 !important;
        margin-bottom: 20px;
        font-size: 12px
    }

    .btn-tertiary {
        padding: 8px 25px !important
    }

    .w-80 {
        width: 100%
    }

    .filter-section select {
        width: 150px
    }

    .listing-section h2 {
        font-size: 20px !important
    }

    .partner-section,
    .requirements-section {
        padding: 10px
    }

    .pagination {
        padding: 0 20px
    }

    .relative-services a {
        font-size: 13px
    }

    .relative-services img {
        width: 14px
    }

    .banner .heading {
        margin-top: 20px
    }
}

@media (max-width:1200px) and (min-width:1025px) {
    .listing-div .btn-primary {
        padding: 16px 0 !important
    }
}

@media (max-width:1024px) and (min-width:768px) {
    .listing-content-section {
        border-color: #8080806e;
        border-style: solid;
        border-width: 0 0 0 1px;
        padding: 0
    }
}