:root {
    --font-family-poppins: "Poppins", sans-serif;
    --color-021c0f: #021c0f;
    --color-2c3558: #4fbb56;
    --color-ff7800: #ff7800;
    --color-b0e9b0: #b0e9b0;
    --color-000000: #000000;
    --color-ffffff: #ffffff;
    --color-2c3137: #2c3137;
    --color-f2f2f2: #f2f2f2;
    --font-style-normal: normal;
    --font-size-10: 10px;
    --font-size-12: 12px;
    --font-size-14: 14px;
    --font-size-15: 15px;
    --font-size-16: 16px;
    --font-size-17: 17px;
    --font-size-18: 18px;
    --font-size-20: 20px;
    --font-size-22: 22px;
    --font-size-25: 25px;
    --font-size-30: 30px;
    --font-size-38: 38px;
        --font-size-40: 40px;

    --font-size-45: 45px;
    --font-size-50: 50px;
    --font-size-60: 60px;
    --font-size-75: 75px;
    --character-spacing-0: 0px;
    --line-height-15: 15px;
    --line-height-16: 16px;
    --line-height-17: 17px;
    --line-height-18: 18px;
    --line-height-22: 22px;
    --line-height-25: 25px;
    --line-height-40: 40px;
    --line-height-inherit: inherit;
    --font-weight-Thin: 100;
    --font-weight-ExtraLight: 200;
    --font-weight-Light: 300;
    --font-weight-Regular: 400;
    --font-weight-Medium: 500;
    --font-weight-SemiBold: 600;
    --font-weight-Bold: 700;
    --font-weight-ExtraBold: 800;
    --font-weight-Black: 900;
    --font-weight-normal: normal;
    --gradient-green1: linear-gradient(to right, #00ff88, #1C8223);
    --gradient-green2: linear-gradient(90deg, rgba(2, 37, 18, 1) 0%, rgba(0, 17, 9, 1) 100%);
    --gradient-green3: linear-gradient(180deg, rgba(2, 37, 18, 1) 0%, rgba(0, 17, 9, 1) 100%);
    --gradient-grey: linear-gradient(150deg, rgba(255, 255, 255, 1) 0%, rgba(110, 110, 110, 1) 100%);
}

* {
    outline: 0;
}

html {
    scroll-behavior: smooth;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

body {
    font-family: var(--font-family-poppins);
    font-style: var(--font-style-normal);
    font-size: var(--font-size-18);
    line-height: var(--line-height-25);
    color: var(--color-000000);
    font-weight: var(--font-weight-Medium);
    margin: 0;
    padding: 0;
    /* overflow-x: hidden; */
}

.clr {
    width: 100%;
    float: left;
}

.img {
    width: 100%;
}

.svg {
    object-fit: contain;
    object-position: center center;
}

a,
.btn,
button {
    color: var(--color-000000);
    outline: none;
    cursor: pointer;
    outline: 0;
    text-decoration: none;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

a:focus,
.btn:focus,
button:focus,
.custom-select:focus,
.form-control:focus {
    outline: none;
    box-shadow: none;
}

.btn:hover,
a:hover,
button:hover {
    color: var(--color-f19f1f);
    text-decoration: none;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

ul,
ol {
    margin: 0px;
    padding: 0px;
}

.nav-link:focus,
.nav-link:hover {
    color: var(--color-f19f1f);
}

.navbar-expand-xl .navbar-nav {
    flex-direction: row;
    align-items: center;
}

.dropdown-item.active,
.dropdown-item:active {
    color: var(--color-f19f1f);
    text-decoration: none;
    background-color: transparent;
}

li {
    list-style: none;
}

header,
footer,
section {
    width: 100%;
    float: left;
}

hr {
    border-bottom: 2px solid var(--color-f19f1f);
    border-top: 0 none;
    margin: 50px 0;
    padding: 0;
    opacity: 1;
}

p {
    font-size: var(--font-size-18);
    color: var(--color-ffffff);
    margin-bottom: 20px;
    font-family: var(--font-family-poppins);
    font-weight: var(--font-weight-Light);
    line-height: 1.5rem;
}

.main-title {
    font-size: var(--font-size-75);
}

.section-heading {
    font-size: var(--font-size-60);
}

.section-heading strong {
    font-weight: var(--font-weight-Bold);
}

.heading-three {
    font-size: var(--font-size-45);
}

.heading-four {
    font-size: var(--font-size-38);
}

.heading-five {
    font-size: var(--font-size-30);
}
.heading-six {
    font-size: var(--font-size-40);
        font-weight: var(--font-weight-SemiBold);

}
.small-heading {
    font-size: var(--font-size-22);

}

.list li {
    position: relative;
    margin-bottom: 1rem;
    display: flex
;
    text-align: left;
    padding-left: 3rem;
}
.list li::before {
    position: absolute;
    background-image: url(../images/icons/green-correct.png);
    /* font-weight: 900; */
    width: 2rem;
    height: 2rem;
    /* font-size: 1.4rem; */
    /* padding-right: 1rem; */
    content: '';
    left: 0;
    background-repeat: no-repeat;
    top: 2px;
}
.list li:last-child {
    margin-bottom: 0;
}

.list img {
    padding-right: 1rem;
    width: 2.5rem;
    height: 1.4rem;
}

.common-btn a {
    position: relative;
    display: block;
    font-size: var(--font-size-16);
    color: var(--color-ffffff);
    font-weight: var(--font-weight-Regular);
    line-height: initial;
    border-radius: 0.5rem;
    background-color: var(--color-021c0f);
    border: 1px solid #0000;
    overflow: hidden;
    display: inline-flex;
    padding: 0;
}

.common-btn i {
    transform: rotate(45deg);
    position: relative;
    transition: ease all 0.5s;
}

.common-btn .white {
    padding: 0.5rem 0.8rem;
    background-color: var(--color-ffffff);
    color: var(--color-021c0f);
}

.common-btn .text {
    padding: 0.5rem 1.5rem;
}

.common-btn a:hover i {
    transform: rotate(90deg);
}

.common-btn a:hover {
    background-color: var(--color-021c0f);
}

.common-btn:hover .white {
    background-color: var(--color-2c3558);
}

.common-btn.white a {
    position: relative;
    display: block;
    font-size: var(--font-size-16);
    color: var(--color-021c0f);
    font-weight: var(--font-weight-Regular);
    line-height: initial;
    border-radius: 0.5rem;
    background-color: var(--color-ffffff);
    border: 1px solid #0000;
    overflow: hidden;
    display: inline-flex;
    padding: 0;
}

.common-btn.white i {
    transform: rotate(45deg);
    position: relative;
    transition: ease all 0.5s;
}

.common-btn.white .white {
    padding: 0.5rem 0.8rem;
    background-color: var(--color-021c0f);
    color: var(--color-ffffff);
}

.common-btn.white .text {
    padding: 0.5rem 1.5rem;
    color: var(--color-000000);
}

.common-btn.white a:hover i {
    transform: rotate(90deg);
    color: var(--color-ffffff);
}

.common-btn.white:hover .white {
    background-color: var(--color-2c3558);
}
.common-btn button {
    position: relative;
    display: block;
    font-size: var(--font-size-16);
    color: var(--color-ffffff);
    font-weight: var(--font-weight-Regular);
    line-height: initial;
    border-radius: 0.5rem;
    background-color: var(--color-021c0f);
    border: 1px solid #0000;
    overflow: hidden;
    display: inline-flex;
    padding: 0;
}

.common-btn button i {
    transform: rotate(45deg);
    position: relative;
    transition: ease all 0.5s;
}


/* Base style for pagination bullets */

.swiper-pagination-bullet {
    width: 20px;
    height: 8px;
    border-radius: 2px;
    background: var(--color-b0e9b0) !important;
    margin: 0 4px;
    opacity: 1;
    transition: background 0.3s;
}


/* Active bullet */

.swiper-pagination-bullet-active {
    background: var(--color-2c3558) !important;
    /* active color */
    opacity: 0.5;
}


/* top-menu */

.top-menu {
    padding: 1rem 2rem;
    font-size: var(--font-size-14);
    position: relative;
    z-index: 9;
}

.top-menu i {
    color: var(--color-ffffff);
    margin-right: 1rem;
}

.top-menu i:hover {
    color: var(--color-ff7800);
}

.top-menu .social-link ul {
    display: flex;
}

.right-top-header {
    display: flex;
    justify-content: end;
    height: 100%;
}

.right-top-header .extra-small a {
    margin-left: 25px;
    color: var(--color-ffffff);
}

.right-top-header .extra-small a:hover {
    color: var(--color-ff7800);
}

.right-top-header .extra-small a img {
    width: 18px;
    height: 18px;
    object-fit: contain;
    margin-right: 10px;
}

.right-top-header ul li {
    float: left;
    margin: 0 7px;
}

.right-top-header ul li a .svg,
.right-top-header ul li a .img {
    width: 18px;
    height: 18px;
    object-fit: contain;
    fill: var(--color-f19f1f) !important;
}

.right-top-header ul li a .svg path {
    fill: var(--color-f19f1f) !important;
}

.right-top-header ul li:hover a .svg path {
    fill: var(--color-f19f1f) !important;
}


/* top-menu */

.green-background {
    position: absolute;
    top: 0;
    object-fit: cover;
}


/* @import url(../css/root.css); */

.section-space {
    padding-top: 80px;
    padding-bottom: 80px;
}


/* loader css*/


/* PRELOADER CSS */

.page-loader {
    width: 100%;
    height: 100vh;
    position: fixed;
    background: var(--color-021c0f);
    z-index: 1000;
}

.page-loader .txt {
    color: var(--color-ffffff);
    text-align: center;
    top: 40%;
    position: relative;
    text-transform: uppercase;
    letter-spacing: 0.3rem;
    font-weight: bold;
    line-height: 1.5;
}


/* SPINNER ANIMATION */

.spinner {
    position: relative;
    top: 35%;
    width: 80px;
    height: 80px;
    margin: 0 auto;
    background-color: var(--color-2c3558);
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1s infinite ease-in-out;
    animation: sk-scaleout 1s infinite ease-in-out;
}

@-webkit-keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0);
    }
    100% {
        -webkit-transform: scale(1);
        opacity: 0;
    }
}

@keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0;
    }
}


/* loader css */


/* main-banner */

.banner {
    position: relative;
    height: 900px;
    /*overflow: hidden;*/
    display: flex;
    padding-bottom: 9rem;
}

.banner-img {
    position: relative;
    display: flex;
    align-items: center;
    left: 6%;
}

.banner-left {
    width: 50%;
    position: relative;
    z-index: 99;
}

.banner-left img {
    height: 700px;
    position: relative;
    object-fit: cover;
}

.banner-right {
    width: 100%;
    position: relative;
    background: url(../images/banner/1.jpg)right no-repeat;
    background-size: cover;
    z-index: 9;
}

.banner p {
    width: 82%;
    margin-bottom: 50px;
}

.mainSlider img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.banner .inner-text {
    position: relative;
     top: 15%; 
    width: 33%;
    left: 7%;
    height: 100%;
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    justify-content: center;
    z-index: 1;
}

.banner .inner-text h6 {
    color: var(--color-2c3558);
}

.banner .inner-text h1 {
    color: var(--color-2c3558)
}


/* main-banner */


/* .banner img {
    width: 100%;
} */


/* .banner-img img{
        position: absolute;
    top: 0;
    z-index: -1;
} */

.slide-layout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* padding: 60px; */
    /* gap: 50px; */
    height: 100%;
}

.slide-text {
    position: absolute;
    left: 8%;
    color: #fff;
    font-family: var(--font-Finest-Romance-Serif);
    max-width: 50%;
    z-index: 99;
}

.slide-text,
.slide-desc {
    max-width: 60%;
}

.slide-title {
    font-size: 84px;
    font-family: var(--Finest-Romance-Serif);
    line-height: 1.2;
    margin-bottom: 20px;
    color: var(--color-ffffff);
}

.slide-desc {
    font-size: 18px;
    margin-bottom: 30px;
    color: #ddd;
}

.slide-btn {
    display: inline-block;
    background-color: var(--color-f19f1f);
    font-family: var(--font-Roboto);
    color: #000;
    padding: 12px 24px;
    font-weight: bold;
    text-decoration: none;
    border-radius: 5px;
}

.slide-image {
    flex: 1;
    text-align: right;
}

.slide-image img {
    max-width: 100%;
    height: auto;
}

.fade-right {
    animation: fadeInRight 2.5s;
}


/* about us */

.about-section {
    position: relative;
}

.about-section p {
    width: 52%;
}

.about-right {
    padding-left: 100px;
}

.leafs {
    padding: 0;
    width: 40%;
    position: absolute;
    right: 0;
    top: -20%;
    z-index: -1;
}

.count-digit,
.count-digit1,
.count-name {
    color: var(--color-f19f1f);
    font-family: var(--font-Finest-Romance-Serif);
    font-weight: var(--font-weight-Regular);
    justify-content: center;
    align-items: center;
    font-size: 150px;
    line-height: normal;
}

.count-title {
    font-size: 60px;
    line-height: 25px;
    color: var(--color-000000);
    font-family: var(--font-Finest-Romance-Serif);
    font-weight: var(--font-weight-Regular);
    margin-bottom: 0;
    text-align: left;
}

.count-area-content {
    display: flex;
    align-items: flex-start;
    justify-content: start;
    flex-direction: column;
    margin-bottom: 20px;
}

.year-exp {
    background: var(--color-2c3558);
    padding: 50px;
    border-radius: 56px 0 0 56px;
    margin-top: 150px;
    padding-top: 60px;
    padding-left: 100px;
    position: relative;
}

img.cap {
    position: absolute;
    top: -20%;
    width: 35%;
    right: 40%;
}


/* about */


/* expertise */

.expertise {
    background: url(../images/expertise-bg.jpg)center no-repeat;
    background-size: cover;
    height: 700px;
    padding-top: 100px;
    position: relative;
}

.padding-left {
    padding-left: 50px;
}

.padding-right {
    padding-right: 50px;
}

img.leafs-1 {
    position: absolute;
    left: 0;
    bottom: 0;
}

img.leafs-1 {
    position: absolute;
    left: 0;
    bottom: -35%;
    mix-blend-mode: multiply;
}


/* expertise */


/* product */

.product-section {
    background-image: url('../images/project-bg.jpg');
    background-position: center;
    background-size: cover;
    position: relative;
    background-repeat: no-repeat;
    z-index: 9;
    padding-bottom: 0 !important;
}

.product-section:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #179fd2;
    z-index: -1;
    opacity: 0.9;
}

.product-title-card {
    margin-bottom: 30px;
}

h2.product-title {
    font-size: 22px;
    font-weight: 600;
}

.product-img img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 16px;
    opacity: 1;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.product-img1 img {
    width: 100%;
    height: 625px;
    object-fit: cover;
    border-radius: 16px;
}

h2.product-title {
    font-size: var(--font-size-19);
    font-weight: var(--font-weight-SemiBold);
    background: #2c3558e0;
    text-align: center;
    padding: 12px 5px
}

.product-inner {
    overflow: hidden;
    border-radius: 16px;
    position: relative;
    margin-bottom: 25px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.product-inner-text {
    position: absolute;
    width: 100%;
    bottom: 0px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.product-img {
    background: #000;
    border-radius: 16px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.product-card {
    overflow: hidden;
    border-radius: 16px;
}

.product-card:hover .product-inner-text {
    bottom: -15px;
}

.product-card:hover .product-img img {
    opacity: 0.8;
}


/* baselineAnim-section */


/* wave-text */

.baselineAnim-section {
    padding-top: 50px;
    position: relative;
    margin-bottom: -130px;
}

.baselineAnim {
    top: -8vh;
    width: 100%;
    z-index: 3;
    overflow: hidden;
}

.baselineAnim svg {
    display: block;
    height: 22vw;
    width: 177vw;
    overflow: hidden;
    margin-left: -75%;
    margin-top: 0;
}

.baselineAnim svg .text-on-path {
    fill: #fff;
    font-size: 60px;
    font-family: var(--Finest-Romance-Serif);
    font-weight: var(--font-weight-Bold)
}


/* wave-text */


/* progress-bar */

.progress-container {
    width: 80%;
    background-color: #e0e8f5;
    height: 30px;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.progress-fill {
    height: 100%;
    width: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    box-sizing: border-box;
    color: white;
    font-weight: bold;
    transition: width 2s ease;
}

.label,
.percent {
    pointer-events: none;
}

.year-2025 {
    background-color: #2c3558;
}

.year-2024 {
    background-color: #0b2139;
}

.year-2023 {
    background-color: #2c3558;
}

.progess-bar p {
    font-size: var(--font-size-16);
    font-family: var(--font-Finest-Romance-Serif);
    margin: 0;
    margin-top: 30px;
}


/* progress-bar */


/* counter */

.count-area-content .big-title {
    font-size: 250px;
    line-height: 250px;
    margin-bottom: -20px;
    background: url(../images/89-bg.jpg) no-repeat center center;
    background-size: cover;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    /* For Firefox (Experimental) */
    background-clip: text;
    color: transparent;
}

.count-area {
    padding-top: 80px;
}

.count-area .count-digit1,
.count-area .count-name {
    color: var(--color-5c5e49);
}

.count-area .count-area-content {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border: 1px solid #0003;
    width: 260px;
    height: 260px;
    border-radius: 50%;
}

.counter-col {
    display: flex;
    justify-content: center;
}

.counter h2 {
    color: var(--color-ffffff);
}

.divider {
    width: 80%;
    background: var(--color-5c5e49);
    height: 2px;
    display: block;
    margin-top: 0px;
    float: right;
}

.counter-flex {
    justify-content: left;
}


/* donor-partner */

.donor-partner {
    position: relative;
    background: var(--color-5c5e49);
}

.dp-padding {
    padding-left: 180px;
}


/* donor-partner */


/* milestones */

.milestones {
    background: url(../images/milestone-bg.png)center no-repeat;
    background-size: cover;
    position: relative;
    height: 600px;
}

.milestones img {
    position: absolute;
    top: 0;
    left: 16%;
}

.milestones h2 {
    color: var(--color-282728);
}

.milestone-page {
    padding-bottom: 200px;
    margin-bottom: -100px;
}

.milestones-padding {
    padding-right: 100px;
}

.custom-select-icon {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    color: #555;
    pointer-events: none;
}

.custom-select {
    padding-left: 2.5rem;
    /* space for the icon */
}

.border-divide {
    width: 100%;
    height: 2px;
    background: #8d8d8d1a;
    position: absolute;
    left: 0;
    margin-top: 50px;
}

.certificate-year-list h5 {
    font-size: var(--font-size-38);
    font-weight: var(--font-weight-SemiBold);
    color: var(--color-5c5e49);
}

.certificate-year-list h4 {
    font-size: var(--font-size-22);
    color: var(--color-282728);
    font-weight: var(--font-weight-SemiBold);
    margin-bottom: 30px;
}

.year-flex {
    display: flex;
    flex-direction: column;
    gap: 25px;
    border: 1px solid #efefef;
}

.year-select {
    cursor: pointer;
    padding: 15px;
    font-size: var(--font-size-22);
    font-weight: bold;
    background: #fff7ef;
}

.form-select:focus {
    border-color: #5c5e49;
    outline: 0;
    box-shadow: 0 0 0 .25rem #ff7b0028;
}

.certificate-year-list ul li {
    display: flex;
    gap: 15px;
    border-bottom: 1px solid #bfbfbf;
    padding-bottom: 5px;
    margin-bottom: 20px;
    align-items: center;
}

.certificate-year-list ul li img {
    width: 35px;
    height: 35px;
}


/* Fade and slide-up animation */

@keyframes fadeSlideUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}


/* Apply animation to active tab pane */

.tab-pane {
    animation: none;
    /* Reset default */
}

.tab-pane.active.show {
    animation: fadeSlideUp 0.6s ease-in-out both;
}


/* milestones */


/*============= CONTACT ===============*/

.contact {
    background: url(../images/contac-right.jpg)right no-repeat;
    background-size: cover;
    padding: 100px;
    padding-bottom: 250px !important;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-bottom: -100px;
}

.contact::before {
    position: absolute;
    content: "";
    width: 50%;
    height: 100%;
    background: url(../images/contact-section.jpg)center no-repeat;
    background-size: cover;
    left: 0;
    top: 0;
}

.contact .contact-content {
    min-width: 100%;
    min-height: 512px;
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
}

.contact .shape h2 {
    color: var(--color-ffffff);
    font-family: var(--Finest-Romance-Serif);
}

.contact .shape {
    position: absolute;
    content: "";
    width: 50%;
    top: 40px;
    z-index: 1;
    padding: 40px;
    left: 0;
    height: calc(100% - 80px);
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15);
    background-image: linear-gradient(to top, #d87112, #5c5e49);
}

.contact .contact-form {
    position: absolute;
    content: "";
    background-color: #fff;
    padding: 70px 50px;
    padding-left: 33% !important;
    margin-left: 20%;
    width: calc(85% - 150px);
    height: fit-content;
    box-shadow: 0 50px 50px rgba(0, 0, 0, 0.35);
}

.contact .contact-form::before {
    position: absolute;
    content: "Send A Message";
    top: 0;
    right: 0;
    background: var(--color-5c5e49);
    color: white;
    padding: 8px;
    z-index: -1;
    border-bottom-left-radius: 25px;
}

.contact-content p {
    color: var(--color-ffffff);
    font-size: var(--font-size-19);
}

@media(max-width:805px) {
    .contact .contact-form::before {
        font-size: 14px;
    }
}

.contact .info {
    margin: 10px 0px;
}

.contact .info li {
    display: flex;
    margin-bottom: 0;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

.contact .info li a {
    color: var(--color-ffffff);
}

.contact .info span {
    color: #fff;
    margin-right: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
}

.contact .info i {
    font-size: 22px;
    width: 45px;
    height: 45px;
    background: #fff;
    color: var(--color-5c5e49);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}

.contact .social {
    width: 100%;
}

.contact .social ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
}

.contact .social a {
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 40%;
    background: white;
    position: relative;
    overflow: hidden;
    box-shadow: 1px 6px 17px -2.5px #000;
}


/* SOCIAL STYLE */

.contact .social a::before {
    position: absolute;
    content: "";
    width: 120%;
    height: 120%;
    background-color: #333;
    transform: rotate(45deg);
    left: -145%;
    top: 90%;
}

.contact .social a:hover i {
    color: white;
    transform: scale(1.2);
}

.contact .social i {
    font-size: 29px;
    color: #4070f4;
    ;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.2s linear;
}

.social a:hover::before {
    animation: aaa 0.7s 1;
    top: -10%;
    left: -10%;
}

@keyframes aaa {
    0% {
        top: -110%;
        left: 90%;
    }
    50% {
        top: 10%;
        left: -30%;
    }
    100% {
        top: -10%;
        left: -10%;
    }
}


/* END SOCIAL STYLE */

.form-section {
    position: relative;
    background-color: var(--color-021c0f);
}

.form-section .section-heading {
    position: absolute;
    bottom: 92px;
    z-index: 5;
}

.form-section::before {
    background-color: #f2f2f2;
    top: 0;
    position: absolute;
    content: '';
    height: 300px;
    width: 100%;
}

.form-section::after {
    background-image: url(../images/form-bg.jpg);
    background-size: cover;
    width: 100%;
    height: 85%;
    background-repeat: repeat;
    /* background-position: center; */
    z-index: 0;
    position: absolute;
    content: '';
    top: 4px;
    margin-top: 3%;
}

.form-section h4 {
    color: var(--color-021c0f)
}

.form-section h3 {
    display: flex;
    align-items: flex-start;
    height: 75%;
    padding-bottom: 0;
    z-index: 9;
    position: relative;
    flex-direction: column;
    text-align: left;
}


/* contact page */

.form-contact {
    padding: 3rem 3rem;
    border-radius: 1rem;
    border: transparent;
    z-index: 1;
    position: relative;
    background-color: var(--color-ffffff);
    border: 0.15rem solid var(--color-021c0f);
    /* height: 131%; */
    margin-top: -4%;
    /* padding-top: 5rem; */
    width: 600px;
    margin: 0 auto;
}
.form-contact .iti {
    margin-top: 1.5rem !important;
    margin-bottom: -6px !important;
}
.form-contact .common-btn{
    margin-top:1.5rem;
}
.form-contact p{
    font-size: var(--font-size-16);
}
form label {
    font-size: 0.875rem;
    color: var(--color-021c0f);
    cursor: pointer;
}

form label,
form input {
    float: left;
    clear: both;
}

form input {
    padding: 0.8rem;
    width: 100%;
    outline: none;
    border: 1px solid var(--color-2c3137);
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -ms-transition: 0.2s ease all;
    -o-transition: 0.2s ease all;
    transition: 0.2s ease all;
    /* border: transparent; */
    margin-top: 1.5rem;
    /* padding-top: 0; */
    border-radius: 0.5rem;
    font-size: 1rem;
    color: var(--color-2c3137) !important;
}

form textarea {
    border-radius: 0.5rem;
    margin-bottom: 2rem;
    padding: 0.938rem;
    width: 100%;
    outline: none;
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -ms-transition: 0.2s ease all;
    -o-transition: 0.2s ease all;
    transition: 0.2s ease all;
    border: transparent;
    border: 1px solid var(--color-2c3137);
    /* margin-bottom: 1.875rem; */
    height: 90px;
}

form textarea::placeholder {
    color: var(--color-2c3137) !important;
}

form input::placeholder {
    color: var(--color-2c3137) !important;
}

form input[type="text"]:focus,
form input[type="email"]:focus,
form input[type="number"]:focus,
form input[type="file"]:focus,
form input[type="website"]:focus {
    border-color: var(--color-ff7800);
}

form .form-select {
    border-radius: 0.5rem;
     margin-top: 1.5rem;

    padding: 0.938rem;
    width: 100%;
    outline: none;
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -ms-transition: 0.2s ease all;
    -o-transition: 0.2s ease all;
    transition: 0.2s ease all;
    border: transparent;
    border: 1px solid var(--color-2c3137);
    /* margin-bottom: 1.875rem; */
    color: var(--color-2c3137) !important;
}


/* form .form-select option {
  color: white;
  background-color: #007BFF;
  font-size: 16px;
  padding: 10px;
} */

input[type="submit"] {
    padding: 0.938rem 3.125rem;
    width: auto;
    border: none;
    color: white;
    cursor: pointer;
    display: inline-block;
    float: right;
    clear: right;
    -webkit-transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -ms-transition: 0.2s ease all;
    -o-transition: 0.2s ease all;
    transition: 0.2s ease all;
}

form textarea::placeholder {
    color: var(--color-2c3137) !important;
}

input[type="submit"]:hover {
    opacity: 0.8;
}

input[type="submit"]:active {
    opacity: 0.4;
}


/* Contactpage */


/* footer */

.footer {
    width: 100%;
    background-color: var(--color-021c0f);
    position: relative;
    overflow: visible;
    font-size: var(--font-size-14);
}

.top-footer h6 {
    color: var(--color-2c3558);
    text-transform: uppercase;
    margin-bottom: 2rem;
    font-size: var(--font-size-18);
}

.top-footer .title {
    color: var(--color-f19f1f);
    margin-bottom: 30px;
    text-transform: uppercase;
}

.top-footer p {
    color: var(--color-ffffff);
}

.top-footer a {
    color: var(--color-ffffff);
}

.top-footer h4 {
    color: var(--color-2c3558);
    font-size: var(--font-size-18);
}

img.footer-bg {
    content: "";
    position: absolute;
    background: url(../images/footer-top.png) center no-repeat;
    background-size: cover;
    top: -120px;
    left: 0;
    width: 100%;
    z-index: 99;
}

.addres-section {
    padding-right: 10rem;
}

.footer-box p {
    color: #fff;
    padding-right: 30px;
    margin-bottom: 30px;
}

.footer-social ul {
    display: flex;
}

.footer-social ul li {
    float: left;
    margin-right: 18px;
}

.footer-social ul li i {
    font-size: 20px;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    transition: 0.5s;
}

.footer-social ul li i:hover {
    color: var(--color-ff7800);
}

.footer-heading {
    font-size: var(--font-size-16);
    margin-bottom: 20px;
    font-weight: 600;
    color: var(--color-56e8f5);
}

.footer-menu ul li a:hover i {
    color: var(--color-5c5e49);
}

.footer-menu ul li a:hover {
    color: var(--color-ff7800);
}

.footer-menu ul li i {
    font-size: var(--font-size-16);
    margin-right: 10px;
    color: #fff;
    transition: 0.5s;
}

.footer-menu ul li a {
    width: fit-content;
    color: #fff;
    display: flex;
    align-items: center;
    font-size: var(--font-size-16);
    margin-bottom: 0.5rem;
    font-weight: var(--font-weight-Regular);
}

.footer-menu ul li a:hover {
    margin-left: 8px;
}

.footer-logo img {
    margin-bottom: 2rem;
}

.footer-social {
    margin-top: 40px;
}

ul.footer-contact li {
    display: flex;
    gap: 15px;
    margin-bottom: 1rem;
    align-items: flex-start;
}

ul.footer-contact li p {
    margin: 0;
    color: var(--color-2c3558);
}

ul.footer-contact li a {
    margin: 0;
    color: var(--color-ffffff);
    font-size: var(--font-size-16);
    line-height: normal;
    word-break: break-word;
}

ul.footer-contact li a:hover {
    color: var(--color-ff7800);
}

ul.footer-contact li i {
    color: var(--color-ffffff);
    top: 4px;
    position: relative;
    font-size: var(--font-size-16);
}

.details {
    display: flex;
    flex-direction: column;
}


/* copy-right  */

.copy-right {
    background-color: var(--color-000000);
    padding: 2rem 0;
}

.copy-right p,
.copy-right p a {
    font-size: var(--font-size-16);
    color: var(--color-ffffff);
    margin-bottom: 0;
}

.copy-right p a {
    color: var(--color-2c3558);
}

.copy-right p a:hover {
    color: var(--color-ff7800);
}

ul.footer-contact {
    position: relative;
    z-index: 99;
}

img.elipse-footer {
    position: absolute;
    width: 20%;
    bottom: 10px;
    bottom: 110px;
    z-index: 9;
}


/* Include button styles from previous response */

.custom-button {
    position: relative;
    display: inline-block;
    display: flex;
    cursor: pointer;
    outline: none;
    border: 0;
    vertical-align: middle;
    text-decoration: none;
    background: transparent;
    /* padding: 0; */
    font-size: inherit;
    font-family: inherit;
    width: 100%;
    /* height: 100px; */
    flex-direction: row;
    justify-content: space-between;
    padding-left: 50px;
    padding-right: 30px;
    align-items: center;
    margin-bottom: 30px;
}


/* download brocher */

.social-btn {
    display: flex;
    width: 239px;
    height: 55px;
    align-items: center;
    justify-content: space-between;
    padding-left: 15px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    border: 1px;
    border-radius: 30px 0px 0px 30px;
    margin-bottom: 5px;
    position: relative;
    right: -188px;
    transition: right 1s;
}

.social-btn i {
    font-size: 29px;
    line-height: 20px;
    padding-right: 6px;
}

.social {
    position: fixed;
    top: 40%;
    right: 0;
    z-index: 999;
}

.social a {
    text-decoration: none;
}

.color-download-brochure {
    background-color: #2b8b2e;
}

.google-font {
    font-size: 18px;
}

.social-btn img {
    width: 40px;
}

.social-btn p {
    color: white;
    margin-top: 0px;
    margin-bottom: 0px;
}

.nav-tabs {
    border-bottom: none;
}

.sidenav,
.mobile-toggle {
    display: none;
}

.mobile {
    display: none;
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    max-width: 1620px;
}


/* back to top */

#button {
    display: inline-block;
    background-color: var(--color-2c3558);
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 3rem;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color .3s, opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
}

#button::after {
    content: "\f077";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    font-size: var(--font-size-16);
    line-height: 50px;
    color: #fff;
}

#button:hover {
    cursor: pointer;
    background-color: #333;
}

#button:active {
    background-color: #555;
}

#button.show {
    opacity: 1;
    visibility: visible;
}

#whatsapp.show {
    opacity: 1;
    visibility: visible;
    text-decoration: none;
    -webkit-transition: all 0.8s ease-out 0s;
    -moz-transition: all 0.8s ease-out 0s;
    -ms-transition: all 0.8s ease-out 0s;
    -o-transition: all 0.8s ease-out 0s;
    transition: all 0.8s ease-out 0s;
}

.whatsapp-btn {
    position: fixed;
    bottom: 12%;
    opacity: 0;
    right: 35px;
    z-index: 999;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background-color: #25D366;
    border: 1px solid #fff;
    display: flex;
    visibility: hidden;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    animation: breathe 2s ease-in-out infinite;
}


/*Estilos solo al icono whatsapp*/

.whatsapp-btn i {
    color: #fff;
    font-size: 24px;
    animation: beat 2s ease-in-out infinite;
    text-decoration: none;
    line-height: 0px;
}


/*Estilos con animation contorno respirando*/

@keyframes breathe {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}


/*Estilos de animacion del icono latiendo*/

@keyframes beat {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1);
    }
}


/* lad */

section.section-space.lad {
    position: relative;
    margin-top: 50px;
    padding: 50px 0;
}

section.section-space.lad:before {
    content: "";
    position: absolute;
    width: 80%;
    height: 100%;
    background: var(--color-5c5e49);
    border-radius: 36px 0 0 36px;
    z-index: -9;
    top: 0;
    right: 0;
}

section.section-space.lad1 {
    position: relative;
    margin-top: 100px;
    padding: 50px 0;
}

section.section-space.lad1:before {
    content: "";
    position: absolute;
    width: 80%;
    height: 100%;
    background: #193074;
    border-radius: 0 36px 36px 0;
    z-index: -9;
    top: 0;
    left: 0;
}

.lad-slider img {
    border-radius: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.lad .lad-content {
    padding-left: 50px;
}

.lad1 .lad-content {
    padding-right: 50px;
}

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

section.section-space.lad2:before {
    background: #d5effc;
}

section.section-space.lad3:before {
    background: #c93137;
}

.testimonial-section .designation {
    font-size: var(--font-size-10);
    line-height: 1rem;
    font-weight: 500;
    line-height: normal;
}

.testimonial-section {
    position: relative;
    overflow: hidden;
}

.testimonial-thumbs .testimonial-content small {
    line-height: 5px !important;
}

.testimonial-section .content {
    padding: 5rem;
}

.thumb-img {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--color-2c3558);
    margin-top: 3px;
}

.testimonial-slider {
    overflow: hidden;
}

.testimonial-slider .content {
    text-align: center;
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 0;
    left: 0;
    width: 100%;
    position: relative;
    left: 0;
    text-align: left;
    margin-top: 2rem;
}

.swiper-pagination-bullet {
    width: 2rem;
    height: 0.5rem;
    opacity: 0.4;
    background-size: cover;
    background-position: center;
    border-radius: 5px;
    margin: 0 5px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
        background-color: var(--color-2c3558) !important;
}

.swiper-pagination-bullet-active {
    opacity: 1;
           background-color: var(--color-2c3558) !important;

}

.testimonial-slider h4 {
    color: var(--color-021c0f);
    font-size: var(--font-size-38);
    font-style: italic;
    font-weight: var(--font-weight-SemiBold);
}

.testimonial-slider p {
    color: var(--color-000000);
}

.testimonial-section::after {
    background-color: var(--color-2c3558);
    width: 40%;
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    height: 100%;
    z-index: 0;
}

.testimonial-left {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.testimonial-left h6 {
    font-size: var(--font-size-22);
    color: var(--color-ffffff);
    margin-top: 2rem;
}

.client-logo-slider img {
    border: 0.1rem solid var(--color-f2f2f2);
}

.client-section {
    overflow: hidden;
    background-color: var(--color-ffffff);
}

.service-box {
    position: relative;
    padding: 2rem;
    border-radius: 1rem;
    background: var(--gradient-green3);
    z-index: 1;
    padding-top: 5rem;
    margin-top: 3rem;
    min-height: 325px;
}

.service-slider .swiper-slide {
    height: 100%;
}

.service-slider .service-box {
    justify-content: center;
    min-height: 340px;
    display: flex;
    align-items: center;
    flex-direction: column;
    /* Animated border using ::before */
}

.service-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.1rem;
    background: linear-gradient(120deg, #00ff88, #00ffd5, #044728);
    background-size: 200% 200%;
    animation: shine-border 4s linear infinite;
    border-radius: inherit;
    z-index: -1;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    -webkit-mask-composite: destination-out;
}

@keyframes shine-border {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 200% 50%;
    }
}

.service-box h5 {
    color: var(--color-ffffff);
    font-weight: var(--font-weight-Bold);
}

.service-left-img {
    position: absolute;
    z-index: 1;
}

.service-box .icon {
    width: 7rem;
    height: 7rem;
    top: -60px;
    padding: 1rem;
    border-radius: 10rem;
    border: 0.15rem solid transparent;
    background: var(--gradient-green3), /* this becomes the border */
    var(--gradient-green1);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    margin-bottom: 0;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service-box p {
    margin-bottom: 0;
}

.service-right-content {
    position: relative;
    z-index: 2;
    overflow: hidden;
    color: var(--color-ffffff);
}

.service-right-content .small-heading {
    color: var(--color-2c3558);
}

.service-section {
    position: relative;
    background-color: var(--color-021c0f);
    overflow: hidden;
    padding-bottom: 6rem;
}

.green-bg-section {
    background-image: url(../images/banner-bg.jpg);
    /*background-size: cover;*/
    /* background-position: top; */
    background-repeat: repeat-x;
    /* background-attachment: fixed; */
    width: 100%;
    height: 100%;
        background-color: #001d0f;
}
.main-section{
   background: #021c0f; 
}
.who-bg {
    background-image: url(../images/who-bg.png);
    padding: 4rem;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 8;
    position: relative;
    width: 100%;
}

.counter {
    margin-top: 5rem;
}

.counter .count {
    color: var(--color-2c3558);
    font-size: var(--font-size-50);
}

.counter .plus {
    color: var(--color-2c3558);
    font-size: var(--font-size-50);
}

.counter #counter {
    display: flex;
    flex-direction: row;
}

.counter #counter li {
    margin-right: 5rem;
    width: 25%;
}

.counter #counter li:last-child {
    margin-right: 0rem;
}

.counter #counter li p {
    margin-top: 1rem;
}

.who-section {
    position: relative;
    padding-bottom: 16rem !important;
    z-index: 0;
}

.who-content {
    color: var(--color-ffffff);
}

.who-content .section-heading {
    color: var(--color-ffffff);
}
.who-content .small-heading {
    color: var(--color-2c3558);
}

.who-right-img {
    position: relative;
}

.who-right-img img {
    position: absolute;
    right: 2%;
    bottom: -223px;
    width: 35%;
    z-index: 9;
}

.blog-section {
    background: var(--color-ffffff);
    position: relative;
    overflow: hidden;
}

.blog-section .container {
    z-index: 9;
    position: relative;
}

.blog-left-content {
    overflow: hidden;
}

.blog-box {
    border: 0.2rem solid var(--color-2c3558);
    border-radius: 2rem;
    background-color: transparent;
    padding: 2rem;
}

.blog-box img {
    height: 300px;
    width: 100%;
    object-fit: cover;
}

.blog-box a:hover {
    color: var(--color-2c3558);
    text-decoration: underline;
}

.blog-left-content .swiper-wrapper .swiper-slide:nth-child(even) {
    margin-top: 2rem;
}

.blog-left-content .swiper-wrapper .blog-right-img {
    right: 0;
    bottom: 0;
    height: 100%;
    object-fit: cover;
    position: absolute;
    overflow: hidden;
}

.blog-right-img {
    position: absolute;
    right: -46%;
    top: 0;
    width: 100%;
}

.blog-box .date {
    margin-bottom: 2rem;
}

.blog-box h6 {
    margin-bottom: 1rem;
    color: var(--color-2c3558);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.blog-box p {
    margin-bottom: 2rem;
    color: var(--color-000000);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.gallery {
    width: 100%;
}

.testimonial-slider {
    width: 100%;
    height: auto;
    margin: 0 0 10px 0;
}

.testimonial-thumbs .swiper-slide {
    width: 100%;
    height: 100%;
    text-align: center;
    /* overflow: hidden; */
    padding: 1rem;
    transform: scale(0.8);
    margin: 0rem;
    left: 0;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0 auto;
    justify-items: center;
}

.testimonial-section .content {
    padding: 5rem;
    padding-bottom: 0;
}

.testimonial-slider .swiper-slide img {
    display: block;
    width: auto;
    height: 100%;
    margin: 0 auto;
}

.testimonial-thumbs {
    width: 500px;
    padding: 0;
    overflow: hidden;
    margin: 0 auto;
}

.testimonial-content h5 {
    color: var(--color-000000);
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    background-image: none !important;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    background-image: none !important;
    left: 143px;
    right: auto;
}

.testimonial-nav {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: center;
    top: -90px;
    width: 91%;
}

.testimonial-content {
    display: none;
}

.testimonial-thumbs .swiper-slide-active {
    opacity: 1;
    width: 30%;
    transform: scale(1.3);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.testimonial-thumbs .swiper-slide-active .testimonial-content {
    display: block;
}

.testimonial-thumbs .swiper-slide-active .testimonial-content p {
    margin-bottom: 0;
    font-weight: var(--font-weight-Bold);
    margin-top: 0.5rem;
    font-size: var(--font-size-14);
    line-height: normal;
}

.testimonial-thumbs .swiper-slide-active .testimonial-content p small {
    font-size: var(--font-size-10);
    font-weight: var(--font-weight-Regular);
    line-height: auto;
}

.testimonial-thumbs .swiper-slide img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.vertical-window {
    position: relative;
}

.vertical-window .vertical-widget-wrapper {
    transform: rotate(-90deg);
    line-height: 1.5;
    white-space: nowrap;
    filter: opacity(0.5);
}

.vertical-window .vertical-widget-wrapper .vertical-widget {
    animation: scrollText 5s linear 1s infinite;
}

.vertical-window .vertical-widget-wrapper span {
    margin-right: 1em;
    font-size: 4rem;
    color: #00311c;
    font-family: "Oswald", sans-serif;
    font-weight: 800;
    line-height: 4rem;
    text-transform: uppercase;
}

@keyframes scrollText {
    0% {
        transform: translateX(-300px);
    }
    100% {
        transform: translateX(-600px);
    }
}

.fix-social {
    display: none;
}

.sidenav,
.mobile-toggle {
    display: none;
}

.mobile-md-none {
    display: block !important;
}

.desktop-md-none {
    display: none !important;
}

.mobile-none {
    display: block !important;
}

.desktop-none {
    display: none !important;
}

.search-wrapper {
    position: relative;
}

.search-box {
    border: 0.5rem solid #ffff;
    border-radius: 3rem;
    background-color: #a1f29c;
    width: 28rem;
    /* display: flex
; */
    align-items: center;
    /* justify-content: center; */
    height: 100%;
    position: absolute;
    top: 6rem;
    margin: 0 auto;
    color: var(--color-021c0f);
    height: 5rem;
    left: 5rem;
    font-size: var(--font-size-18);
}

.search-box i {
    padding: 1.3rem;
    font-size: var(--font-size-18);
}

.search-box {
    height: 4rem;
}

.search-wrapper .search-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.search-box i {
    padding: 1.0rem;
}

.search-wrapper .search-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.typing-box h6 {
    text-align: left;
    position: relative;
    top: -35px;
    left: 49px;
}

.cursor {
    display: inline-block;
    width: 1ch;
    animation: blink 0.7s steps(1) infinite;
}

@keyframes blink {
    0%,
    100% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}


/* Section Styling */

.process-steps {
    background-color: var(--color-021c0f);
    text-align: center;
    position: relative;
    background-image: url(../images/process-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

.process-steps img {
    margin: 0 auto;
}


/* .process-steps::after {
    object-fit: cover;
    width: 100%;
    height: 100%;
    background-image: url(../images/process-bg.jpg);
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    z-index: 0;
    opacity: 0.15;
    filter: opacity(0.5);
    background-blend-mode: soft-light;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
} */

.process-steps .container {
    position: relative;
    z-index: 9;
}

.process-steps .green-span {
    color: #23b58a;
}

.bg-wrapper {
    position: absolute;
    height: 100%;
    width: 100vw;
    overflow: hidden;
    top: 0;
    z-index: 0;
    opacity: 0.3;
}


/* .overlay {
  height: 100vh;
  width: 100vw;
  background: linear-gradient(45deg, #8b8b8b54, #777777);
} */

.bg {
    height: 400vh;
    width: 400vw;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    background: url(https://flowcharts.sapphire-games.com/img/dots.svg);
    background-size: 250px;
    animation: move 100s linear infinite;
    transform: rotateX(50deg) rotateY(3deg) rotateZ(-21deg) translateX(-50%) translateY(-50%);
}

@keyframes move {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 100% -100%;
    }
}


/* Graph Layout */

.actual-graph {
    position: relative;
    height: 400px;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.step {
    position: absolute;
    width: 22%;
    padding: 15px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.step:hover {
    transform: translateY(-5px);
}

.step h4 {
    font-family: "Rubik-Medium", sans-serif;
    font-size: 18px;
    color: #2a2a2e;
    margin-bottom: 10px;
    line-height: 28px;
}

.step p {
    font-family: "Rubik-Regular", sans-serif;
    font-size: 15px;
    color: #46464c;
    line-height: 22px;
}


/* Positioning Each Step */

.step-1 {
    left: 0%;
    top: 42%;
}

.step-2 {
    left: 13%;
    top: -8%;
}

.step-3 {
    left: 37.5%;
    top: 42%;
}

.step-4 {
    left: 61%;
    top: -8%;
}

.step-5 {
    left: 85%;
    top: 42%;
}

.step-6 {
    left: 37.5%;
    top: 90%;
}


/* Wavy Divider */

.wavy-divider {
    position: relative;
    height: 95px;
    width: 100%;
    margin-top: 100px;
}

.wavy-divider::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 120 20" xmlns="http://www.w3.org/2000/svg"><path d="M0 10 Q 30 0 60 10 T 120 10" stroke="%234fbb56" fill="transparent" stroke-width="2"/></svg>') repeat-x;
    background-size: contain;
    opacity: 0.8;
}


/* Responsive Adjustments */

@media (max-width: 992px) {
    .step {
        width: 40%;
    }
    .step-1,
    .step-2,
    .step-3,
    .step-4,
    .step-5,
    .step-6 {
        position: static;
        margin: 20px auto;
    }
    .actual-graph {
        height: auto;
        flex-direction: column;
        align-items: stretch;
    }
}

.strategy-section {
    background-color: var(--color-021c0f);
}

.strategy-left {
    display: flex;
    /* align-items: center; */
    flex-direction: column;
    height: 100%;
    justify-content: center;
}

.strategy-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.strategy-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dart-img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 3%;
    left: 57%;
    z-index: 2;
}

.dart-img img {
    width: 32%;
}

.search-bg {
    position: absolute;
    top: 7%;
    right: 0;
    z-index: 0;
}

.dart-board {
    position: relative;
    /* width: fit-content; */
    display: flex;
    align-items: flex-end;
    /* justify-content: center; */
    left: 31%;
    bottom: -19%;
    z-index: 1;
    height: 100%;
    /* margin-bottom: 150px; */
}

.dart-board img {
    width: 100%;
    /* height: 100%; */
    position: relative;
    /* bottom: 0; */
    /* right: 0; */
    /* animation: moveAndRotate 5s linear infinite; */
    z-index: 99;
}

@keyframes moveAndRotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.faq-section .accordion-item {
    border: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
    margin-bottom: 1rem;
    border-radius: 0rem;
    background-color: var(--color-f2f2f2);
}

.faq-section .accordion-header {
    margin-bottom: 0;
}

.faq-section .accordion-button {
    padding: 0.5rem 0;
    color: var(--color-000000);
    background-color: transparent;
    box-shadow: none;
    font-size: var(--font-size-20);
    text-transform: capitalize;
    font-weight: var(--font-weight-Bold);
    padding-bottom: 1.5rem;
}

.faq-section .accordion-body {
    padding-bottom: 1rem;
    line-height: 1.5rem;
    margin-bottom: 0;
    text-align: left;
    padding-top: 0;
    padding-left: 0;
    color: var(--color-000000);
}

.accordion__wrapper {
    border-radius: 1rem;
    width: 100%;
}

.accordion__wrapper .title {
    margin-bottom: 80px;
}

.accordion__title {
    text-align: center;
    margin-bottom: 4rem;
}

.accordion__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    font-size: var(--font-size-19);
}

.accordion__icon {
    background-color: var(--color-ec1f2b);
    width: 2.2rem;
    height: 2.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    flex-shrink: 0;
}

.accordion__question {
    color: var(--color-000000);
    font-size: var(--font-size-25);
}

.accordion__answer {
    padding: 2rem 0;
}

.accordion__content {
    overflow: hidden;
    height: 0;
    transition: all ease 0.5s;
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
    transition: all 0.5s;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E");
}

.accordion-button::after {
    transition: all 0.5s;
}

.faq-section {
    background-color: var(--color-f2f2f2);
}

.process-steps canvas {
    display: flex;
    width: 99vw;
    height: 100vh;
    position: absolute;
    z-index: 0;
    bottom: -25%;
    /* filter: drop-shadow(2px 4px 6px black); */
    /* filter: grayscale(1); */
    /* background-color: #00ffff; */
    opacity: 0.5;
    /* background-blend-mode: color-burn; */
}


/* contact page */
.inner-banner {
    position: relative;
    width: 100%;
    height: auto;
    display: flex
;
    align-items: center;
    padding-top: 13rem;
    padding-bottom: 6rem;
}

.inner-banner .inner-text {
    width: 90%;
    left: 0;
    padding-left: 3rem;
}

.inner-banner .inner-text .small-heading {
    color: var(--color-2c3558);
}

.phone-img-right img {
    width: 70%;
    height: auto;
    position: relative;
    top: 15%;
    right: 0;
    z-index: 1;
}

.phone-img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 3%;
    left: 57%;
    z-index: 2;
}

.map {
    position: relative;
    overflow: hidden;
}

.map .container {
    position: relative;
}

.map iframe {
    top: 0;
    position: absolute;
    margin-bottom: 0;
    height: 100%;
    height: 100%;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: url(grayscale.svg);
    filter: grayscale(1);
}

.contact-box {
    width: 500px;
    position: relative;
    z-index: 9;
    padding: 3rem;
    background-color: var(--color-000000);
    margin-top: 5%;
    color: var(--color-ffffff) !important;
    border-radius: 2.5rem;
    right: 0;
    margin: 4rem;
    margin-right: 0;
    float: right;
}

.call-box {
    margin: 3rem 0;
}

.call-box a {
    color: var(--color-2c3558);
}

.call-box a:hover {
    color: var(--color-ff7800);
}

.email-box {
    margin: 2rem 0;
}

.email-box a {
    color: var(--color-2c3558);
}

.email-box a:hover {
    color: var(--color-ff7800);
}

.contact-form-section {
    position: relative;
    background-color: transparent;
    background-image: url(../images/elevate-bg.jpg);
    background-attachment: fixed;
    background-blend-mode: overlay;
    background-color: #001d10;
    background-size: cover;
    overflow: hidden;
}

.contact-form-section .form-contact {
    margin-top: 0;
}

.contact-form-section::before {
    display: none;
}

.contact-form-section .form-right {
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    padding-left: 3rem;
}

.contact-form-section .form-right a {
    color: var(--color-2c3558);
}

.contact-form-section .form-right a:hover {
    color: var(--color-ff7800);
}

.what-section {
    background-color: var(--color-ffffff);
}

.what-section .what-slider .swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    text-align: center;
}

.startup-section {
    background-image: url(../images/love-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

.service-slider .swiper-slide {
    height: 100%;
}

.why-section {
    background-color: var(--color-021c0f);
     overflow: hidden;
}

.why-section .container .row {
    display: flex;
    justify-content: center;
    height: 100%;
    justify-items: center;
    align-items: center;
}
.about-what-section{   overflow: hidden;}
.about-what-section .swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    text-align: center;
}

.about-what-section .section-heading {
    color: var(--color-000000);
}

.experience-section {
    background-color: var(--color-021c0f);
    background-image: url(../images/process-bg.jpg);
    background-position: center;
    background-size: cover;
}

.build-section {
    display: flex;
    align-items: center;overflow: hidden;
}

.build-left {
    display: flex;
    justify-content: center;
    height: 100%;
    flex-direction: column;
    /* align-items: center; */
}

.build-left .common-btn {
    padding-right: 1rem;
}

.build-section p {
    color: var(--color-000000);
}

.why-right-content {
    color: var(--color-ffffff);
}

.why-right-content .accordion-item {
    background-color: transparent;
    border: transparent;
    border-radius: 0;
}

.why-right-content .accordion-item .accordion-button {
    background-color: transparent;
    border: transparent;
    box-shadow: none;
    font-size: var(--font-size-30);
    color: var(--color-ffffff);
    padding: 1.5rem 0px;
}

.why-right-content .accordion-body {
    background-color: transparent;
    border: transparent;
    font-size: var(--font-size-18);
    color: var(--color-ffffff);
    padding-top: 0rem;
    padding-bottom: 2rem;
    padding-left: 0;
    text-align: left;
}

.why-right-content .accordion-item {
    background-color: transparent;
    border: transparent;
    border-bottom: 1px solid var(--color-2c3558);
}

.why-right-content .accordion {
    border-radius: 0;
    color: var(--color-ffffff);
}

.why-right-content .accordion-button::after {
    filter: invert(1);
}

.what-slider .service-box {
    justify-content: center;
    min-height: 340px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.startup-section .why-box .section-heading {
    color: var(--color-2c3558);
}

.startup-section .heading-four {
    color: var(--color-2c3558);
    margin-top: 2rem;
}

.why-industry-section {
    background-image: url(../images/industry-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.why-industry-section .list li {
    color: var(--color-ffffff);
}

.why-industry-section .why-box {
    width: 100%;
}

.industry-outer {
    display: flex;
    flex-direction: row;
    width: 100%;
    margin: auto;
    justify-content: center;
}

.industry-box {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    /* margin-bottom: 5rem; */
    padding: 3rem;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.industry-box.border-bottom-none {
    border-bottom: transparent;
}

.industry-box.border-right-none {
    border-right: transparent;
}

.industry-box .icon {
    width: 100px;
    height: 100px;
    background: var(--color-f2f2f2);
    border-radius: 100%;
    padding: 1rem;
    margin-bottom: 1rem;
}
.case-page{
    padding-top:13rem;
}
.case-page h2 {
    color: var(--color-ffffff);
}
.case-content .small-heading{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.case-box {
    background-color: var(--color-021c0f);
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
    border-radius: 2rem;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.case-box:hover {
    background-color: var(--color-021c0f);
}

.case-content {
    /* height: 300px; */
    padding: 2rem;
}

.case-content h6 {
    color: var(--color-2c3558);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.case-content img {
    width: 9rem;
    margin-bottom: 2rem;
}

.globe-section {
    background-color: var(--color-021c0f);
    background-image: url(../images/location-bg.jpg);
}

.globe-section .row {
    display: flex;
    align-items: center;
    height: 100%;
    color: var(--color-ffffff);
}

.globe-section .contact-phone {
    font-size: 2rem;
    margin-right: 1rem;
    top: 5px;
    position: relative;
    text-align: left;
}

.contact-phone i {
    margin-top: 0.5rem;
    font-size: 1.5rem;
    margin-right: 1rem;
    color: var(--color-2c3558)
}

.out {
    position: relative;
    overflow: hidden;
}

.in {
    width: 100%;
    height: 300px;
    /* background: black; */
    position: relative;
    transition: all 0.6s ease;
    bottom: 0;
    object-fit: cover;
}

.in img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.case-study-details-page{
        padding-top: 13rem;
}
.case-details-box p{
    margin-bottom: 10px;
}
.case-study-details-page .box-content {
    background-color: var(--color-021c0f);
    margin-top: 0.5rem;
    border-radius: 2rem;
    padding: 3rem;
}
.case-study-details-page .box-content li {
    list-style-type: disc;
    margin-bottom: 0.2rem;
}
.case-details-box .wp-block-list{
        margin-left: 19px;
}
.case-study-details-page h2 {
    font-weight: 700;
    font-size: 2rem;
        padding-top: 3rem;
}
.case-study-details-page h3 {
    padding-top: 2rem;
}
.case-study-details-page h4 {
    padding-top: 1rem;
}
.case-details-box {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.case-details-box img {
    object-fit: cover;
    width: 100%;
    height: 400px;
}

.case-content p {
    text-align: justify;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.case-box a:hover {
    text-decoration: underline;
    color: var(--color-2c3558);
}

.case-box a .read-more {
    font-size: var(--font-size-14);
    text-decoration: underline;
    color: var(--color-2c3558);
}

.case-box a:hover .read-more {
    font-size: var(--font-size-14);
    text-decoration: underline;
    color: var(--color-ff7800);
}

.sidebar {
    padding-left: 2rem;
}

.sidebar h5 {
    border-bottom: 0.1rem solid var(--color-2c3558);
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.sidebar a {
    transform: ease all 0.5s;
}

.sidebar a:hover {
    text-decoration: underline;
}

.related-case {
    padding-bottom: 1rem;
    border-bottom: 1px dotted var(--color-2c3558);
}

.related-case h6 {
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.related-case img {
    object-fit: cover;
    height: 60px;
    width: 80px;
}

.related-case small {
    font-size: var(--font-size-12);
}

.service-page h6 {
    margin-bottom: 1rem;
    font-weight: var(--font-weight-Bold);
}
.service-page h3{
        margin-bottom: 1.5rem;
}
.service-section-one .list li {
    color: var(--color-2c3137);
}
.service-section-one  p{
        color: var(--color-2c3137);

}
.service-page-box{
    margin-bottom: 3rem;
}


.service-page.service-section-two {
    background-image: url(../images/process-home.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: soft-light;
}

.service-section-two {
    background-color: var(--color-021c0f);
}
.service-section-three{
    overflow: hidden;
}
.service-page-img .service-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-page-content {
    padding: 4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.service-page-content h3{
    margin-bottom: 1.5rem;
    font-weight: var(--font-weight-Bold);
}
.service-page-img {
    height: 100%;
    object-fit: cover;
    width: 100%;
    border-radius: 2rem;
    overflow: hidden;
     max-height: 500px;
}

.service-page-img img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.service-page-content h4 {
    margin-bottom: 2rem;
    font-weight: var(--font-weight-Bold);
}

.service-section-four {
    background-color: var(--color-2c3558);
    padding: 5rem;
}

.service-section-four .approach-content .col-xl-2 {
    width: 18%;
    margin: 0.5%;
}

.service-section-four .approach-box {
    border-radius: 2rem;
    border: 0.2rem solid var(--color-b0e9b0);
    overflow: hidden;
        background-color: #b0e9b0;
        height: 100%;
}

.service-section-four .approach-img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.service-section-four .approach-content-inside {
    padding: 2rem;
    text-align: center;
    background-color: #b0e9b0;
}

.service-section-four .approach-content-inside p {
    color: var(--color-2c3137);
    margin-bottom: 0;
}

.service-section-four .approach-content-inside h6 {
    font-weight: var(--font-weight-SemiBold);
}

.service-section-five .who-box {
    background-color: var(--color-021c0f);
    border-radius: 2rem;
    padding: 2rem;
    text-align: center;
    margin-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.service-section-five .who-content-inside h6 {
    font-weight: var(--font-weight-Bold);
}
.who-content-inside h3{
    color: var(--color-ffffff);
        font-weight: var(--font-weight-Bold);
font-size: var(--font-size-22);
}
.service-section-five .who-icon {
    margin-bottom: 2rem;
    width: 6rem;
    background-color: var(--color-2c3558);
    padding: 1.5rem;
    border-radius: 100%;
}

.service-section-five .who-content {
    width: 100%;
}

.service-section-five .who-content p {
    text-align: center;
}

.service-section-six {
    background-color: var(--color-021c0f);
}
.blog-page{
    padding-top:13rem;
}
.blog-page h2 {
    color: var(--color-ffffff);
}

.blog-page .blog-box {
    padding: 0;
    background-color: var(--color-ffffff);
    overflow: hidden;
    transition: ease all 0.5s;
    margin-bottom: 1.5rem;
}

.blog-box a .read-more {
    font-size: var(--font-size-14);
    text-decoration: underline;
    color: var(--color-2c3558);
}

.blog-page .blog-box a:hover .read-more {
    color: var(--color-ff7800);
}

.blog-detail-page h1 {
    font-weight: 700;
    font-size: 2rem;
}

.blog-detail-page .blog-content p {
    margin-bottom: 1.5rem;
    text-align: justify;
}

.blog-detail-page .sidebar {
    padding-left: 2rem;
}

.blog-detail-page .sidebar h4 {
    border-bottom: 2px solid #444;
    padding-bottom: 10px;
}

.blog-detail-page .latest-post h6 {
    font-size: 0.95rem;
}

.blog-detail-page .latest-post img {
    border-radius: 5px;
    object-fit: cover;
}

@media (max-width: 768px) {
    .blog-detail-page .latest-post img {
        width: 60px;
    }
    .blog-detail-page .blog-details h1 {
        font-size: 1.5rem;
    }
}

.main-nav {
    padding: 0 3rem;
    width: 100%;
    float: left;
    position: relative;
}

.navbar-brand {
    padding-top: 0;
    padding-bottom: 0;
}

.main-nav .navbar {
    padding: 0;
    width: 100%;
    float: left;
}

.main-nav .nav-item {
    padding-left: 2rem;
}

.main-nav .nav-item .nav-link {
    position: relative;
    display: block;
    font-size: var(--font-size-16);
    color: var(--color-2c3137);
    font-weight: var(--font-weight-Medium);
    line-height: initial;
    padding: 2rem 0;
}

.main-nav .nav-item .nav-link:focus,
.main-nav .nav-item.active .nav-link,
.main-nav .nav-item .nav-link:hover {
    color: var(--color-2c3558);
}

.main-nav .nav-item .nav-link.show,
.main-nav .nav-item .show>.nav-link {
    color: var(--color-2c3558);
}


/* dropdown-menu */

.main-nav .navbar-nav .nav-item.dropdown .dropdown-item:focus,
.main-nav .navbar-nav .nav-item.dropdown .dropdown-item:hover {
    background-color: transparent;
}

.main-nav .navbar-nav {
    flex-direction: row;
    position: relative;
    width: 100%;
}

.main-nav .nav-item.product-menu {
    position: unset;
    height: max-content;
}

.main-nav .navbar-nav .dropdown .dropdown-menu {
    position: absolute;
    margin: 0;
    top: 100%;
    left: 0;
    right: 0;
    padding: 2rem;
    border: none;
    border-radius: 0 0 0.5rem 0.5rem;
    box-shadow: 0px 0px 10px -4px #0000009d;
    z-index: 1000;
}

.main-nav .navbar-nav .dropdown .dropdown-menu li a {
    font-size: var(--font-size-14);
    color: var(--color-021c0f);
    font-weight: var(--font-weight-Medium);
    display: inline-block;
    text-transform: uppercase;
    padding: 0;
}

.main-nav .navbar-nav .dropdown .dropdown-menu li a.view-all {
    color: var(--color-2c3558) !important;
    text-decoration: underline;
}

.main-nav .navbar-nav .dropdown .dropdown-menu li a.view-all:hover {
    color: var(--color-000000) !important;
    text-decoration: underline;
}

.main-nav .navbar-nav .dropdown .dropdown-menu li a:hover {
    color: var(--color-2c3558) !important;
}

.main-nav .navbar-nav .dropdown .dropdown-menu h6 {
    font-size: var(--font-size-18);
    font-weight: var(--font-weight-SemiBold);
}

.main-nav .navbar-nav .dropdown .dropdown-menu li:hover {
    background: var(--color-1f1f1f);
}

.main-nav .navbar-nav .dropdown .dropdown-menu li:hover a {
    color: var(--color-f7931e);
}

.main-nav .navbar-nav .dropdown .dropdown-toggle::after {
    margin-left: 2px;
    vertical-align: -2px;
    border: none;
    background-image: url(../images/icons/dropdown-toggle.png);
    width: 0.6rem;
    height: 14px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}

.main-nav .navbar-nav .dropdown.active .dropdown-toggle::after,
.main-nav .navbar-nav .dropdown:hover .dropdown-toggle::after {
    background-image: url(../images/icons/dropdown-toggle2.png);
}

.main-nav .navbar-nav .dropdown .submenu {
    min-width: 180px;
    width: 180px;
    left: 0px;
    background-color: var(--color-ffffff);
}

.main-nav .navbar-nav .dropdown .mega-dropdown {
    max-width: 100%;
    width: 100vw;
    background-color: var(--color-ffffff);
}

.main-nav .mega-menu-list {
    width: 100%;
    float: left;
}

.main-nav .mega-menu-list ul li {
    display: block;
    margin-left: 0;
    padding-left: 0;
    font-size: var(--font-size-16);
}


/* dropdown-menu */

.offcanvas-body {
    overflow-y: unset;
    padding: 0;
    border-radius: 0;
}

.offcanvas.offcanvas-start {
    width: 100%;
    transform: unset;
    right: 0;
}

.offcanvas {
    position: relative;
    visibility: visible;
    border-radius: 4rem;
}

.main-header.g_shrink {
    position: fixed;
    background: #ffffff;
    z-index: 99;
}
.main-header{
      position: fixed; 
      z-index: 9;
}

.main-header.g_shrink .main-nav .nav-item .nav-link {
    padding: 2rem 0;
}

.main-header.g_shrink .main-nav {
    padding: 0 0;
}

.main-header.g_shrink .offcanvas {
    border-radius: 0;
    border: transparent !important;
}

.main-header.g_shrink .top-menu {
    display: none;
}


/* main-header */


/* banner-section  */

.main-banner {
    height: calc(100vh - 200px);
    background: var(--color-0e2d45);
}

.mega-menu-list a.view-all {
    font-size: var(--font-size-12) !important;
    color: var(--color-021c0f) !important;
    text-decoration: underline important;
    text-transform: capitalize;
}


/* banner-section  */

@media (max-width:1200px) {
    .offcanvas-body {
        overflow-y: auto;
    }
    .offcanvas-header {
        justify-content: end;
    }
    .offcanvas.offcanvas-start {
        width: var(--bs-offcanvas-width);
        transform: translateX(-145%);
        right: 0;
        transform: 0 !important;
    }
    .offcanvas {
        position: fixed;
        visibility: hidden;
    }
    .mobile-offcanvas .toggle-img {
        width: 40px;
    }
    .offcanvas-header .btn-close {
        width: 14px;
        height: 14px;
        opacity: 1;
        padding: 10px 10px;
        margin: 0;
    }
    .main-nav .navbar-nav {
        flex-direction: column;
    }
    .main-nav .navbar-nav .dropdown .dropdown-menu {
        position: relative;
        width: 100%;
        padding-left: 8px;
    }
    .main-nav .nav-item.product-menu {
        position: relative;
        height: auto;
    }
    .main-nav .mega-menu-list ul li {
        width: 100%;
        margin: 0;
    }
}

.core-value-img {
    margin: 0 auto;
}

#typedText {
    border-right: 2px solid black;
    padding-right: 4px;
    white-space: nowrap;
}

#quotemodal .modal-header {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 9;
    border-bottom: none;
}

#quotemodal .modal-content {
    background-color: transparent;
    border: transparent;
    width: 600px;
}

.intl-tel-input,
.iti {
    width: 100%;
}

.iti {
    position: relative;
    display: inline-block;
    width: 100% !important;
    margin-bottom: 1rem !important;
}

#careermodal .modal-header {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 9;
    border-bottom: none;
}

#careermodal .modal-content {
    background-color: transparent;
    border: transparent;
    width: 600px;
}


.trust-btn {
    position: fixed;
    bottom: 0;
    z-index: 9;
    width: 225px;
    box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
}


.wpcf7-not-valid-tip {
   
    font-size: 0.8rem;
}