

*,body,input{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    color: var(--text-color-primary);
    font-family: 'poppins'
}
/* Header start */
.evergreen_wrap header .navbar {
    padding: 5px 20px;
    box-shadow: 0px -2px 9px 2px #ccc;
}
.evergreen_wrap .navbar-collapse.show{
    /* position: absolute;
    left: 0;
    right: 0;
    background: #ffffff;
    top: 120px;
    z-index: 99;
    padding: 1rem; */
}

.evergreen_wrap .navbar-brand img {
    width: 90px;
}

.evergreen_wrap .navbar-nav {
    flex: 1;
    justify-content: center;
}

.evergreen_wrap .nav-item {
    margin: 0 5px;
}
.evergreen_wrap header .navbar-toggler:focus{
    box-shadow: 0px 3px 4px #b9b9b9;
    border: 1px solid #ccc;
}
.evergreen_wrap .support-login .support .nav-link{
    color: var(--text-color-secondry);
}


.evergreen_wrap .support-login button.btn {
    margin: 5px 0;
    background-color: var(--bg-color-light-pink);
    border-radius: 50px;
    border: 0;
}
/* Header end */

.evergreen_wrap .bg-custom{
    background: var(--bg-image-custom);
    min-height: calc(95vh);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100% 110%;
}
.evergreen_wrap .banner.bg-custom{
    min-height: calc(100vh - 121px) !important;
}
/* services section  */

.evergreen_wrap #services .serviceBoxContainer{
    width: 25%;
    padding: 10px;
}
.evergreen_wrap #services .service_btnwrap{
    margin-top: -15px;
}
.evergreen_wrap #services .serviceBox{
    background-image: linear-gradient(#5470fe, #f167c9);
    clip-path: polygon(100% 0, 100% 75%, 50% 100%, 0 75%, 0 0);
    height: 52vh;
    display: flex;
    padding: 0px 10px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: -45px;
}


/* services section  */
/* testimonial section */
.evergreen_wrap .cleint_testimonial .testimonials-section, 
.evergreen_wrap .case_study .case_study-section {
    padding: 35px 8px !important;
}

.evergreen_wrap .cleint_testimonial .testimonials-section h2.text-color_primary,
.evergreen_wrap .case_study .case_study-section h2.text-color_primary{
    margin-bottom: 35px;
}

.evergreen_wrap .line {
    width: 100px;
    height: 4px;
    background-color: var(--bg-color-light-pink);
    margin: 0 auto 35px auto;
}

.evergreen_wrap .cleint_testimonial .testimonial img {
    border-radius: 10px;
    margin-bottom: 15px;
}
.evergreen_wrap .cleint_testimonial .testimonial ,
.evergreen_wrap .case_study .case_study-section .case_study{
    width: 90%;
    margin: auto;
}

.evergreen_wrap .cleint_testimonial .testimonial h3,
.evergreen_wrap .case_study .case_study-section .case_study h3 {
    font-size: 20px;
    margin-bottom: 5px;
}

.evergreen_wrap .cleint_testimonial .testimonial p,
.evergreen_wrap .case_study .case_study-section .case_study p {
    font-size: 16px;
    color: var(--text-color-primary);
}

.evergreen_wrap .cleint_testimonial .floating-btn {
    position: fixed;
    bottom: 25px;
    right: 20px;
    background-color: #007bff;
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    color: white;
    font-size: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 99;
}

.evergreen_wrap .cleint_testimonial .floating-btn:hover {
    background-color: #0056b3;
}
.evergreen_wrap .case_studyinnerbox{
    background: linear-gradient(45deg, #8393fc, #f087cf);
    padding: .5rem 1rem;
    width: 90%;
    margin: -40px auto 0;
    z-index: 99;
    position: relative;
}
.evergreen_wrap button.knowMore_btn.btn{
    background-color: var(--text-color-primary);
    color: var(--bg-color-grey);
    border-radius: 50px;
    padding: 8px 20px;
    font-size: 18px;
    font-weight: 500;
}

.knowMore_btn{
    color: var(--text-color-primary) ;
    border: #0e0e0e solid 1px;
    padding: 10px 40px;
    cursor: pointer;
    border-radius: 25px;
    font-size: 16px;
    margin:  0 20px;
    font-weight: bold;
    background: transparent;
    transition: all 0.5s
}

.knowMore_btn:hover{
    
    background-color: var(--bg-color-hover-black);
    color: var(--text-color-white);
}

/* testimonial section */

.evergreen_wrap .swiper-container {
    width: 80%;
    /* height: 300px; */
    margin-bottom: 20px;
    margin: auto;
    overflow: hidden;
}

.evergreen_wrap .swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.evergreen_wrap .swiper-button span{
    display: inline-block;
    background-color: var(--text-color-primary);
    background-size: 70%;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding: 21px;
    cursor: pointer;
}
.evergreen_wrap .swiper-button span:hover{
    background-color: var(--bg-color-hover-black)
}
/* slider next button img*/
.evergreen_wrap .swiper-button span.swiper-button-n{
    right: 40px;
    background-image: url('https://ever-green.staging360degreecloud.com/public/assets/rightslide.svg');
}
/* slider prev button img */
.evergreen_wrap .swiper-button span.swiper-button-p{
    left: 40px;
    background-image: url('https://ever-green.staging360degreecloud.com/public/assets/leftslide.svg');
}
/* caraousel end */

/* .call_to_action  */
.evergreen_wrap .call_to_action .hero-img h1{
    text-align: center;
    font-size: 48px; 
    font-weight: bold;
}
.evergreen_wrap .call_to_action .hero{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80%;
    margin: auto;
}
.evergreen_wrap .call_to_action .hero .logo-img img{
    width: 250px; 
    filter: drop-shadow(-3px -1px 3px #bbbbbb);
}
.evergreen_wrap .call_to_action .btn{
    border-radius: 20px;
    padding: 10px;
    max-width: 148px;
    width: 48%;
    border: 0;
    margin: 10px 0;
}

.evergreen_wrap .call_to_action .form input{
    color: #797373;
    background-color: #d9d9d9;
}
.evergreen_wrap .call_to_action .name-row{
    display: flex;
    justify-content: space-between;
}
.evergreen_wrap .call_to_action .form .name-row input{
    height: 45px;
    width: 100%;
}
.evergreen_wrap .call_to_action .form input{
    height: 45px;
    width: 100%;
    font-size: medium;
}
.evergreen_wrap .call_to_action .form-section {
    padding: 50px 0;
    text-align: center;
}
.evergreen_wrap .call_to_action .form-section h2 {
    font-size: 36px;
    margin-bottom: 20px;
}
.evergreen_wrap .call_to_action .form-section .form-control {
    border-radius: 50px;
    padding: 15px 20px;
    background-color: #e9ecef;
}

.evergreen_wrap .call_to_action .btn-primary {
    background-color: var(--bg-color-light-pink);
}
.evergreen_wrap .call_to_action .btn-secondary{
   
    color: #737373;
    background-color: #d9d9d9;
    border: none;
}
.evergreen_wrap .call_to_action hr{
    text-align: center;
    margin: 0 auto;
}

/* .call_to_action  */

/* Get in touch */
.evergreen_wrap .getInTouch .hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 50px auto 0;
}

.evergreen_wrap .getInTouch .hero .contact-info .container .row .col-4 {
    text-align: center;
}

.evergreen_wrap .getInTouch .contact-info p.bg_text {
    background: linear-gradient(45deg, #6d6ef6, #da68d1);
    border: none;
    border-radius: 50px;
    color: #fff;
    padding: 5px 10px;
    margin: 0;
    display: inline-block;
}

.evergreen_wrap .getInTouch .btn {
    border: 1px solid black;
    border-radius: 50px;
    padding: 3px 30px;
    /* margin-left: 20px; */
}

.evergreen_wrap .getInTouch ul li {
    font-weight: 700;
}

.evergreen_wrap .getInTouch .form input {

    background-color: #d9d9d9;
}

.evergreen_wrap .getInTouch .name-row {
    display: flex;
    justify-content: space-between;
}

.evergreen_wrap .getInTouch .form .name-row input {
    height: 45px;
    width: 240px;
}

.evergreen_wrap .getInTouch .form input {
    height: 45px;
    width: 100%;
    border-radius: 100px;
    font-size: medium;
}

.evergreen_wrap .getInTouch .form-section {
    padding: 100px 0;
    text-align: center;
}

.evergreen_wrap .getInTouch .form-section h2 {
    font-size: 36px;
    margin-bottom: 20px;
}

.evergreen_wrap .getInTouch .form-section .form-control {
    border-radius: 20px;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #e9ecef;
}

.evergreen_wrap .getInTouch .form p {
    font-weight: bold;
    text-align: center;
}

.evergreen_wrap .getInTouch .btn-primary {
    background-color: var(--bg-color-light-pink);
    border-color: var(--bg-color-light-pink);
    margin: 10px 0px;
    padding: 9px 42px;
}

.evergreen_wrap .getInTouch hr {
    text-align: center;
    margin: 20px auto;
}

.evergreen_wrap .getInTouch .icons {
    display: flex;
    gap: 10px;
}

.evergreen_wrap .getInTouch .icons img {
    width: 40px;
}

.evergreen_wrap .contact-title{
    font-size: 22px;
}
.evergreen_wrap .getInTouch .form label{
    font-size: 18px;
    padding-left: 1rem;
}

/* Get in touch */

.evergreen_wrap .text-color_primary{
    color: var( --text-color-primary) !important;
}
.evergreen_wrap .heading-size{
    font-size: var(--big-heading-size) !important;
    margin-bottom: 35px;
}
.evergreen_wrap .text-Theme-Color{
    color: var(--bg-color-green) !important;
}
.evergreen_wrap .containerEvergreen {
    width: 80%;
}

:root {
    /* text color */
    --text-color-white: #f1f1f1;
    --text-color-black: #010101;
    --text-color-primary: #363636;
    --text-color-secondry: rgba(0, 0, 0, .55);
  /* background color */
    --bg-color-light-pink: #ff5757;
    --bg-color-grey: #d9d9d9;
    --bg-color-green: #3a9d34; 
    --bg-color-hover-black:#1e1e1edc;
    /* background image */
    --bg-image-custom: url('https://ever-green.staging360degreecloud.com/public/assets/bg-custom.png');
    /* font-size */
    --big-heading-size:48px;
    --mid-heading-size:32px;
    --small-heading-size:24px;
  }

@media(min-width:1440px){
    .evergreen_wrap .heading-size{
        font-size: calc(3rem + 1.1vw) !important
    }
    .coreValueText.mx-5.fs-4{
        font-size: 26px !important;
    }
    #how_Works .works .paragraph p,#services .serviceBoxContainer .serviceBox{
        font-size: 20px !important;
    }
    .containerEvergreen {
        width: 85% !important;
    }
}

.evergreen_wrap .coreValueText{
   
    text-align: justify;
}  

  @media (max-width: 992px) {
    .evergreen_wrap .coreValueText{
        line-height: normal !important;
        padding: 0px !important;
        margin: auto 0px  !important;
        text-align: center;
    }   

    .evergreen_wrap #services .serviceBoxContainer {
        width: 33%;
    }
    #services .serviceBoxContainer img{
        max-width: 100px !important;
    }
}
@media(max-width:768px){
    .evergreen_wrap .cleint_testimonial .testimonial, 
    .case_study .case_study-section .case_study{
        width: 80%;
    }
    .evergreen_wrap .swiper-button span.swiper-button-n{
        right:10px;
    }
    .evergreen_wrap .swiper-button span.swiper-button-p{
        left: 10px;
    }
    .evergreen_wrap .swiper-button span.swiper-button-p,
    .evergreen_wrap .swiper-button span.swiper-button-n{
        width: 30px;
        height: 30px;
        padding: 15px;
    }
    
    .evergreen_wrap .heading-size{
        font-size: var(--mid-heading-size) !important;
    }
    .evergreen_wrap #services .serviceBoxContainer {
        width: 45%;
    }
    .evergreen_wrap #services .serviceBox{
        height: 45vh;
    }
    /* get in touch */
    .evergreen_wrap .hero {
        flex-direction: column-reverse;
    }
    .evergreen_wrap .call_to_action .hero{
        width: 100%;;
    }

    .evergreen_wrap .hero .contact-info {
        padding: 20px 0;
        margin: 0 auto;
    }

    .evergreen_wrap .form input {
        width: 100%;
    }

    .evergreen_wrap .contact-info button {
        margin: 0 54px;
        padding: 10px 6px;
    }

    .evergreen_wrap .contact-info h2 {
        text-align: center;
        font-size: 20px;
    }
    .evergreen_wrap .getInTouch .form p{
        font-size: 14px;
    }

    .evergreen_wrap .icons {
        display: flex;
        justify-content: space-evenly;
    }
/* call to action css */
    .evergreen_wrap .call_to_action .btn{
        margin: 5px 0;
    }
    .evergreen_wrap .call_to_action .hero{
        flex-direction: column;
    }
    
    .evergreen_wrap .call_to_action .name-row{
        flex-wrap: wrap;
    }
    .evergreen_wrap .call_to_action .form input{
        width: 100%;
    }
    .evergreen_wrap .call_to_action .form .name-row input{
        width: 100%;
    }
    .evergreen_wrap .call_to_action .form .form-section .container .col-md-6{
        width: 100%;
    }
}
@media (max-width: 576px){
    .evergreen_wrap .containerEvergreen{
        width: 100%;
    }
    .evergreen_wrap #services .serviceBoxContainer {
        width: 100%;
    }
    .evergreen_wrap #services .service_btnwrap{
        margin-top: 20px;
    }
    .evergreen_wrap .cleint_testimonial.bg-custom,
    .evergreen_wrap .case_study.bg-custom,
    .evergreen_wrap .banner.bg-custom,.evergreen_wrap .bg-custom{
        min-height: auto !important;
    }
    .evergreen_wrap .getInTouch .contact-info .list-unstyled, .evergreen_wrap .getInTouch .contact-info p{
        font-size: 14px !important;
    }
    .evergreen_wrap .getInTouch .contact-info h3{
        font-size: 18px;
    }
    .evergreen_wrap .hero-content .borderBlack{
        width: 100% !important;
    }
    .evergreen_wrap .form .footer-Logo{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}
