/*
Template Name:agricultural
File: Layout CSS
Author: Templates On Web
Author URI: http://templateonweb.com/
Licence: <a href="http://www.templateonweb.com/terms.php?v=content&contentid=152">Website Template Licence</a>
*/



/********************* about_main ****************/
#about_main{ 
 position: relative;
 width: 100%;
 max-width: 100vw;
 min-height: 25vh;
 overflow: hidden;
 }
.about_main_media{
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: center;
 display: block;
 z-index: 0;
 opacity: 0;
 transform: translateX(0) scale(1);
 transition: transform 1.6s ease-in-out, opacity 1.6s ease-in-out;
}
.about_main_media_video,
.about_main_media_image{
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: center;
 display: block;
}
.about_main_media.is-active{
 opacity: 1;
 transform: translateX(0) scale(1);
 z-index: 1;
}
.about_main_media.is-next{
 opacity: 0;
 transform: translateX(100%);
 z-index: 2;
}
.about_main_media.is-exit{
 opacity: 0;
 transform: translateX(-100%);
 z-index: 1;
}

#about_main.transition-fade .about_main_media.is-next,
#about_main.transition-fade .about_main_media.is-exit{
 transform: translateX(0) scale(1);
}

#about_main.transition-zoom .about_main_media.is-next{
 transform: translateX(0) scale(1.12);
}

#about_main.transition-zoom .about_main_media.is-exit{
 transform: translateX(0) scale(0.88);
}

#about_main.transition-diagonal .about_main_media.is-next{
 transform: translate(35%, 20%) scale(1.02);
}

#about_main.transition-diagonal .about_main_media.is-exit{
 transform: translate(-35%, -20%) scale(1.02);
}
.about_main_3{ 
 position: relative;
 z-index: 1;
 min-height: 25vh;
 padding-top: 300px;
 padding-bottom: 300px;
 display: flex;
 align-items: center;
 background: rgba(11,45,24,0.3);
 backdrop-filter: blur(8px);
 }
.about_main_2 ul{ 
 text-align:right;
 padding-top:15px;
 }
.about_main_2 li{ 
 display: inline;
 padding-right: 10px;
 color: #fff;
 font-size: 20px;
 }
.about_main_2 h2{ 
 color:#fff;
 }
/********************* about_main_end ****************/
/********************* about ****************/
#about{ 
 padding-top:30px;
 padding-bottom:50px;
 }
.about_1{ 
 text-align:center;
 }
.about_1 h3 {
 padding-bottom: 10px;
}
.about_1 h2 {
 padding-bottom:30px;
}
.about_1 h2 a {
 color: #045a0f;
}
.about_3 h3{ 
 padding-top:10px;
 color: #045a0f;
 }
.about_3 img:hover{ 
 box-shadow: 0 0 8px 3px black;
 }
/********************* about_end ****************/
/********************* erosion ****************/
#erosion{ 
 background: rgba(255,255,255,0.18);
 backdrop-filter: blur(8px);
}
.erosion_3{ 
 text-align:center;
 padding:18px;
 }
.erosion_3 h3{ 
 color: #045a0f;
 padding-top: 20px;
 padding-bottom: 20px;
 font-weight: bold;
 letter-spacing: 2px;
}
.erosion_3 p{ 
 padding-bottom: 20px;
}
/********************* erosion_end ****************/
/********************* product ****************/
#product{ 
 padding-top:30px;
 padding-bottom:50px;
 }
.product_1{ 
 text-align:center;
 }
.product_1 h2{ 
 padding-bottom:60px;
 }
.product_1 h2 a{ 
 color: #045a0f;
 }
.product_3 i{ 
 margin-right: 10px;
 border: 2px solid #045a0f;
 background-color: #045a0f;
 padding: 14px 22px 14px 22px;
 color:#fff;
}
.product_3 p{ 
 padding-top:20px;
 padding-bottom:20px;
}
.product_3 a{ 
 color: #045a0f;
}
.product_3 h3{ 
 border-bottom: 1px solid #dad9d9;
 padding-bottom: 16px;
 width:78%;
}
/********************* product_end ****************/

/********************* our_story ****************/
#our_story{
 padding-top:56px;
 padding-bottom:78px;
 background-color:#062a1d;
 background-image: url(../img/EM/about/oldfarm.png);
 background-repeat: no-repeat;
 background-size: cover;
 background-position: center center;
 background-attachment: fixed;
 position: relative;
}
#our_story::before{
 content:"";
 position:absolute;
 inset:0;
 background:
  radial-gradient(circle at 14% 16%, rgba(244,222,180,0.12), rgba(244,222,180,0) 42%),
  radial-gradient(circle at 86% 80%, rgba(171,245,214,0.1), rgba(171,245,214,0) 56%);
 pointer-events:none;
 z-index:0;
}
#our_story::after{
 content:"";
 position:absolute;
 inset:0;
 background-image:
  radial-gradient(circle at 1px 1px, rgba(246,229,197,0.2) 1px, transparent 0);
 background-size: 3px 3px, 100% 100%;
 opacity: 0.14;
 pointer-events:none;
 z-index:0;
}
#our_story .container{
 position:relative;
 z-index:1;
}
#our_story .about_1 h3{
 color:#ead8b6;
 letter-spacing:0.24em;
 text-transform:uppercase;
 font-size:13px;
 font-family:'Wavehaus', sans-serif;
 font-weight:400;
}
#our_story .about_1 h2,
#our_story .about_1 h2 a{
 color:#fff6e4;
 font-family:'Wavehaus', sans-serif;
 font-weight:600;
 letter-spacing:0.01em;
 line-height:1.2;
 max-width:920px;
 margin-left:auto;
 margin-right:auto;
 text-shadow:0 10px 30px rgba(0,0,0,0.45);
}
.story_book{
 max-width:1100px;
 margin:0 auto;
 position:relative;
}
.story_book::before{
 content:"";
 position:absolute;
 top:0;
 bottom:0;
 left:50%;
 width:2px;
 transform:translateX(-50%);
 background:linear-gradient(to bottom, rgba(244,217,168,0.08), rgba(244,217,168,0.72) 30%, rgba(244,217,168,0.52) 70%, rgba(244,217,168,0.08));
 z-index:0;
}
.story_chapter{
 position:relative;
 z-index:1;
 display:grid;
 grid-template-columns: minmax(220px, 32%) 1fr;
 gap:0;
 margin-bottom:40px;
 border-radius:22px;
 overflow:hidden;
 background:linear-gradient(145deg, rgba(28,52,34,0.76), rgba(34,62,41,0.62));
 backdrop-filter: blur(7px);
 box-shadow:0 16px 42px rgba(0,0,0,0.34);
 border:1px solid rgba(190,227,165,0.42);
 opacity:0;
 transform:translateX(-22px);
 transition:opacity 0.45s ease-out, transform 0.45s ease-out;
 will-change:opacity, transform;
 --reveal-delay: 0s;
}
.story_chapter::before{
 content:"";
 position:absolute;
 left:0;
 right:0;
 top:0;
 height:1px;
 background:linear-gradient(90deg, rgba(255,255,255,0.08), rgba(255,255,255,0.68), rgba(255,255,255,0.08));
 z-index:2;
 pointer-events:none;
}
.story_chapter.is-visible{
 opacity:1;
 transform:translateX(0);
}
.story_chapter_reverse{
 grid-template-columns: 1fr minmax(220px, 32%);
}
.story_chapter:not(.is-visible):nth-child(2n){
 transform:translateX(22px);
}
.story_chapter_reverse .story_chapter_media{
 order:2;
}
.story_chapter_copy{
 padding:48px 46px 36px;
 position:relative;
}
.story_chapter_copy .chapter_year,
.story_chapter_copy h3,
.story_chapter_copy p{
 opacity:0;
 transform:translateY(6px);
 transition:opacity 0.35s ease-out, transform 0.35s ease-out;
}
.story_chapter.is-visible .story_chapter_copy .chapter_year,
.story_chapter.is-visible .story_chapter_copy h3,
.story_chapter.is-visible .story_chapter_copy p{
 opacity:1;
 transform:translateY(0);
}
.story_chapter.is-visible .story_chapter_copy .chapter_year{
 transition-delay:0.1s;
}
.story_chapter.is-visible .story_chapter_copy h3{
 transition-delay:0.18s;
}
.story_chapter.is-visible .story_chapter_copy p:nth-of-type(1){
 transition-delay:0.26s;
}
.story_chapter.is-visible .story_chapter_copy p:nth-of-type(2){
 transition-delay:0.32s;
}
.story_chapter.is-visible .story_chapter_copy p:nth-of-type(3){
 transition-delay:0.38s;
}
.story_chapter_copy::before{
 content:"Chapter";
 position:absolute;
 top:18px;
 right:26px;
 color:rgba(214,246,186,0.26);
 font-family:'Wavehaus', sans-serif;
 font-size:11px;
 letter-spacing:0.16em;
 text-transform:uppercase;
}
.chapter_year{
 font-family:'Wavehaus', sans-serif;
 margin:0 0 12px;
 font-size:13px;
 letter-spacing:0.26em;
 color:#d7f1b8;
 text-transform:uppercase;
 font-weight:600;
}
.story_chapter_copy h3{
 margin-top:0;
 margin-bottom:20px;
 font-family:'Wavehaus', sans-serif;
 font-weight:600;
 color:#e5ffd1;
 font-size:33px;
 line-height:1.18;
}
.story_chapter_copy p{
 font-family:'Wavehaus', sans-serif;
 font-size:16px;
 line-height:1.8;
 font-weight:400;
 color:#f3ffe9;
 margin-bottom:20px;
 text-align:justify;
 max-width:66ch;
}
.story_chapter_copy p:first-of-type::first-letter{
 float:left;
 font-family:'Wavehaus', sans-serif;
 font-size:2.4em;
 line-height:0.88;
 padding-right:6px;
 color:#cbeaa5;
}
.story_chapter_media{
 margin:0;
 min-height:100%;
 background:linear-gradient(160deg, #0c2c20 0%, #124735 52%, #1c5f47 100%);
 overflow:hidden;
 display:flex;
 align-items:center;
 justify-content:center;
 padding:14px;
}
.story_chapter_media img{
 width:100%;
 max-width:290px;
 height:auto;
 display:block;
 object-fit:contain;
 filter:sepia(0.14) contrast(1.1) saturate(1.04);
 border:1px solid rgba(247,229,194,0.54);
 border-radius:12px;
 box-shadow:0 16px 28px rgba(0,0,0,0.28);
 opacity:0.1;
 transform:scale(0.98);
 transition:transform 0.35s ease, filter 0.25s ease, opacity 0.3s ease;
 transition-delay:0s;
}
.story_chapter.is-visible .story_chapter_media img{
 opacity:1;
 transform:scale(1.01);
}
.story_chapter:hover .story_chapter_media img{
 transform:scale(1.035);
 filter:sepia(0.09) contrast(1.14) saturate(1.08);
}
.story_chapter_final{
 margin-bottom:0;
 background:linear-gradient(145deg, rgba(24,49,28,0.78), rgba(36,65,40,0.62));
}
.story_chapter:hover{
 box-shadow:0 22px 56px rgba(0,0,0,0.42);
}
@media (min-width:992px){
 .story_chapter:hover{
  transform:translateY(-2px) scale(1);
  box-shadow:0 28px 66px rgba(0,0,0,0.44);
 }
}
html.no-js .story_chapter,
html:not(.story-reveal-ready) .story_chapter{
 opacity:1;
 transform:none;
}
html.no-js .story_chapter .story_chapter_media img,
html:not(.story-reveal-ready) .story_chapter .story_chapter_media img,
html.no-js .story_chapter .story_chapter_copy .chapter_year,
html.no-js .story_chapter .story_chapter_copy h3,
html.no-js .story_chapter .story_chapter_copy p,
html:not(.story-reveal-ready) .story_chapter .story_chapter_copy .chapter_year,
html:not(.story-reveal-ready) .story_chapter .story_chapter_copy h3,
html:not(.story-reveal-ready) .story_chapter .story_chapter_copy p{
 opacity:1;
 transform:none;
}
@media (prefers-reduced-motion: reduce){
 .story_chapter,
 .story_chapter_copy .chapter_year,
 .story_chapter_copy h3,
 .story_chapter_copy p,
 .story_chapter_media img{
  transition:none !important;
 }
 .story_chapter,
 .story_chapter:nth-child(2n),
 .story_chapter .story_chapter_media img,
 .story_chapter .story_chapter_copy .chapter_year,
 .story_chapter .story_chapter_copy h3,
 .story_chapter .story_chapter_copy p{
  opacity:1 !important;
  transform:none !important;
 }
}
/********************* our_story_end ****************/

/********************* eco_friendly ****************/
.eco-page #about_main {
 display: none;
}

.eco-page #about_main .about_main_media {
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 width: 100%;
 height: 100%;
 transform: none;
 border-radius: 0;
 overflow: hidden;
 box-shadow: none;
}

.eco-page #about_main .about_main_media_image {
 object-fit: cover;
 object-position: center center;
}

.eco-page #about_main .about_main_3 {
 min-height: 100vh;
 padding-top: 0;
 padding-bottom: 0;
 background-color: rgba(255, 255, 255, 0.16);
}

.eco-page #our_story {
 position: relative;
 overflow: hidden;
 background-color: transparent;
 padding-top: 40px;
 padding-bottom: 220px;
}

.eco-page .eco_story_video_bg {
 position: absolute;
 inset: 0;
 z-index: 0;
 overflow: hidden;
}

.eco-page .eco_story_video_bg video {
 position: absolute;
 top: 50%;
 left: 50%;
 width: 100%;
 height: auto;
 min-width: 100%;
 min-height: 100%;
 aspect-ratio: 4 / 3;
 object-fit: cover;
 object-position: center center;
 transform: translate(-50%, -50%) scale(1.1);
}

.eco-page .eco_story_video_bg::after {
 content: "";
 position: absolute;
 inset: 0;
 background: rgba(255, 255, 255, 0.2);
}

.eco-page #our_story .container {
 position: relative;
 z-index: 2;
}

.eco-page .about_1 {
 position: relative;
 z-index: 3;
 margin-top: -80px;
}

.eco-page .about_story {
 display: block;
 position: relative;
 z-index: 3;
 max-width: 760px;
 width: calc(100% - 360px);
 margin: 22px 0 0;
 padding: 0 14px;
}

.eco-page .about_story p {
 background: transparent;
 color: #f4f4f2;
 text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
 margin-bottom: 16px;
 transition: opacity 2.2s ease, transform 2.2s ease;
 will-change: transform, opacity;
}

.eco-page .about_1 h3,
.eco-page .about_1 h2,
.eco-page .about_1 h2 a {
 color: #ffffff;
 text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.eco-page .about_story p.is-visible {
 opacity: 1 !important;
 transform: translateX(0) !important;
}

.eco-page .eco_story_image_panel {
 position: absolute;
 right: 28px;
 bottom: 26px;
 width: min(28vw, 300px);
 margin: 0;
 text-align: center;
 z-index: 4;
}

.eco-page .eco_story_image_panel img {
 width: 100%;
 max-width: 100%;
 height: auto;
 display: block;
 margin: 0 auto;
 border-radius: 12px;
 border: 2px solid rgba(232, 244, 233, 0.45);
 box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
}

.eco-page .eco_story_image_panel figcaption {
 margin-top: 12px;
 color: #edf6ea;
 font-size: 14px;
 letter-spacing: 0.04em;
 text-shadow: 0 2px 6px rgba(0, 0, 0, 0.45);
}
/********************* eco_friendly_end ****************/




@media screen and (max-width : 991px){
 #our_story{
  padding-top:48px;
  padding-bottom:60px;
 }
 .story_book::before{
  display:none;
 }
 .story_chapter,
 .story_chapter_reverse{
  grid-template-columns:1fr;
 }
 .story_chapter:not(.is-visible):nth-child(2n){
  transform:translateX(44px) scale(0.985);
 }
 .story_chapter:not(.is-visible):nth-child(2n+1){
  transform:translateX(-44px) scale(0.985);
 }
 .story_chapter_reverse .story_chapter_media{
  order:0;
 }
 .story_chapter_copy{
  padding:38px 32px 24px;
 }
 .story_chapter_copy h3{
  font-size:29px;
  line-height:1.22;
 }
 .story_chapter_copy p{
  font-size:16px;
  line-height:1.76;
  max-width:none;
 }
 .story_chapter_media{
  padding:18px;
 }
 .story_chapter_media img{
  max-width:280px;
 }
 .eco-page .eco_story_image_panel {
   right: 16px;
  bottom: 18px;
  width: min(36vw, 250px);
 }
 .eco-page .about_story {
  max-width: 640px;
  width: calc(100% - 290px);
 }
}
@media screen and (max-width : 767px){
.about_main_3,
.story_chapter{
 backdrop-filter: none;
}
.story_chapter,
.story_chapter_copy .chapter_year,
.story_chapter_copy h3,
.story_chapter_copy p,
.story_chapter_media img{
 opacity:1 !important;
 transform:none !important;
 transition:none !important;
}
#our_story .story_book{
 gap:18px;
}
#our_story{
 padding-top:38px;
 padding-bottom:48px;
 background-attachment:scroll;
}
#our_story .about_1 h3{
 letter-spacing:0.16em;
 font-size:12px;
}
#our_story .about_1 h2,
#our_story .about_1 h2 a{
 font-size:31px;
 line-height:1.2;
}
.story_chapter{
 border-radius:16px;
 margin-bottom:22px;
 backdrop-filter: none;
}
.story_chapter_copy{
 padding:28px 22px 16px;
}
.story_chapter_copy h3{
 font-size:24px;
 line-height:1.24;
}
.story_chapter_copy p{
 font-size:15px;
 line-height:1.72;
 text-align:left;
}
.story_chapter_copy p:first-of-type::first-letter{
 float:none;
 font-size:inherit;
 line-height:inherit;
 padding-right:0;
 color:inherit;
}
.chapter_year{
 font-size:12px;
 letter-spacing:0.22em;
}
.story_chapter_media img{
 max-width:236px;
}
.eco-page #about_main {
 min-height: 92vh;
}
.eco-page #about_main .about_main_media {
 top: 0;
 width: 100%;
 height: 100%;
 border-radius: 0;
}
.eco-page #about_main .about_main_3 {
 min-height: 92vh;
 padding-top: 0;
 padding-bottom: 0;
}
.eco-page .about_1 {
 margin-top: 0;
}
.eco-page #our_story {
 padding-bottom: 28px;
}
.eco-page .about_story {
 width: 100%;
 max-width: 900px;
 margin: 22px auto 0;
}
.eco-page .eco_story_image_panel {
 position: static;
 width: min(88vw, 320px);
 margin: 20px auto 0;
}
.about_main_3 {
 padding-top: 30px;
 padding-bottom: 30px;
}
#about_main {
 min-height: 20vh;
 text-align: center;
}
.about_main_3 {
 min-height: 20vh;
}
.about_main_2 ul {
 text-align: center;
}
#about {
 padding-bottom:0px;
 text-align: center;
}
.about_3{ 
 padding-bottom:27px;
}
#erosion {
 text-align: center;
}
.erosion_3 {
 margin-bottom: 18px;
}
#product {
 padding-top: 20px;
 padding-bottom:0px;
 text-align: center;
}
.product_3 i {
 margin-right:5px;
 padding: 10px 12px 10px 12px;
}
.product_3 h3 {
 width: 100%;
}
.product_1 h2 {
 padding-bottom: 30px;
}
.product_3{ 
 padding-bottom:50px; 
}
}

@media screen and (max-width : 480px){
 #our_story .about_1 h2,
 #our_story .about_1 h2 a{
  font-size:28px;
 }
 .story_chapter_copy{
  padding:24px 18px 14px;
 }
 .story_chapter_copy h3{
  font-size:22px;
 }
 .story_chapter_copy p{
  font-size:14px;
 }
}

@media (min-width:470px) and (max-width:767px) { 

}
 
@media (min-width:768px) and (max-width:960px) { 
.about_main_2 ul {
 padding-top:8px;
}
.erosion_3 h3 {
 padding-top: 0px;
 padding-bottom: 3px;
 letter-spacing: 0px;
 font-size: 18px;
}
.button_1 {
 font-size: 18px;
 padding: 10px 18px 10px 18px;
}
.erosion_3 p {
 padding-bottom: 5px;
 font-size: 15px;
}
.product_3 a {
 font-size: 15px;
}
.product_3 p {
 font-size: 14px;
}
} 

 
@media (min-width:961px) and (max-width:1200px) {
.about_main_2 ul {
 padding-top:8px;
}
.erosion_3 h3 {
 padding-top: 0px;
 padding-bottom: 3px;
 letter-spacing: 0px;
 font-size: 18px;
}
.button_1 {
 font-size: 18px;
 padding: 10px 18px 10px 18px;
}
.erosion_3 p {
 padding-bottom: 5px;
 font-size: 15px;
}
.product_3 a {
 font-size: 15px;
}
.product_3 p {
 font-size: 14px;
}
}

@media (min-width:1201px) and (max-width:1320px) {

}