:root {
    --primary-color: #3D514F;
    --color-cream: #FFF5F0;
    --color-white: #ffffff;
    --shadow-white: 0 0 10px 0px #ffffff;
}

@font-face {
    font-family: 'Libre Baskerville';
    src: url('../fonts/LibreBaskerville-Regular.eot');
    src: url('../fonts/LibreBaskerville-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/LibreBaskerville-Regular.woff2') format('woff2'),
        url('../fonts/LibreBaskerville-Regular.woff') format('woff'),
        url('../fonts/LibreBaskerville-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Baskerville Italic';
    src: url('../fonts/LibreBaskerville-Italic.eot');
    src: url('../fonts/LibreBaskerville-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/LibreBaskerville-Italic.woff2') format('woff2'),
        url('../fonts/LibreBaskerville-Italic.woff') format('woff'),
        url('../fonts/LibreBaskerville-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Baskerville';
    src: url('../fonts/LibreBaskerville-Bold.eot');
    src: url('../fonts/LibreBaskerville-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/LibreBaskerville-Bold.woff2') format('woff2'),
        url('../fonts/LibreBaskerville-Bold.woff') format('woff'),
        url('../fonts/LibreBaskerville-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/Metropolis-Bold.eot');
    src: url('../fonts/Metropolis-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-Bold.woff2') format('woff2'),
        url('../fonts/Metropolis-Bold.woff') format('woff'),
        url('../fonts/Metropolis-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis Semi';
    src: url('../fonts/Metropolis-SemiBold.eot');
    src: url('../fonts/Metropolis-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-SemiBold.woff2') format('woff2'),
        url('../fonts/Metropolis-SemiBold.woff') format('woff'),
        url('../fonts/Metropolis-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/Metropolis-Regular.eot');
    src: url('../fonts/Metropolis-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-Regular.woff2') format('woff2'),
        url('../fonts/Metropolis-Regular.woff') format('woff'),
        url('../fonts/Metropolis-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/Metropolis-Thin.eot');
    src: url('../fonts/Metropolis-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-Thin.woff2') format('woff2'),
        url('../fonts/Metropolis-Thin.woff') format('woff'),
        url('../fonts/Metropolis-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/Metropolis-Black.eot');
    src: url('../fonts/Metropolis-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-Black.woff2') format('woff2'),
        url('../fonts/Metropolis-Black.woff') format('woff'),
        url('../fonts/Metropolis-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis Extra';
    src: url('../fonts/Metropolis-ExtraBold.eot');
    src: url('../fonts/Metropolis-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-ExtraBold.woff2') format('woff2'),
        url('../fonts/Metropolis-ExtraBold.woff') format('woff'),
        url('../fonts/Metropolis-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/Metropolis-Medium.eot');
    src: url('../fonts/Metropolis-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-Medium.woff2') format('woff2'),
        url('../fonts/Metropolis-Medium.woff') format('woff'),
        url('../fonts/Metropolis-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis Extra';
    src: url('../fonts/Metropolis-ExtraLight.eot');
    src: url('../fonts/Metropolis-ExtraLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-ExtraLight.woff2') format('woff2'),
        url('../fonts/Metropolis-ExtraLight.woff') format('woff'),
        url('../fonts/Metropolis-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('../fonts/Metropolis-Light.eot');
    src: url('../fonts/Metropolis-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Metropolis-Light.woff2') format('woff2'),
        url('../fonts/Metropolis-Light.woff') format('woff'),
        url('../fonts/Metropolis-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

body {
    font-family: 'Metropolis' !important;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    color: #000;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

a {
    text-decoration: none !important;
}

button,
button:focus,
button:active {
    outline: none;
    /* box-shadow: none !important; */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    font-family: 'Libre Baskerville' !important;
    color: #000;
}

p {
    margin: 0;
    padding: 0;
    font-family: 'Metropolis' !important;
}

textarea {
    resize: none;
}

img {
    max-width: 100%;
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    transition: .4s all;
}

header.innerpage-header {
    position: sticky;
}

header.header-fixed {
    background-color: var(--primary-color);
    box-shadow: 0 0 10px 1px #eee;
    margin-top: 0 !important;
}

.offcanvas-body {
    align-items: center;
}

.navbar-brand img {
    max-width: 340px;
}

.login-header a,
header .nav-item .nav-link.active,
header .nav-item .nav-link {
    color: #fff;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 400;
}

.login-header .btn-primary:hover,
.login-header .btn-primary:focus,
.login-header .btn-primary:active {
    color: #1e1e1e !important;
    border-color: #1e1e1e !important;
}

.divider-right {
    margin-right: 10px;
    padding-right: 20px;
    border-right: 2px solid #fff;
}

.btn {
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    border-radius: 30px;
    padding: 10px 30px;
    border-width: 2px;
}

.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.appointment_btn:hover {
    background-color: #ffffff !important;
    border-color: transparent !important;
    color: #1e1e1e !important;
    box-shadow: 0 0 0px #3d514f7a, 0 0 15px #3d514f94, 0 0 25px #3d514f5c, 0 0 30px #3d514f63;
}

.what-sets-section .btn-primary:hover,
.what-sets-section .btn-primary:focus,
.what-sets-section .btn-primary:active {
    background-color: #FFF !important;
    border-color: var(--primary-color) !important;
    color: var(--primary-color) !important;
}

header.main-header.innerpage-header {
    /*    position: static;*/
    background: #3d514f;
}

header.main-header.innerpage-header.header-fixed {
    position: fixed;
}

header.main-header.innerpage-header .btn,
.header-fixed .btn,
.booknow header .btn {
    border-color: #1e1e1e;
    background-color: #1e1e1e;
}

.banner-section {
    background: url('assets/templates/basic/img/banner-img.png') no-repeat center / cover;
    min-height: 850px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 150px 0 40px;
}

.banner-section h1 {
    font-size: 73px;
    color: #fff;
    text-shadow: 0 0 10px rgb(0 0 0 / 60%);
    margin-top: 15rem;
    letter-spacing: -3px;
    font-weight: 400;
    filter: drop-shadow(-5.44px 4.405px 12px rgba(5, 6, 6, 0.2));
}

.banner-section h1 span {
    font-size: 68px;
}

.traditional-sec {
    padding: 100px 0;
    background: #FFF8F4;
}

.profile-box {
    background: #fff;
    padding: 120px 73px 120px 89px;
    border-radius: 238px;
    height: 702px;
    max-width: 477px;
    width: 100%;
    display: flex;
    align-items: start;
    justify-content: center;
    flex-direction: column;
    position: relative;
    z-index: 9;
    margin-bottom: -220px;
    outline: 1px solid #ffd3bb;
    outline-offset: 21px;
}

.profile-box:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    right: 0;
    border-radius: 230px;
    z-index: -1;
}

.profile-box h3 {
    font-size: 30px;
    line-height: 42px;
    margin-bottom: 25px;
}

.profile-box p {
    display: inline-block;
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-color);
    text-transform: uppercase;
    position: relative;
    padding-left: 50px;
}

.profile-box p:before {
    content: '';
    height: 2px;
    width: 50px;
    background: var(--primary-color);
    position: absolute;
    left: -10px;
    top: 12px;
}

.traditional-content h2 {
    font-size: 42px;
    line-height: 54px;
    margin-bottom: 40px;
}

.traditional-content ul {
    margin-bottom: 60px;
}

.traditional-content li {
    display: flex;
    align-items: center;
    gap: 0 20px;
    margin-bottom: 40px;
}

.traditional-content li h5 {
    font-size: 20px;
    line-height: 26px;
    font-family: 'Metropolis' !important;
    font-weight: 700;
    color: #000;
}

.traditional-content li p {
    /* text-transform: uppercase; */
    font-size: 18px;
    font-weight: 500;
}

.mission-sec {
    /* background: var(--primary-color); */
    padding: 0;
}

.mission-sec h2,
.mission-sec p {
    color: var(--primary-color);
}

.mission-sec h2 {
    font-size: 34px;
    padding-bottom: 20px;
    margin-bottom: 25px;
    border-bottom: 1px solid #fff;
    position: relative;
}

.mission-sec h2:after {
    content: '';
    background: #fff;
    width: 0;
    height: 7px;
    position: absolute;
    bottom: -3px;
    left: 15px;
    box-shadow: 0 0 10px 0px #fff;
    transition: .4s all;
}

.mission-sec .mission-content:hover h2:after {
    width: 90px;
}

.mission-sec p {
    font-size: 20px;
}

.modern-matching {
    padding: 100px 0;
    position: relative;
}

.modern-matching:after {
    content: '';
    background: #fff5f0;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 400px;
    z-index: -1;
}

.modern-matching:before {
    content: '';
    position: absolute;
    left: 0;
}

.modern-matching-content h2,
.login__wrapperr h2,
.text_boxxx h2 {
    font-size: 42px;
    line-height: 54px;
    color: var(--primary-color);
    margin-bottom: 34px;
}

.modern-matching-content p {
    font-size: 20px;
    margin-bottom: 67px;
}

.modern-matching-content ul li {
    margin-bottom: 24px;
    padding: 20px;
    border-radius: 15px;
    display: flex;
    align-items: start;
    transition: .4s all;
}

.modern-matching-content ul li img {
    margin-right: 15px;
    position: relative;
    top: 5px;
}

.modern-matching-content ul li p {
    font-size: 18px;
    margin-bottom: 0;
}

.modern-matching-content ul li:hover {
    background: #fff5f0;
}

.modern-matching-content ul {
    margin-bottom: 50px;
}

.modern-matching-img img {
    min-height: 600px;
    object-fit: cover;
    border-radius: 20px;
}

.modern-matching-content {
    position: relative;
}

.modern-matching-content:before {
    content: '';
    background: var(--primary-color);
    width: 150px;
    height: 2px;
    position: absolute;
    right: -180px;
    top: 150px;
}

.experience-sec {
    padding: 50px 0 0;
}

.experience-sec h2 {
    font-size: 103px;
    color: var(--primary-color);
    line-height: 102px;
    text-transform: uppercase;
    margin-bottom: -50px;
    z-index: 9;
    position: relative;
}

.experience-content {
    padding: 0 40px;
}

.experience-content h4 {
    font-size: 30px;
    margin-bottom: 34px;
    font-family: 'Metropolis' !important;
}

.experience-content p {
    font-size: 18px;
}

.experience-sec .input-group {
    width: 745px;
    position: relative;
    top: 91px;
    left: -155px;
}

.experience-sec .input-group input {
    background: #ffede3;
    border-color: #ffede3;
    border-radius: 30px !important;
    font-weight: 500;
    padding: 16px 200px 16px 70px;
}

.experience-sec .input-group input::placeholder {
    color: #fac2a4 !important;
}

.experience-sec .input-group .btn {
    background: #ffd3bb;
    border-color: #ffd3bb;
    border-radius: 30px !important;
    padding: 10px 30px;
    font-size: 18px;
    color: #000;
    position: absolute;
    right: 1%;
    top: 50%;
    line-height: 1.3;
    z-index: 9;
    transform: translate(0%, -50%);
}

.form-control:focus {
    color: #000;
    /* background: #fff5f0; */
    border-color: #ebc7b3;
    outline: 0;
    box-shadow: none;
}

.trumatch-making-sec {
    padding: 40px 0 80px;
}

.divider-left {
    border: 1px solid #000;
    width: 100px;
    margin-right: 20px;
}

.trumatch-making-sec h4 {
    text-transform: uppercase;
    font-size: 35px;
    color: var(--primary-color);
    font-weight: 600;
}

.trumatch-making-sec h4 span {
    font-size: 40px;
}

.trumatch-making-sec h4 span {
    color: #000;
    font-family: 'Metropolis' !important;
}

.main-footer {
    background-color: #000;
    padding: 60px 0;
}

.footer-info h5 {
    text-transform: uppercase;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    border-bottom: 1px solid var(--primary-color);
    margin-bottom: 20px;
    padding-bottom: 10px;
    font-family: 'Metropolis' !important;
}

.footer-info ul {
    display: flex;
    /* flex-wrap: wrap; */
    flex-direction: column;
    gap: 20px 30px;
}

.footer-info ul li a {
    color: #fff;
}

.footer-info .contact li a {
    font-size: 20px;
}

.footer-info ul li a img {
    margin-right: 10px;
    max-width: 29px;
}

.footer-info .btn {
    min-width: 280px;
    font-size: 18px;
}

.footer-info .btn:hover,
.footer-info .btn:focus,
.footer-info .btn:active {
    color: #3d514f !important;
    box-shadow: 0 0 0px #ffffff7a, 0 0 15px #ffffff94, 0 0 25px #ffffff5c, 0 0 30px #ffffff63;
    border-color: transparent !important;
}

.footer-first-row {
    margin-bottom: 210px;
}

.nav-listing li {
    margin-right: 40px;
}

.nav-listing li a {
    color: #fff;
    text-transform: uppercase;
}

.footer-below-links p {
    color: #737373;
    font-size: 15px;
    margin: 20px 0;
    line-height: 18px;
}

.policy-listing li {
    margin-right: 20px;
}

p.desc-text,
.policy-listing li a {
    color: #737373;
    font-size: 14px;
    text-transform: uppercase;
    transition: .4s all;
}

.social-media-links {
    text-align: center;
    background: #ffede3;
    position: absolute;
    right: 0;
    width: 200px;
    top: 0;
    bottom: 0;
    height: 100%;
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    justify-content: center;
}

.social-media-links il {
    margin-bottom: 104px;
}

.social-media-links li {
    width: 100%;
    margin-bottom: 25px;
}

.social-media-links li a {
    display: inline-block;
}

.social-media-links li a img {
    max-width: 20px;
}

.policy-listing li a:hover {
    color: #fff;
}

.nav-listing li a.btn {
    background-color: #fff5f0;
    border-color: #fff5f0;
    color: #1e1e1e;
}

.nav-listing li a.btn:hover,
.nav-listing li a.btn:focus,
.nav-listing li a.btn:active,
.about__btn:hover {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
    box-shadow: 0 0 0px #ffffff7a, 0 0 15px #ffffff94, 0 0 25px #ffffff5c, 0 0 30px #ffffff63;
}

.policy-divider-right {
    border-right: 1px solid #737373;
    padding-right: 20px;
    margin-right: 0;
}


/* -------------------------------------------------------------------------------
   About page css
---------------------------------------------------------------------------------------- */
.about-section {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 150px 0 129px;
    min-height: 606px;
    background: url('../img/banner-img.png') no-repeat;
    background-position: 29% 100%;
    background-size: cover;
}

.about-section::before {
    content: '';
    position: absolute;
    top: 0;
    width: 100%;
    height: 400px;
    background: linear-gradient(180deg, black, transparent);
}

.about-section h1 {
    font-size: clamp(2rem, 8vw, 4.75rem);
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}

/* ------------------------------------------
   Who We Are Section
--------------------------------------------- */
.left-side {
    flex: 0 0 70%;
    padding: 5.063rem 0.75rem 5.063rem 0.75rem;
    background-color: #fff;
}

.title_new h2 {
    font-size: 42px;
    line-height: 54px;
}

.with_italic span,
.with-italic {
    font-family: 'Libre Baskerville Italic' !important;
}

.left-side p {
    max-width: 480px;
    font-size: 18px;
    line-height: 1.5;
}

.right-side {
    flex: 0 0 30%;
}

.who_we_are::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    z-index: -1;
    background-color: #fff5f0;
}

.fixed-img {
    transform: translate(-49%, -58%);
}

/* ------------------------------------------
   Mission Section
--------------------------------------------- */
.mission-section {
    padding: 4.25rem 0;
    /* background-color: #3d514f; */
}

.mission-content h2 {
    font-size: 30px;
    letter-spacing: 1px;
}

.mission-content {
    margin-top: 0;
}

.inner-wrap {
    top: 0;
    gap: 6rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(600px, 2fr));
}

.mission-left {
    width: 100%;
    max-width: 871px;
    margin: -200px 0 0;

}

span.divider {
    display: inline-block;
    width: 140px;
    height: 4px;
    background-color: #fff;
}

.divider::after {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #fff;
}

/* ------------------------------------------
   Why We Started Section
--------------------------------------------- */
.why-section {
    position: relative;
    background: #3d514f;
    padding: 120px 0 170px;
}

.started_title h2 {
    font-size: 45px;
    line-height: 59px;
    color: var(--color-white);
    margin-bottom: 53px;
}

.why-section p {
    font-size: 22px;
    line-height: 1.6;
    color: var(--color-white);
}

.right_inner p {
    margin-top: 8px;
    margin-bottom: 71px;
}

.about_mission::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 38%;
    height: 100%;
    z-index: -1;
    background-color: #fff5f0;
}

.main_btn_comb {
    padding: 19px 58px 20px;
    font-size: 18px;
    line-height: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.about__btn {
    background-color: #FFF;
}

/* .why_us_button {
    padding: 19px 58px 20px;
    font-size: 18px;
    line-height: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFF;
}
.why_us_button:hover {
      box-shadow: 0 0 0px #ffffff7a, 0 0 15px #ffffff94, 0 0 25px #ffffff5c, 0 0 30px #ffffff63;
      color:var(--color-white)
}
.why_us_button.auth_button {
    background-color: var(--primary-color);
} */

/* ------------------------------------------
   Author Section
--------------------------------------------- */
.author_section {
    padding: 80px 0;
}

.author_section p,
.testi_section p {
    font-size: 18px;
    margin-bottom: 62px;
}


/* ------------------------------------------
   Why US page css
--------------------------------------------- */
.why-truematch {
    padding: 107px 0 100px;
    background-color: #fff5f0;
}


.why-truematch .pattern_img {
    top: 50%;
    right: 0;
    transform: translate(50%, -50%);
}

.why-truematch .trurmatch_box {
    padding-left: 10rem;
}

.what-sets-section {
    background-color: #3d5150;
    padding: 8rem 0 8rem;
}

.stats h4 {
    font-family: 'Metropolis' !important;
}

.divider_stats {
    height: 2px;
}

.stat-wrap {
    padding-bottom: 10rem;
}


.contact-btn {
    position: absolute;
    bottom: 0;
    z-index: 9;
    left: 50%;
    transform: translate(-50%, 37%);
}


/* ------------------------------------------
   Contact US page css
--------------------------------------------- */
.stats_sec {
    padding: 100px 0;
}

.contact-box {
    gap: 45px;
}

.contact-box a {
    font-size: 22px;
    letter-spacing: 1px;
}

.form-left {
    background-color: #fff5f0;
    padding: 6.688rem 8.813rem 6.875rem 7.125rem;
}

.form-left h2 {
    font-size: 42px;
    line-height: 54px;
}

.content_right {
    padding: 217px 156px 124px 121px;
}

.appointment_btn {
    color: var(--color-white);
    transition: .4s all;
    background: var(--primary-color);
    border-color: transparent;
}

/* .appointment_btn:hover {
    background: var(--color-white);
    box-shadow: 0 0 0px #ffffff7a, 0 0 15px #ffffff94, 0 0 25px #ffffff5c, 0 0 30px #ffffff63;
} */

.recovery-form .form--control:not(:placeholder-shown).form--control:not(:focus)~.form--label {
    background-color: #FFF;
}

.text-appointment {
    margin: 2.938rem 0 8.5rem;
}

.form-control {
    height: 42px;
}

.img_draw {
    background-size: cover !important;
    position: absolute;
    top: -50px;
    max-width: 102px;
    width: 100%;
    height: 98px;
    transform: translate(0, 0);
}

/* login page */
.login_form .form-left {
    padding: 100px 69px 72px 80px;
}

.login_form {
    padding: 100px 0;
}

.text-for {
    color: var(--primary-color);
}

.bg-for {
    background-color: var(--primary-color);
}


/* ------------------------------------------
   Our Process CSS
--------------------------------------------- */
.process-section {
    padding: 128px 0 0;
}

.main_bg_green {
    background-color: var(--primary-color);
}

.contain_wrap {
    background-color: var(--color-cream);
}

.process-pattern {
    transform: translate(-50%, -70px);
}

.content_inner {
    margin-top: 5.5rem;
}

.content_inner img {
    top: 100px;
}

.process_step {
    padding: 140px 0 80px;
}

.divider_pro {
    padding-bottom: 61px;
    margin-bottom: 71px;
    max-width: 310px;
}

.divider_pro::after {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 8px;
    background: var(--color-white);
    box-shadow: 0 0 10px 0px #fff;
    transition: .4s all;
}

.process_item:hover .divider_pro::after {
    width: 103px;
}

.process_item:last-child::after {
    display: none;
}

.process_item h4 {
    font-size: 1.375rem;
}

.process_item p {
    font-size: 1.125rem;
}

/* step form */
.step-container {
    position: relative;
    text-align: center;
    transform: translateY(-43%);
}

.step-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #fff;
    border: 2px solid var(--primary-color);
    line-height: 30px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    cursor: pointer;
}

.step-line {
    position: absolute;
    top: 16px;
    left: 50px;
    width: calc(100% - 100px);
    height: 2px;
    background-color: var(--primary-color);
    z-index: -1;
}

.step-circle.completed {
    background: var(--primary-color);
    color: var(--color-white);
}

.progress-bar {
    background-color: var(--primary-color);
}

.form-check-label {
    font-size: 14px;
    line-height: normal;
    cursor: pointer;
}

.form-check-input {
    width: 1.5em;
    height: 1.5em;
    cursor: pointer;
}

.form-check-input:checked {
    background: url('../images/check.svg') no-repeat center / cover !important;
    border: unset;
}

.form-check-input:focus {
    box-shadow: none;
    border-color: unset;
}

.cst_selectbox .select2-container--default .select2-selection--multiple li {
    background-color: var(--primary-color);
    display: inline-flex;
    flex-direction: row-reverse;
    align-items: center;
    border: none;
    color: var(--color-white);
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 1.5rem;
    margin: 0 10px 0 0;
    border-radius: 40px;
    padding: 0 4px;
}

.cst_selectbox .select2-container--default .select2-selection--multiple li:last-child {
    margin-right: 0;
}

.cst_selectbox .select2-container--default .select2-selection--multiple li button {
    border: none;
    color: var(--color-white);
}

.cst_selectbox .select2-container--default .select2-selection--multiple li button:is(:hover, :focus) {
    background-color: var(--primary-color);
    color: var(--color-white);
    border-radius: 10px;
}


.cst_selectbox .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
    padding-left: 8px;
    padding-right: 8px;
}

.content_inner p {
    font-size: 20px;
}

.banner-section::before {
    content: '';
    background: url('../../../images/overlay.png') no-repeat center / cover;
    width: 100%;
    position: absolute;
    top: 0;
    height: 287px;
    z-index: 1;
}

.home_mission {
    padding: 100px 0;
    background-color: var(--primary-color);
}

.review_section {
    padding: 80px 0;
}

.review_section h2 {
    font-size: 42px;
    line-height: 54px;
    margin-bottom: 76px;
}

.review_section::before {
    content: '';
    background-color: #FFF5F0;
    width: 75%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    z-index: -1;
}

/* .review_section::after {
    content: '';
    background: url('../../../images/pattern.png') no-repeat center / contain;
    max-width: 216px;
    width: 100%;
    min-height: 210px;
    position: absolute;
    top: 50%;
    left: 79%;
    z-index: -1;
    transform: translate(-79%, -50%);
} */
.review_section {
    background: url('../../../images/pattern.png') no-repeat center / contain;
    background-size: 15%;
    background-position: 80% 50%;
}

.home_input .form-control {
    height: auto;
}


.last-para {
    margin-bottom: 33px;
}

.test_monial {
    max-width: 1198px;
    width: 100%;
}

.heart_img img {
    position: absolute;
    right: -2%;
    top: -50%;
}

.divider_stats:before {
    content: '';
    background: #fff;
    width: 0;
    height: 7px;
    position: absolute;
    bottom: -3px;
    left: 2px;
    box-shadow: 0 0 10px 0px #fff;
    transition: .4s all;

}

.stats:hover .divider_stats:before,
.right_boxx:hover .divider_stats:before,
.planner_text_box:hover .divider_stats::before {
    width: 90px;
}

.right_boxx .divider_stats:before {
    background-color: var(--primary-color);
}

span.required {
    color: red;
}


body .form--control::placeholder {
    opacity: 1;
    visibility: visible;
    color: rgb(151, 151, 151);
    font-size: 13px;
}

/* .form--label{
    top: 50%;
} */

input:valid+.form--label,
input:focus+.form--label {
    top: 0;
    font-size: 12px;
}

label {
    font-size: 13px;
}

:is(.mission-left img,
    .content_inner img,
    .why-truematch-img img) {
    border-radius: 24px;
}

.cst-contact {
    background-position: 29% 0;
    background-size: 103% 170%;
}

.cst-about-us {
    background-position: 29% 20%;
}

.header-fixed .navbar,
.params .main-header .navbar {
    padding: 8px 0 !important;
}

.btn-meet {
    background-color: #005f3f;
    color: #FFF;
    border-color: transparent;
}

.btn-meet:hover {
    background-color: #02412c;
    color: #FFF;
}

.public-profile__accordion .form--control:not(:placeholder-shown).form--control:not(:focus)~.form--label {
    background-color: #ffffff;
}

button.webcam_button {
    background: #d1d5db;
    padding: 10px;
    border-radius: 10px;
    width: 256px;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    color: #838383;
}


.remove-image {
    width: 16px;
    height: 16px;
    padding: 0 !important;
    display: flex;
    justify-content: center;
    align-items: center;
}



.booknow header {
    background-color: var(--primary-color);
    margin: 0 !important;
    position: unset;
}

:is(.main_booking, .benfiet-section) {
    padding: 50px 0;
}

.section_inner .inner h3,
.section_inner h3 {
    font-size: 18px;
    font-weight: 600;
    margin: 14px 0;
}

.section_inner h4 {
    font-size: 16px;
    font-weight: 600;
    margin: 14px 0;
}

.all_inner p {
    margin: 12px 0;
}

.register-page.login_form .form-check-label {
    font-size: 12px;
}


.main_verified {
    padding: 80px 0 80px;
}

.main_verified .login__wrapperr h2,
.main_wrap_left .left_boxx h2 {
    margin-bottom: 40px;
}

.main_wrap_right h2 {
    margin-bottom: 45px;
}

.main_wrap_right .divider_stats {
    margin-bottom: 81px;
}



.login__wrapperr p {
    max-width: 100%;
    font-size: 22px;
    line-height: 30px;
    color: #000000;
    margin-bottom: 39px;
}

.pattern-img {
    margin-bottom: 31px;
}

.membership_sec {
    padding: 231px 0 135px;
}

.main_wrap_left {
    background-color: var(--primary-color);
}

.main_wrap_right {
    background-color: var(--color-cream);
}

.main_wrap_left .left_boxx,
.main_wrap_right.right_boxx {
    padding: 101px 42px 100px;
}

.main_wrap_right.right_boxx .mem_ul {
    margin-bottom: 75px;
}


.main_wrap_right h4 {
    font-size: 22px;
    margin-bottom: 44px;
}

.main_wrap_left .left_boxx .last_p {
    margin-bottom: 132px;
}

.main_wrap_left .left_boxx .last_bef_p {
    margin-bottom: 45px;
}


.main_wrap_left .text_boxxx p,
.main_wrap_right.right_boxx p,
.main_wrap_right.right_boxx ul,
.main__text p {
    font-size: 20px;
}

.main_wrap_left .left_boxx h2 {
    margin-bottom: 80px;
}

.main_wrap_left .text_boxxx .common-my {
    margin-bottom: 30px;
}


.premium_section {
    padding: 80px 0 80px;
}

.video_detail .youtube-video {
    margin-bottom: 120px;
}

.youtube-video iframe {
    border: 0;
    width: 100%;
    object-fit: cover;
    height: 730px;
}


.stat_group {
    margin-bottom: 82px;
}

.maintext p {
    margin-bottom: 60px;
}

.free_section {
    padding: 80px 0 80px;
}

.main_wrap_right::before {
    content: '';
    background: url('../../../images/who-we.png') center no-repeat;
    width: 101px;
    height: 98px;
    display: inline-block;
    background-size: contain;
    position: absolute;
    top: -50px;
}

/* list wedding section */
.wedding-planner h1 {
    font-size: 56px;
    letter-spacing: -2px;
    line-height: 73px;
    text-align: center;
}

.list_style_section {
    background-color: #fff8f4;
    padding: 94px 0 102px;
}

.list_style_section .traditional-content ul {
    margin-bottom: 70px;
}

.list_style_section .head h2 {
    margin-bottom: 99px;
}

.traditional-content li:last-child {
    margin-bottom: 0;
}

/* end list wedding section */

/* The weeding section */

.planner_section {
    background-color: #3d514f;
    padding: 50px 0;
}

.planner_section .left_img_sec img {
    position: relative;
    top: 100px;
    z-index: 9;
}

.planner_text_box {
    margin-top: 95px;
    /* padding-left: 0; */
}

.planner_text_box h4 {
    font-size: 30px;
    letter-spacing: 1px;
}

/*End The weeding section */

/* planning services section */

.planning_services {
    padding: 180px 0;
    background: url('../../../images/pattern.png') no-repeat center / contain;
    background-size: 8%;
    background-position: 83.5% 11%;
}

.planning_services::before {
    content: '';
    background-color: #fff5f0;
    left: 0;
    position: absolute;
    width: 81%;
    height: 196px;
    z-index: -1;
}

.planning_services::after {
    content: url('../../../images/heart.png');
    right: 3%;
    position: absolute;
    width: 320px;
    height: 320px;
    bottom: 4%;
}

.planning_services .services_title {
    margin-bottom: 44px;
}

.services_title {
    min-height: 196px;
}


section .services_title img {
    transform: translate(-111px, -50%);
}

.service_specfic h4 {
    font-size: 22px;
    line-height: 102px;
    color: #3d514f;
}

.iconbox {
    border-radius: 16px;
    background-color: #fff8f4;
}

.inner_box_icon h5 {
    font-size: 20px;
    /* line-height: 54px; */
    color: #3d514f;
}

.inner_box_icon p {
    font-size: 18px;
}

.service_part .row__main {
    padding: 0 6rem;
}

.service_specfic:not(:last-child) {
    margin-bottom: 60px;
}

.left_wrap {
    padding-right: 120px
}

.right_wrap {
    padding-left: 120px
}

/* end planning services */


/* package section */
.packages_section {
    background-color: #fff5f0;
    padding: 0 0 100px;
}

.package_title {
    font-size: 103px;
    line-height: 102px;
    color: #3d514f;
    margin: -45px 0 80px;
}

.package-detail .main_btn_pkg {
    background-color: #ffede3;
    font-size: 22px;
    letter-spacing: 1px;
    line-height: 107%;
}

.package-detail .main-task strong {
    font-size: 18px;
}

.package-detail .book_pkg {
    background-color: #ffd3bb;
    padding: 15px 51px;
    font-size: 18px;
    color: #000000;
    line-height: 14px;
}

.package-detail.middle .book_pkg {
    margin-top: 27px;
}

.package-detail .pkg_list {
    max-height: 450px;
    height: 100%;
}


.max-w-370 {
    max-width: 370px;
}

/* package section */


/* cta section */
.planner_b_section .top_text {
    font-size: 30px;
    color: #000000;
    line-height: 107%;
    margin-bottom: 20px;
}

.planner_b_section .bottom_text {
    font-size: 18px;
    color: #000000;
}

/* end cta section */


.row-gap-3{
        row-gap: 16px;
}

.list_style_section .left_cont.traditional-content li:first-child {
    margin-bottom: 65px;
}
.list_style_section .left_cont.traditional-content li {
    margin-bottom: 92px;
}

.list_style_section .right_cont.traditional-content li {
    margin-bottom: 80px;
}

.iconbox  img{
    margin-top: 5px;
}