.shadow-effect {
    background: #fff;
    padding: 20px;
    border-radius: 4px;
    text-align: center;
border:1px solid #ECECEC;
    box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);
}
#customers-testimonials .shadow-effect p {
    font-family: inherit;
    font-size: 17px;
    line-height: 1.5;
    margin: 0 0 17px 0;
    font-weight: 300;
}
.testimonial-name {
    margin: -17px auto 0;
    display: table;
    width: auto;
    background: #00a09c;
    padding: 9px 35px;
    border-radius: 12px;
    text-align: center;
    color: #fff;
    box-shadow: 0 9px 18px rgba(0,0,0,0.12), 0 5px 7px rgba(0,0,0,0.05);
}
#customers-testimonials .item {
    text-align: center;
    padding: 50px;
        margin-bottom:80px;
    opacity: .2;
    -webkit-transform: scale3d(0.8, 0.8, 1);
    transform: scale3d(0.8, 0.8, 1);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#customers-testimonials .owl-item.active.center .item {
    opacity: 1;
    -webkit-transform: scale3d(1.0, 1.0, 1);
    transform: scale3d(1.0, 1.0, 1);
}
.owl-carousel .owl-item img {
    transform-style: preserve-3d;
    max-width: 90px;
    margin: 0 auto 17px;
}
#customers-testimonials.owl-carousel .owl-dots .owl-dot.active span,
#customers-testimonials.owl-carousel .owl-dots .owl-dot:hover span {
    background: #00a09c;
    transform: translate3d(0px, -50%, 0px) scale(0.7);
}
#customers-testimonials.owl-carousel .owl-dots{
display: inline-block;
width: 100%;
text-align: center;
}
#customers-testimonials.owl-carousel .owl-dots .owl-dot{
display: inline-block;
}
#customers-testimonials.owl-carousel .owl-dots .owl-dot span {
    background: #00a09c;
    display: inline-block;
    height: 20px;
    margin: 0 2px 5px;
    transform: translate3d(0px, -50%, 0px) scale(0.3);
    transform-origin: 50% 50% 0;
    transition: all 250ms ease-out 0s;
    width: 20px;
}
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: inherit;
}

html {
    font-size: 62.5%;
    box-sizing: border-box;
    text-rendering: optimizeSpeed;
    scroll-behavior: smooth;
}

@font-face {
    font-family: "product-sans";
    src: url(../fonts/ProductSans-Bold.woff);
    font-weight: 700;
    font-display: block;
}

@font-face {
    font-family: "product-sans";
    src: url(../fonts/ProductSans-Medium.woff);
    font-weight: 600;
    font-display: block;
}

@font-face {
    font-family: "product-sans";
    src: url(../fonts/ProductSans-Regular.woff);
    font-weight: 500;
    font-display: block;
}

@font-face {
    font-family: product-sans;
    src: url(../fonts/ProductSans-Italic.woff);
    font-weight: 400;
    font-display: block;
}
body {
    font-family: product-sans;
    overflow-x: hidden;
}

:root {
    --color-primary: #00a19c;
    --title-color: #131f2d;
    --nav-link: #707070;
    --color-white: #fff;
    --subtitle-color: #7a8497;
    --countup-title: #0d152e;
    --countup-text: #707e97;
    --sell-car-button: #9ca436;
    --blog-text: #6c788d;
    --contact-title: #0d152e;
    --contact-subtitle: #81838c;
    --contact-input: #9ea1ab;
    --accordion-text: #687497;
    --accordion-right-text: #687497;
    --priceing-title-color: #7638a4;
}

/*
************************************************************
Form Section Style
************************************************************
 */
.inner-page-section {
    padding: 10rem 0;
}

#msform {
    text-align: center;
    position: relative;
    margin-top: 20px
}
.section-detail {
    font-size: 1.5rem !important;
    margin: 3rem 5rem;
}
#msform label{
    color: #181c32;
    font-size: 1.5rem !important;
}
#msform fieldset .form-card {
    background: white;
    border: 0 none;
    border-radius: 0px;
    box-shadow: none;
    padding: 0;
    box-sizing: border-box;
    width: 94%;
    margin: 0 3% 20px 3%;
    position: relative
}

#msform fieldset {
    background: white;
    border: 0 none;
    border-radius: 0.5rem;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding-bottom: 20px;
    position: relative
}

#msform fieldset:not(:first-of-type) {
    display: none
}

#msform fieldset .form-card {
    text-align: left;
    color: #9E9E9E
}

#msform input:focus,
#msform textarea:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: none;
    font-weight: bold;
    border-bottom: 2px solid var(--color-primary);
    outline-width: 0
}

#msform .action-button {
    width: 100px;
    background: var(--color-primary);
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 0px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 20px;
    float: right;
}

#msform .action-button:focus {
    box-shadow: 0 0 0 2px white, 0 0 0 3px var(--color-primary);
}

#msform .action-button-previous {
    width: 100px;
    background: #616161;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 0px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 20px;
    float: left;
}
#msform .action-button-previous:focus {
    box-shadow: 0 0 0 2px white, 0 0 0 3px #616161
}

select.list-dt {
    border: none;
    outline: 0;
    border-bottom: 1px solid #ccc;
    padding: 2px 5px 3px 5px;
    margin: 2px
}

select.list-dt:focus {
    border-bottom: 2px solid skyblue
}

.fs-title {
    font-size: 25px;
    color: #2C3E50;
    margin-bottom: 10px;
    font-weight: bold;
    text-align: left
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: lightgrey
}

#progressbar .active {
    color: #000000
}

#progressbar li {
    list-style-type: none;
    font-size: 12px;
    width: 25%;
    float: left;
    position: relative
}

#progressbar #vehicle-data:before {
    font-family: FontAwesome;
    content: "\f1b9";
    position: relative;
    z-index: 2;
}

#progressbar #personal:before {
    font-family: FontAwesome;
    content: "\f007";
    position: relative;
    z-index: 2;
}

#progressbar #payment:before {
    font-family: FontAwesome;
    content: "\f09d";
    position: relative;
    z-index: 2;
}

#progressbar #confirm:before {
    font-family: FontAwesome;
    content: "\f00c";
    position: relative;
    z-index: 2;
}

#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 18px;
    color: #ffffff;
    background: lightgray;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px
}

#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: lightgray;
    position: absolute;
    left: 0;
    top: 25px;
    z-index: 0
}

#progressbar li.active:before, #progressbar li.active:after {
    background: var(--color-primary);
}

.radio-group {
    position: relative;
    margin-bottom: 25px
}

.radio {
    display: inline-block;
    width: 204px;
    height: 104px;
    border-radius: 0;
    background: lightblue;
    box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    cursor: pointer;
    margin: 8px 2px
}

.radio:hover {
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.3)
}

.radio.selected {
    box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.1)
}

.fit-image {
    width: 100%;
    object-fit: cover
}
span.currency-icon {
    position: absolute;
    margin-left: 1px;
    margin-top: 1px;
    font-size: 1.75rem;
    padding: 1rem 1rem;
    color: #5e6278;
}
input.form-control.form-control-solid.asking-price-input {
    padding-left: 2.75rem;
}
.no-price-select {
    margin-top: 1rem !important;
}
.no-price-select span {
    font-size: 1.75rem;
    color: red;
}
.required:after {
    content: "*";
    position: relative;
    font-size: inherit;
    color: #f1416c;
    padding-left: .25rem;
    font-weight: 700;
}
.text-muted {
    color: #a1a5b7 !important;
    --bs-text-opacity: 1;
}
.mb-8 {
    margin-bottom: 2rem!important;
}
.g-9, .gy-9 {
    --bs-gutter-y: 2.25rem;
}
.g-9, .gx-9 {
    --bs-gutter-x: 2.25rem;
}
.fs-6 {
    font-size: 1.075rem !important;
}

.form-control.form-control-solid {
    background-color: #f5f8fa;
    border-color: #f5f8fa;
    color: #5e6278;
    transition: color .2s ease, background-color .2s ease;
}
.form-control:disabled, .form-control[readonly] {
    background-color: #eff2f5;
    opacity: 1;
}
.form-control {
    box-shadow: none!important;
}
.form-control {
    display: block;
    width: 100%;
    padding: 1rem 1rem;
    font-size: 1.75rem;
    font-weight: 500;
    line-height: 1.5;
    color: #181c32;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e4e6ef;
    appearance: none;
    border-radius: .65rem;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.08);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.form-check.form-check-solid .form-check-input:checked {
    background-color: #00A09C;
}
.form-check.form-check-custom .form-check-label {
    margin-left: .55rem;
}
.form-check.form-check-custom {
    display: flex;
    margin: 0;
}
.me-10 {
    margin-right: 2.5rem!important;
}
.form-check.form-check-solid .form-check-input {
    border: 0;
    background-color: #eff2f5;
}
.form-check-input {
    width: 1.25em;
    height: 1.25em;
}
i.fa.fa-exclamation-circle {
    color: #a1a5b7;
    margin-left: 1rem;
    font-size: 1.5rem;
}
p.input-alert-msg {
    font-size: 1.25rem;
    margin-top: 1rem;
}
.thumb {
    margin: 10px 10px 0 0;
    height: 150px;
    width: 150px;
    border-radius: 0.65rem;
    box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, .075);
    object-fit: cover;
}


/*
************************************************************
Contact Us Page Style
************************************************************
 */
section.inner-page-banner-section {
    background-image: linear-gradient(to left, rgba(0,0,0, 0), rgba(215,225,236, 2)), url(../img/contact-us-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 400px;
}
.banner-cation {
    padding-top: 110px;
    color: black;
    width: 55%;
}
.banner-cation h2 {
    font-family: product-sans;
    font-size: 3.6rem;
    font-weight: 700;
    color: var(--title-color);
}
.banner-cation p {
    font-family: product-sans;
    font-size: 2rem;
    font-weight: 500;
    color: var(--title-color);
    width: 95%;
    margin-top: 2rem;
}
.info-card {
    padding: 50px;
    margin-top: -80px;
    background: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    text-align: center;
    border-radius: 2rem;
}
.info-icon i {
    font-size: 26px;
}
h3.info-card-title {
    font-family: product-sans;
    font-weight: 700;
    font-size: 2.5rem;
    color: var(--title-color);
    margin: 20px 0;
}
p.info-card-contact {
    font-family: product-sans;
    font-weight: 500;
    font-size: 1.6rem;
    color: var(--subtitle-color);
    margin-top: 2rem;
    padding: 0 2rem;
}
.contact-support {
    font-size: 1.6rem;
    font-weight: 500;
    font-family: product-sans;
    border-radius: 1rem;
    text-transform: capitalize;
    cursor: pointer;
    transition: all 0.3s;
    position: relative;
    outline: none;
    text-decoration: none;
    border: none;
    background: var(--color-primary);
    padding: 16px 26px;
    color: #fff;
}
.contact-support:hover{
    color: #ffffff;
    text-decoration: none;
}
.contact-card-number {
    margin-top: 4rem;
}
a.contact-no {
    font-size: 1.6rem;
    font-weight: 600;
    font-family: product-sans;
    text-transform: capitalize;
    cursor: pointer;
    text-decoration: none;
    padding: 16px 26px;
    color: var(--color-primary);
}
.card.contact-card.contact-page {
    width: 100%;
    border: none;
}
.contact-form-section {
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 2rem;
}
.card-body.contact-card-body.contact-page-card {
    padding: 70px 50px;
}
.contact-info-div strong {
    font-family: product-sans;
    font-weight: 600;
    font-size: 2rem;
    color: #666;
    margin: 10px 0;
}
.contact-info-div p {
    color: var(--contact-subtitle);
    font-size: 1.5rem;
}
.contact-info-div p a {
    font-size: 1.5rem;
    color: var(--contact-subtitle);
    text-decoration: none;
}
.contact-address-info-section {
    padding: 70px 50px;
}
.contact-address-info-section .contact-title {
    margin-bottom: 4rem;
    text-align: left;
}
/*
************************************************************
How it works page Style
************************************************************
*/

section.inner-page-banner-section.work-process {
    background-image: linear-gradient(to left, rgba(0,0,0, 0), rgba(215,225,236, 2)), url(../img/werkwijze.png);
    height: auto;
    padding-bottom: 50px;
}
.work-method-contect h2 {
    font-family: product-sans;
    font-size: 3.6rem;
    font-weight: 700;
    color: var(--title-color);
    margin-top: 2.5rem;
    width: 80%;
}
.work-method-contect p {
    font-family: product-sans;
    font-weight: 500;
    font-size: 2rem;
    color: var(--subtitle-color);
}
section.inner-page-section.work-process-page {
    padding: 5rem 0 10rem;
}
.work-method-contect {
    margin-bottom: 5rem;
}
.work-card {
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 2rem;
    padding: 30px;
    margin-bottom: 5rem;
    transition: all 0.3s ease-in-out;
}
.work-card:hover {
    transform: translateY(-10px) scale(1);
    box-shadow: 0 1rem 2rem rgb(181 181 181 / 20%);
}
.process-number {
    background: var(--color-primary);
    width: 50px;
    height: 50px;
    text-align: center;
    color: white;
    font-size: 3.5rem;
    font-weight: 700;
    font-family: 'product-sans';
    border-radius: 25px;
    position: absolute;
    top: -15px;
    left: -20px;
}
.work-process-img {
    position: relative;
}
.work-process-img img {
    width: 100%;
    object-fit: cover;
    border-radius: 25px;
    height: 220px;
    box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
}
.process-title h3 {
    font-family: product-sans;
    font-weight: 700;
    font-size: 2rem;
    color: var(--title-color);
}
.process-description p {
    font-family: product-sans;
    font-weight: 500;
    font-size: 1.6rem;
    color: var(--subtitle-color);
    margin-top: 2rem;
}
.process-content {
    padding: 50px 30px;
}

/*
************************************************************
Simple text page Style
************************************************************
*/

.work-method-contect.text-page h3 {
    font-family: product-sans;
    font-weight: 700;
    font-size: 2rem;
    color: var(--title-color);
    margin: 3rem 0 1rem;
}
ul.text-point li {
    font-family: product-sans;
    font-weight: 500;
    font-size: 2rem;
    color: var(--subtitle-color);
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--subtitle-color);
}
ul.text-point {
    margin: 5rem 0 5rem 10rem;
}

/*
************************************************************
Footer Section Style
************************************************************
*/
.inner-pages-footer {
    margin-top: 0 !important;
}




/*
************************************************************
Responsive Style
************************************************************
*/
@media(max-width: 991px){
    .banner-cation {
        width: 100%;
    }
    .info-card.support-card {
        margin-top: 50px;
    }
    .contact-form-section .col-12.col-sm-12.col-md-12.col-lg-7.col-xl-7.col-xxl-7 {
        order: 2;
    }
    .contact-address-info-section {
        text-align: center;
        padding: 70px 50px 0 50px;
    }
    .contact-address-info-section .contact-title {
        text-align: center;
    }
    .work-method-contect.text-page h3 {
        font-size: 2.5rem;
    }
    ul.text-point {
        margin: 5rem 0 5rem 5rem;
    }
    .work-card .col-12.col-sm-12.col-md-12.col-lg-8.col-xl-8.col-xxl-8 {
        order: 2;
    }
    .process-content {
        padding: 50px 0;
    }
    .form-card .section-detail {
        margin: 3rem 1rem;
    }
}
@media(max-width: 540px){
    .info-card {
        margin-top: -40px;
    }
    section.inner-page-banner-section {
        height: auto;
        padding-bottom: 40px;
    }
}

@media(max-width: 414px){
    .card-body.contact-card-body.contact-page-card {
        padding: 70px 25px;
    }
    .contact-address-info-section {
        padding: 70px 25px 0;
    }
    .info-card {
        padding: 50px 25px;
        margin-top: 40px;
    }
}


.page-content-section {
    height: auto;
    margin-bottom: 30px;
    padding-bottom: 30px;
}