/*------------------------
	CSS SECTIONS
    01. Header Styles
    02. Hero Section Styles
    03. Solutions Sections Styles
    04. Intro & Description Section Styles
    05. Proposition Section Styles
    06. Analysis Section Styles
    07. Clientele Setion Styles
    08. Service Section Styles
    09. Tutorial Section Styles
    10. Contact Section Styles
    11. Footer Section Styles
-------------------------*/

.font-inter{
    font-family: Inter;
}

.container {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0rem;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
}

/*------------------------
	Header Styles
-------------------------*/
.header-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.navbar-area{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    height: 100px;
    box-shadow: 0px 4px 25px 15px rgba(26, 28, 33, 0.1);
}

@media only screen and (min-width: 320px) and (max-width: 552px) {
  .navbar-area{
    height: 60px;
  }
}

@media only screen and (min-width: 553px) and (max-width: 767px) {
  .navbar-area{
    height: 80px;
  }
}

.green-text {
    color: #43A047;
}

.logo {
    font-size: 24px;
    font-weight: bold;
    display: flex;
    
}

.logo-img{
    height: 43px;
    width: 130px;
    top: 36px;
    display: flex;
}

.nav-link {
    font-size: 22px;
    font-weight: 500;
    cursor: pointer;
    color: #000 !important;
    align-items: center;
    justify-content: space-between;
    display: flex;
    gap: 15px;
}

.header-link{
    font-size: 20px !important;
    font-weight: 500 !important;
    font-family: Inter !important;
}


/*------------------------
	Hero Section Styles
-------------------------*/

.headline-text {
    color: #1B5E20;  
    font-family: Georgia;
    font-size: 60px !important;
    font-weight: 100;
    text-align: left;  
}

.red-hl-text{
        font-size: 84px;
        color: #43A047;
    }

@media (max-width: 424px) {
    .headline-text {
        font-size: 36px !important;  
        text-align: left !important; 
    }

    .red-hl-text{
        font-size: 44px;
    }
}

@media only screen and (min-width: 425px) and (max-width: 767px) {
    .headline-text {
        font-size: 40px !important;  
        text-align: left !important; 
    }

    .red-hl-text{
        font-size: 50px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1749px) {
  .headline-text {
        font-size: 52px !important;  
    }

  .red-hl-text{
        font-size: 56px;
    }
}

.cta-button{
    background-color: #fff !important;
    border-radius: 60px !important;
    text-decoration: underline !important;
    font-family: Inter !important;
}

/*------------------------
	Solutions Section Styles
-------------------------*/

.solutions-area .btn-group {
  background: #fff;
  color: #000000;
  position: relative;
  top: -1px;
}

.solutions-area .btn-group .dir-part {
  background-color: #677489;
}

.solutions-area .btn-group a:hover {
  border-color: #677489;
  color: #43A047;
}

.button .btn-group.white-bg:hover{
	border-color:#677489;
}

.button .btn-group:hover {
    color: #677489;
}

.solution-acro{
  background-color: gainsboro;  
  color:#000000; font-weight: bold; 
  width: 100%;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 18px !important;
}

.solution-title{
  color: #000000;
  font-size: 18px;
  text-decoration: none;
  font-weight: normal;
}


@media (max-width: 1024px){
  .solutions-area span{
    font-size: 12px !important;
  }
  
}


/*------------------------
	Intro & Description Section Styles
-------------------------*/
.section-text {
    font-family: Inter;
    font-size: 22px;
    color:#1e1e1e;
    margin-top: 10px;
}

@media (max-width: 767.98px) {
    .section-text {
        font-size: 16px;
        text-align: justify;
    }
}

/*------------------------
	Proposition Section Styles
-------------------------*/

    /*------------------------
        icon base class definition
    -------------------------*/
.lni {
    text-transform: none;
    /* Better Font Rendering */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.proposition-section .single-proposition:hover .proposition-icon::after {
    transform: scale(1);
}

.gray-bg {
    background: #F9FAFC;
}

.section-title span {
    font-size: 26px !important;
    font-weight: 500 ;
    display: block;
    color: #43A047;
    margin-bottom: 0px;
    font-family: Inter;
}

.section-title-2 {
    font-family: Inter;
    font-weight: 600 ;
    color:#1e1e1e;
}

.proposition-section .single-proposition:hover .proposition-icon::after {
    transform: scale(1);
}

.prop-icon{
    align-items: center;
    justify-content: center;
}

.icon-gradient {
  position: relative;
  width: 69px;
  height: 69px;
  line-height: 62px;
  border-radius: 50%;
  color: #fff;
  margin-left: auto;
  margin-right: auto;
  font-size: 28px;
  z-index: 1;
}

.icon-gradient::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-image: inherit;
  opacity: .15;
  z-index: -1;
  left: 0;
  top: 0;
  transform: scale(1.3);
  transition: all 0.3s ease-out 0s;
}

.gradient-1 {
  background-image: linear-gradient(#1B5E20 0%, #1B5E20 100%);
}
.gradient-2 {
  background-image: linear-gradient(#43A047 0%, #43A047 100%);
}

.gradient-3 {
  background-image: linear-gradient(#1B5E20 0%, #1B5E20 100%);
}

.gradient-4 {
  background-image: linear-gradient(#43A047 0%, #43A047 100%);
}

.section-desc{
    color:#1a1c21 !important;
    font-family: Inter !important;
} 

.section-title span,
.section-title-2,
.single-proposition h4,
.section-desc {
    margin: 0 20px; 
}

@media (max-width: 768px) {
    .section-title span {
        font-size: 30px !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .section-title-2 {
        font-size: 30px !important;
        margin-top: -5px; 
        margin-bottom: 20px;
    }

    .single-proposition h4 {
        font-size: 18px;
        margin-top: 10px; 
        margin-bottom: 10px;
    }

    .section-desc {
        font-size: 14px;
        margin-top: 5px; 
        margin-bottom: 50px; 
    }

    .icon-gradient {
        margin-top: 40px;
    }
}


/*------------------------
	Analysis Section Styles
-------------------------*/
.analysis-counter {
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  padding-bottom: 20px;
}

.single-analysis-counter {
  display: flex;
  flex-direction: column; 
  justify-content: center; 
  align-items: center; 
  text-align: center; 
  padding: 5px; 
}

.single-analysis-counter .count {
  font-size: 64px;
  font-weight: 700;
  color: #fff;
  font-family: Inter;
  line-height: 65px;
}

.single-analysis-counter .count .million {
  font-size: 64px; 
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-analysis-counter .count .million {
    font-size: 64px; 
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-analysis-counter .count .million {
    font-size: 60px; 
  }
}

@media (max-width: 767px) {
  .single-analysis-counter .count .million {
    font-size: 60px; 
  }
}

.single-analysis-counter .count .plus {
  font-size: 40px;
  font-weight: 400;
}

.single-analysis-counter .text {
  color: #fff;
  text-transform: uppercase;
}

@media only screen and (min-width: 768px) and (max-width: 991px){
  .single-analysis-counter .text {
    font-size: 12px !important; 
  }
}



/*------------------------
	Clientele Section Styles
-------------------------*/

.clientele-image img {
  width: 100%; }

.clientele-title{
    color: #1B5E20;
    font-size: 42px !important;
    font-family: Inter!important;
}

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

@media (max-width: 767px) {
    .clientele-title {
        font-size: 36px !important;
    }
}


.clientele .clientele-text p.lead {
    font-size: 18px; 
    line-height: 1.5;
    margin-left: 20px; 
    margin-right: 20px;
}

@media (max-width: 767px) {
    .clientele .clientele-text p.lead {
        font-size: 14px;
        margin-left: 10px; 
        margin-right: 10px; 
        margin-bottom: 30px;
    }
}
    
    
/*------------------------
	Service Section Styles
-------------------------*/
.servicesection-title span {
  font-size: 25px;
  font-weight: 700;
  font-family: Inter;
  color: #1B5E20;
  margin-bottom: 5px; }
  @media (max-width: 767px) {
    .servicesection-title span {
      font-size: 20px; } }

.servicesection-title h1 {
  line-height: 55px;
  font-weight: 800;
  font-family: Inter;
  color:#1E1E1E;
  margin-bottom: 15px; }
  @media (max-width: 767px) {
    .servicesection-title h1 {
      line-height: 41px;
        color:#1E1E1E; } }

.servicesection-title p {
    font-size: 18px;
    font-family: Inter !important;
    color:#677489;
    }

.service-section .service-box-style-2 {
    padding: 0;
    text-align: center; }
    .service-section .service-box-style-2 .service-thumbnail img {
        width: 100%;
        border-radius: 10px 10px 0 0; }
    .service-section .service-box-style-2 .box-icon-style {
        margin-left: auto;
        margin-right: auto;
        width: 54px;
        height: 54px;
        border: 2px solid #fff;
        font-size: 25px;
        margin-top: -27px;
        background: #fff;
        position: relative;
        z-index: 9; }
    .service-section .service-box-style-2 .box-icon-style i {
        color: transparent;
        -webkit-background-clip: text;
        -moz-background-clip: text;
        -ms-background-clip: text;
        -o-background-clip: text;
        background-clip: text;
        background-image: linear-gradient(#1B5E20 0%, #1B5E20 100%);
        -webkit-transition: all 0.3s ease-out 0s;
        -moz-transition: all 0.3s ease-out 0s;
        -ms-transition: all 0.3s ease-out 0s;
        -o-transition: all 0.3s ease-out 0s;
        transition: all 0.3s ease-out 0s; }
    .service-section .service-box-style-2:hover .box-icon-style {
        background: linear-gradient(#1B5E20 0%, #1B5E20 100%); }
    .service-section .service-box-style-2:hover .box-icon-style i {
        color: #fff; }
    .service-section .service-box-style-2 .box-content-style {
        padding: 0 30px 35px; }

.box-style {
    padding: 40px 30px;
    border: 1px solid #D7DAE0;
    border-radius: 10px;
    margin-bottom: 30px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s; 
}
    .box-style:hover {
        -webkit-box-shadow: 0px 0px 30px rgba(170, 181, 216, 0.45);
        -moz-box-shadow: 0px 0px 30px rgba(170, 181, 216, 0.45);
        box-shadow: 0px 0px 30px rgba(170, 181, 216, 0.45); }
    .box-style:hover .box-icon-style {
        color: #fff;
        border-color: transparent;
        background: linear-gradient(#1B5E20 0%, #1B5E20 100%); }
        .box-style:hover .box-icon-style::after {
            opacity: 1;
            visibility: visible; }
    .box-style .box-icon-style {
        width: 78px;
        height: 78px;
        border-radius: 50%;
        margin-bottom: 25px;
        background: #fff;
        border: 2px solid #43A047; /*#43A047*/
        display: flex;
        align-items: center;
        justify-content: center;
        color: #43A047;
        font-size: 40px;
        -webkit-transition: all 0.3s ease-out 0s;
        -moz-transition: all 0.3s ease-out 0s;
        -ms-transition: all 0.3s ease-out 0s;
        -o-transition: all 0.3s ease-out 0s;
        transition: all 0.3s ease-out 0s;
        position: relative; }
    .box-style .box-icon-style::after {
        content: '';
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: absolute;
        opacity: 0;
        visibility: hidden;
        background: linear-gradient(#43A047 0%, #1B5E20 100%);
        -webkit-transition: all 0.3s ease-out 0s;
        -moz-transition: all 0.3s ease-out 0s;
        -ms-transition: all 0.3s ease-out 0s;
        -o-transition: all 0.3s ease-out 0s;
        transition: all 0.3s ease-out 0s;
        z-index: -1;
        border-radius: 50%;
        border: 1px solid transparent; }
    .box-style .box-content-style h4 {
        font-size: 25px;
        font-weight: 600;
        margin-bottom: 20px; 
        color:#1E1E1E;
        font-family: Inter;
    }
    
    .box-style-margin {
        margin-left: 3rem;
        margin-right: 3rem;
    }
    
    .box-style .box-content-style-2  h4 {
        font-size: 25px;
        font-weight: 600;
        color:#1E1E1E;
        font-family: Inter;
    }

.service-icon{
    align-items: center;
    justify-content: center;
    display: flex;
}

@media only screen and (min-width: 992px) and (max-width: 1025px) {
  .archive-box {
    padding-top: 2rem;
  }
}

/*------------------------
	Tutorial Section Styles
-------------------------*/
.tutorials {
  margin-bottom: 150px;
}
.tutorials .tutorial-section-title {
  margin-bottom: 30px;
  font-family: Inter;
}

.tutorial-section-title h3 {
  color: #F9FAFC;
  font-size: 20px;
}

.tutorial-section-title p {
  color: #D7DAE0;
}

.tutorial-video-area.overlay::before {
  z-index: 1;
  opacity: 0.9;
}

.tutorial-video-area .tutorial-section-title {
  margin-bottom: 200px;
}

.tutorial-video-area .tutorial-video-play {
  position: relative;
  z-index: 9;
}

.tutorial-video-area .tutorial-video-play .play-thumb a {
  position: absolute;
  left: 50%;
  bottom: 0;
  height: 110px;
  width: 110px;
  background: #fff;
  border-radius: 50%;
  padding-left: 5px;
  color: #43A047;
  margin-left: -55px;
  line-height: 107px;
  text-align:center;
}

.tutorial-video-area .tutorial-video-play .play-thumb a:hover {
  background-color: #43A047;
  color: #fff;
}

.tutorial-video-area .tutorial-video-play .play-thumb a::before {
  position: absolute;
  content: '';
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border: 1px solid #fff;
  border-radius: 50%;
  -webkit-animation: pulse-border-2 1.5s linear infinite;
  animation: pulse-border-2 1.5s linear infinite;
}

.tutorial-video-area .tutorial-video-play .play-thumb a::after {
  position: absolute;
  content: '';
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border: 1px solid #1B5E20;
  border-radius: 50%;
  -webkit-animation: pulse-border 1s linear infinite;
  animation: pulse-border 1s linear infinite;
}

/*------------------------
	Contact Section Styles
-------------------------*/
.single-info .info-content {
    padding-left: 20px; }
    .single-info .info-content .info-title {
        font-size: 20px;
        margin-top: 10px;
        font-family: Inter;}
    .single-info .info-content .text {
        font-size: 18px;
        margin-top: 5px; 
        font-family: Inter;}

.contact-map {
    padding: 1px;
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 21px 0px rgba(185, 195, 219, 0.29);;
    -moz-box-shadow: 0px 0px 21px 0px rgba(185, 195, 219, 0.29);
    box-shadow: 0px 0px 21px 0px rgba(185, 195, 219, 0.29);
}


/*------------------------
	Footer Section Styles
-------------------------*/
.footer {
  position: relative;
  z-index: 2;
  background: #1B5E20 }
  .footer .footer-widget .footer-desc {
    line-height: 30px; }
  .footer .footer-widget h4 {
    margin-bottom: 35px;
    font-weight: 500; }
    @media only screen and (min-width: 992px) and (max-width: 1199px) {
      .footer .footer-widget {
        font-size: 22px; } }
  .footer .footer-widget ul {
    padding-left: 20px; }
  .footer .copyright-area {
    border-top: 2px solid rgba(67, 160, 71, 0.80);
    padding: 25px 0;
    font-size: 16px;
    position: relative;
    z-index: 2; }
    .footer .copyright-area p {
      text-align: right; }
      @media (max-width: 767px) {
        .footer .copyright-area p {
          font-size: 14px;
          text-align: center; } }
      @media only screen and (min-width: 480px) and (max-width: 767px) {
        .footer .copyright-area p {
          font-size: 15px; } }

@media (max-width: 767px) {
  .footer-social-links {
    margin-bottom: 15px; } }

.footer-social-links ul {
  justify-content: flex-start; }
  @media (max-width: 767px) {
    .footer-social-links ul {
      justify-content: center; } }
  .footer-social-links ul li {
    display: inline-block; }
    .footer-social-links ul li a {
      width: 45px;
      height: 45px;
      border-radius: 50%;
      text-align: center;
      line-height: 45px;
      background: rgba(106, 124, 146, 0.1);
      display: block;
      font-size: 18px;
      color: #22427B;
      margin-right: 15px; }
      @media (max-width: 767px) {
        .footer-social-links ul li a {
          padding: 0 7px;
          margin-right: 10px; } }
      .footer-social-links ul li a:hover {
        background: linear-gradient(#3763eb 0%, #43A047 100%);
        color: #fff; }