/* Font Family */

/* MainHeadings */
@font-face {font-family: 'Belleza-Regular';src: url('../fonts/Belleza/Belleza-Regular.ttf')}


/* Paragraphs */
@font-face {font-family: 'Asap-Light';src: url('../fonts/Asap/static/Asap-Light.ttf')}
@font-face {font-family: 'Asap-Regular';src: url('../fonts/Asap/static/Asap-Regular.ttf')}
@font-face {font-family: 'Asap-Medium';src: url('../fonts/Asap/static/Asap-Medium.ttf')}
@font-face {font-family: 'Asap-SemiBold';src: url('../fonts/Asap/static/Asap-SemiBold.ttf')}
@font-face {font-family: 'Asap-Bold';src: url('../fonts/Asap/static/Asap-Bold.ttf')}


html {overflow-x: hidden;}
body { height: 100%; overflow-x: hidden !important;  width: 100% !important; font-family: 'Asap-Regular';  scroll-behavior: smooth;background-color: #767E07; }
ul {margin: 0px !important;padding: 0px;}
ul li {margin: 0px;padding: 0px;font-size: 14px;list-style-type: none;}
a {text-decoration: none !important;}

/* FontStyles */
h1 { font-size: 50px; }
h2 { font-size: 40px; }
h3 { font-size: 30px;font-family: 'Belleza-Regular';text-transform: uppercase;}
h4 { font-size: 28px;font-family: 'Belleza-Regular'; }
h5 { font-size: 24px;font-family: 'Belleza-Regular'; }
h6{ font-size: 20px;font-family: 'Asap-Regular';color: #fff;;}
p { font-size: 18px; font-family: 'Asap-Regular'; margin-bottom: 0; }

section{padding: 80px 0;}

/* Header */
.header{background-image: url(../Images/navbar.webp);background-size: cover;background-position: center;width: 100%;padding: 30px 0;background-repeat: no-repeat;}
.contentBlock h4{color: #fff;margin-bottom:5px;text-transform: uppercase;}
.contentBlock h5{color: #fff;text-transform: uppercase;}
.icon {cursor: pointer;position: fixed;top: 0px;right: -10px;z-index: 10001;padding: 10px;opacity: 0;transition: opacity 0.3s ease;}
.icon img {width: 60px;}
.sidenav {position: fixed;top: 30px;right: 0;background-color: #ECF5AB;overflow-x: hidden;padding: 10px 20px;z-index: 9999;border-radius: 120px;border: 2px solid #25360C;transform: translateX(0); /* visible by default */transition: transform 0.8s ease;}
.sidenav.closed {transform: translateX(120%); /* hide */}

.sidenav ul li {padding: 0px 8px 0px 32px;font-size: 18px;display: inline-block;transition: all 0.8s ease;}
.sidenav ul li .navmenu {text-decoration: none;font-size: 16px;color: #25360C;transition: 0.8s;font-weight: 600;transition: all 0.3s ease;position: relative;}
.sidenav ul li:hover {transform: translateY(-3px);}
.sidenav ul li .navmenu::after {content: "";display: block;width: 0;height: 2px;background: #FD5900;transition: width 0.8s ease;margin-top: 5px;}
.sidenav ul li .navmenu:hover::after {width: 100%;}
.sidenav ul li img { width: 80px;}
.sidenav .navmenu:hover {color: #FD5900;}
.sidenav ul li .navmenu.active {color: #FD5900;}
.close-btn {background: none;border: none;font-size: 30px;position: absolute;top: 15px;left: 20px;cursor: pointer;color: #25360C;z-index: 10000;display: none;}


.banner {position: relative;height:800px;overflow: hidden;z-index: 1;width: 100vw;display: block;}
.banner>div {position: absolute;transition: all ease-in-out 0.5s;left: 0;right: 0;top: 0;bottom: 0;width: 100%;}
/* .banner>div>img {width: 100%;height: 750px;display: block;}display: block; } */
.banner>div>video {width: 100%;object-fit: cover;height: 100%;}
@keyframes zoomOutMap {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(4);
    opacity: 0;
  }
}
.banner,
.zoom1,
.zoom1 img {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.zoom1 {z-index: 222;animation: zoomOutMap 4s ease-in-out 2s forwards;transform-origin: center center;display: block;position: relative;right:0 ;}
.zoom1 img{width: 100%;display: block;height:800px;object-fit: cover;}
.section-wrapper {display: flex;position: relative;overflow: hidden;}


.section-wrapper {display: flex;position: relative;z-index: 1;}
.left-panel {color: #fff;padding: 60px 60px 30px 70px;flex: 1;}
.left-panel h2 {font-size: 28px;font-family: 'Belleza-Regular';color: #fff;}
.left-panel p {font-size: 18px;margin-top: 20px;color: #fff;}
.right-panel {flex: 2;display: flex;overflow: hidden;}
.overlay-box {flex-grow: 1;flex-basis: 0;min-width: 0;position: relative;background-size: cover;background-position:left center;transition: flex-grow 0.8s ease;will-change: flex-grow;cursor: pointer;}
.overlay-box.active {flex-grow: 2;}
.overlay {position: absolute;inset: 0;background-color: rgba(0, 0, 0, 0.6);display: flex;flex-direction: column;justify-content: flex-end;padding: 20px;color: #fff;transition: background-color 0.3s ease;}
.overlay-box.active .overlay {background-color: rgba(255, 255, 255, 0.1);padding: 0;}
.overlay-box.active .text{display: none;}
.overlay-box.active{padding: 0;}
.overlay h4 {font-size: 18px;margin: 0;padding-bottom: 10px;}
.hover-content {position: absolute;bottom: 0;left: 0;width: 100%;opacity: 0;visibility: hidden;transition: opacity 0.6s ease, visibility 0.6s;transform: translateX(0);background-color: rgba(0, 0, 0, 0.8);padding: 20px;}
.overlay-box.active .hover-content {
  opacity: 1;
  visibility: visible;
  transition-delay: 0.2s;

}
.overlay-box .text-bg p {margin: 0;font-size: 16px;width: 300px !important;color: #fff;}


.overlay .btn {background-color: #e03e0e;border: none;padding: 8px 28px;font-size: 14px;margin-top: 10px;color: #fff;border-radius: 2px !important;}
.overlay:hover{padding: 0;}
.overlay:hover .text{display: none;}
.btn:hover {background-color: #01308C;}
.about-heading {display: flex;align-items: center;gap: 0px;margin-top: 40px;position: relative;}
.leaves {display: flex;flex-direction: column;gap: 4px;margin-bottom: 5px;position: absolute;top: -40px;left: -58px;}
.leaf {width: 70px;height: auto;}
.leaf-1 {transform: rotate(0deg);}
.overlaytextmob{display: none;}
/* Count */
.count{background-image: url(../Images/count-bg.webp);width: 100%;background-position: center;background-size: cover;}
.counter-card {padding:20px 30px;text-align: left;border-left: 1.5px solid #253115;}
.counter-number {font-size: 48px;font-weight: 600;color: #253115;margin-bottom: 0px;overflow: hidden;/* height: 4rem; */display: flex;align-items: center;justify-content: flex-start;}
.counter-label {font-size: 24px;color: #253115;font-weight: 500;}
.rolling-number {display: inline-block;transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);font-variant-numeric: tabular-nums;font-family: 'Belleza-Regular';}
.counter-number span{font-family: 'Belleza-Regular';}
.counter-card.counting .counter-number {animation: countUp 0.5s ease-out;}


@keyframes countUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.textwrap p{color: #fff;}
.stewe{background-image: url(../Images/stewe.webp);background-position: center;background-size: cover;width: 100%;}
.featurecard{height:550px;align-items: center;position: relative;z-index: 2;}
.card-custom {margin-top: 120px;background: #E7EB9C;border: none;border-radius: 0px !important;box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);height: 360px;position: relative;transition: all 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);z-index: 2;}
.card-custom:hover {border-top-left-radius: 96px !important;}
.card-body {
  height: 100%;display: flex;flex-direction: column;justify-content: flex-start;position: relative;transition: all 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.card-image {width: 100%;height:250px;object-fit: cover;margin-top: -120px;margin-bottom: 15px;transition: all 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);flex-shrink: 0;}
.card-title {color: #01574A;font-size:24px;font-weight: bold;margin-bottom: 5px;padding-bottom: 0px;transition: all 0.9s ease;text-transform: none;}
.card-text {color: #25360C;font-size: 0.95rem;line-height: 1.6;margin-bottom: 20px;transition: all 0.9s cubic-bezier(0.4, 0, 0.2, 1);display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;-webkit-line-clamp: 3;line-height: 1.5em;max-height: 4.5em;}
.btn-more {background:#FD5900;border: none;color: #fff;padding: 10px 25px;font-weight: bold;border-radius: 2px;text-transform: uppercase;letter-spacing: 0.5px;transition: all 0.9s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);margin-top: auto;align-self: flex-start;}
.btn-more:hover {background: #01308C;transform: translateY(-2px);box-shadow: 0 6px 20px rgba(255, 107, 53, 0.4);color: #fff;
}

.card-custom:hover .card-image {margin-left: 40px;width: calc(100% - 40px);height: 280px;}
.vertical-text {position: absolute;font-family: 'Belleza-Regular';left: -40px;top: 30%;transform: translateY(-40%) rotate(-90deg);font-size: 28px;font-weight: bold;color: #01574A;opacity: 0;transition: all 0.9s cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: center;white-space: nowrap;z-index: 10;}
.card-custom:hover .vertical-text {opacity: 1;}
.card-custom:hover .card-title{display: none;}



.avocado-section{position: relative;background: linear-gradient(to right, #767E07 45%, #25360C 45%);}
.para{color: #fff;font-size: 18px;}
/* Animation for the chart */
/* Initial state: chart hidden off to the right */
.chart {overflow: hidden;}
.wheel {width: 550px;height: 500px;transform: translateX(100%) rotate(-120deg);opacity: 0;transition: transform 3s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 1.8s ease;}
.chart.active .wheel {transform: translateX(0) rotate(0deg);opacity: 1;}
.legandmob{display: none;}
/* Rotate wheel image when active */


/* Products */
.products{overflow: hidden;background-color: #F1FBD1;}
.down-col{margin-top: 160px;}
.hass {background: radial-gradient(50% 50% at 50% 50%, #98A450 0%, rgba(101, 109, 55, 0) 100%)  ;padding: 20px 40px;position: relative;text-align: center;display: flex;align-items: center;justify-content: center;flex-direction: column;z-index: 2;}
.texthass {z-index: 0;text-align: center;position: relative;width: 100%;display: flex;flex-direction: column;justify-content: center;  /* Center content vertically */align-items: center;      /* Center content horizontally */height: 100%;overflow: hidden;}

.texthass h3 {font-size: clamp(3rem, 5vw, 5.5rem);color: rgba(37, 54, 12, 0.04);margin: 0;transition: color 0.5s ease;text-transform: uppercase;overflow: hidden;display: inline-flex;     /* Use inline-flex for better control */justify-content: center;  /* Horizontally center the content */align-items: center;      /* Vertically center the content */position: relative;       /* Keep this relative to allow flexibility */height: 100%;}
.highlight-hass {color: rgba(37, 54, 12, 0.04);transition: color 0.5s ease;}

.hass img {width: 100%;/* Start smaller */max-width: 400px;/* Limit initial size */position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);/* Center the image */transition: all 0.5s ease;z-index: 1;}
.texthover {position: absolute;bottom: -30px;left: 0;transition: all 0.5s ease;padding: 20px;color: #253115 !important;opacity: 0;visibility: hidden;z-index: 10;width: 100%;text-align: center;}
.down-col .texthover{bottom: -30px;}
.hass:hover .texthover {opacity: 1;visibility: visible;}
.texthover p{color: rgba(37, 54, 12, 0.8);}
.hass:hover img {width: 100%;/* Grow to full width on hover */max-width: 400px;/* Limit maximum size */transform: translate(-50%, calc(-50% - 90px));/* Keep centered horizontally and move up */}
.hass:hover .highlight-hass {color: rgba(37, 54, 12, 0.8);}
.whoweareslider{display: none;margin-top:0px;overflow: hidden;height: 400px;}

.hass1{overflow: hidden;text-align: center;background: radial-gradient(50% 50% at 50% 50%, #98A450 0%, rgba(101, 109, 55, 0) 100%);}
.hass1 img{width: 100%;height: 200px !important;position: relative;top: 100px;object-fit: contain;}
.texthass1 h3{font-size:50px;color: rgba(37, 54, 12, 0.04);margin: 0;text-transform: uppercase;overflow: hidden;font-weight: bold;}
.texthass1{overflow: hidden;}
.whoweareslider>.carousel-control-prev,
.whoweareslider>.carousel-control-next {top:300px !important}
/* Zigzag effect */
.products>.row:nth-child(odd)>.col-xl-6:first-child {
  margin-top: 0;
}

.products>.row:nth-child(odd)>.col-xl-6:last-child {
  margin-top: 60px;
}

.products>.row:nth-child(even)>.col-xl-6:first-child {
  margin-top: 60px;
}

.products>.row:nth-child(even)>.col-xl-6:last-child {
  margin-top: 0;
}

/* Galley */
.gallery{background-color: #25360C;}


/* // CSS - Replace your existing carousel CSS  */
.gallery .carousel {position: relative;padding: 0px 0;overflow: hidden;width: 100%;height: 500px;}
.gallery .carousel__container {position: relative;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;overflow: hidden;}
.gallery .carousel__slider {display: flex;align-items: center;position: relative;perspective: 1200px;transform-style: preserve-3d;}
.gallery .carousel__slider__item {position: absolute;width: 200px;height: 350px;transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);transform-style: preserve-3d;filter: grayscale(100%);opacity: 0.1;/* All items start from center, then move to their positions */left: 50%;top: 50%;transform: translate(-50%, -50%);}
.gallery .carousel__slider__item img {width: 100%;height: 100%;object-fit: cover;display: block;border: none;transition: all 1s ease;background-color: #656D37;mix-blend-mode: luminosity;object-position: right center;}
.gallery .carousel__slider__item.active {width: 500px;height: 400px;filter: grayscale(0%);opacity: 1;z-index: 10;/* Active item stays exactly in center */transform: translate(-50%, -50%) scale(1) rotateY(0deg);}
.gallery .carousel__slider__item.active img {border:8px solid #E3F081;background-color: transparent;mix-blend-mode: normal;}
.gallery .carousel__slider__item.left-1 {transform: translate(-50%, -50%) translateX(-350px) rotateY(45deg) scale(0.85);z-index: 5;opacity: 0.8;}
.gallery .carousel__slider__item.left-2 {transform: translate(-50%, -50%) translateX(-520px) rotateY(60deg) scale(0.7);z-index: 3;opacity: 0.6;}
.gallery .carousel__slider__item.right-1 {transform: translate(-50%, -50%) translateX(350px) rotateY(-45deg) scale(0.85);z-index: 5;opacity: 0.8;}
.gallery .carousel__slider__item.right-2 {transform: translate(-50%, -50%) translateX(520px) rotateY(-60deg) scale(0.7);z-index: 3;opacity: 0.6;}
.carousel-controls {position: absolute;bottom: -30px;left: 0;width: 100%;z-index: 20;display: flex;justify-content: center;padding: 0 10px;pointer-events: none;transform: translateY(-50%);align-items: center;}
.carousel-arrow {background: transparent;border: none;border-radius: 50%;padding: 8px;cursor: pointer;pointer-events: auto;display: flex;align-items: center;justify-content: center;transition: background 1s ease;}
/* .carousel-arrow:hover {background: rgba(0, 0, 0, 0.8);} */
.carousel-arrow img {width: 30px;/* height: 20px; */display: block;}
/* @media (min-width: 992px) {
  .carousel-controls {
    display: none;
  }
} */


/* Banner */
.hero{background-position: top;background-size: cover;height: 450px;width: 100%;background-repeat: no-repeat;}

/* Contact */
.mapdetails{overflow: hidden;position: relative;}
.details{position: relative;margin-top: -180px;pointer-events: none;}
.mapdetails{background-image: url(../Images/map-bg.webp);background-position: center;background-size: cover;padding: 30px;position: relative;display: inline-block;width: 50%;box-shadow: 0px 4px 15px 0px rgba(255, 239, 219, 0.4);}
.mapdetails h4{font-family: 'Belleza-Regular';color: #fff;}
.mapdetails p{color: #fff;}
#farmleft{margin-left: 120px}
/* Animation styles */
.details .col-xl-6:first-child .mapdetails {opacity: 0;transform: translateY(-500px);transition: all 0.8s ease-out;}
.details .col-xl-6:last-child .mapdetails {opacity: 0;transform: translateY(500px);transition: all 0.8s ease-out;}
.details .col-xl-6:first-child .mapdetails.animate {opacity: 1;transform: translateY(0);}
.details .col-xl-6:last-child .mapdetails.animate {opacity: 1;transform: translateY(0);}

.mapmobile{display: none;}
.mapdetailmob{overflow: hidden;}
.mapdetailmob{background-image: url(../Images/map-bg.webp);background-position: center;background-size: cover;padding: 30px;position: relative;display: inline-block;width: 100%;margin: 20px 0;}
.mapdetailmob h4{font-family: 'Belleza-Regular';color: #fff;}
.mapdetailmob p{color: #fff;}

/* Contact Form */
.contactdet{background: linear-gradient(to bottom, #767E07,rgb(21, 33, 13), rgb(21, 33, 13));
}
.contactwrapper{background-color: #ECF5AB;padding: 30px 0;width: 100%;position: relative;}
.contactwrapper .imgclm img{  width: 100%;height: 100%;object-fit: cover; }
.contactwrapper .imgclm{ position: absolute;right: 0;top: 0;width: 50%;height: 100%;overflow: hidden; }
.heading{color: #656D37;font-family: 'Belleza-Regular';margin-bottom: 20px;}
.form-control{color: rgba(30, 30, 30, 0.502);font-size: 14px;border: 1px solid #25360C66;border-radius: 1px ;}
.form-select{font-size: 14px;border-radius: 1px;border: 1px solid #25360C66}
.captcha-container {position: relative;}
.captcha-container .preview {color: rgba(30, 30, 30, 0.502);width: 100%;text-align: center;line-height: 32px;letter-spacing: 8px;border: 1px solid #25360C66;margin-bottom: 0px;position: relative;font-size: 14px;border-radius: 1px;}
.form_input_captcha {position: relative;top: 0;left: 0;font-size: 14px;border: 1px solid #25360C66 !important;outline: none;padding: .375rem .75rem;background: #fff;width: 100%;}
.form_label_captcha {position: absolute;left: 50%;top: 9px;padding: 0 20px;color: #969696 !important;font-size: 14px;transition: .4s;}
.form_input_captcha:focus+.form_label_captcha {top: 0em;left: .8em;color: #969696;font-size: .80em;font-weight: 600;}
.form_input_captcha:not(:placeholder-shown).form_input_captcha:not(:focus)+.form_label_captcha {top: 0;left: .8em;font-size: .80em;font-weight: 600;}
.form_input_captcha:focus {border: none;}
/* Ensure all captchas are styled the same way */
.captcha-container .preview span {display: inline-block;user-select: none;}
.captcha-container .captcha_form { display: flex; position: relative;}
.captcha-container .captcha_form input {width: 100%;font-size: 14px;outline: none;padding: .375rem .75rem;}
.captcha-container .captcha_form .captcha_refersh {border: none;outline: none;background: #fff;color: #eee;cursor: pointer;border-radius: 0.5em;margin-left: 5px;}
.captcha_refersh {transition: .4s;border: none;background: none !important;position: absolute;top: 8px;right: 18px;}
.captcha_refersh i {color: #25360C !important;font-size: 14px;}
.btn-outline-orange{background-color: #FD5900;color: #fff;border-radius: 1px !important;}
.btn-outline-orange:hover{color: #fff;;}

/* Footer */
.footer{position: relative;padding: 20px 0;background-image: url(../Images/footer.webp);background-position: center;background-size: cover;}
.listview{display: flex;align-items: center;justify-content: center;flex-direction: column;gap: 20px;}
.listview img{width: 120px;}
.listview ul li{display: inline-block;padding: 0 10px;font-size: 16px;color: #25360C;}
.listview ul li a{font-size: 16px;color: #25360C;font-weight: 600;}
.listview ul li a:hover{color: #FD5900;}
.listview ul li a.active{color: #FD5900;}.socialLinks{text-align: end;}
.socialLinks li{display: inline-block;padding: 0 10px;}
.socialLinks li a{font-size: 14px;color: #25360C;font-weight: 500;}
.socialLinks li a:hover{color: #FD5900;}
.copy{text-align: center;}
.copy p{font-size: 14px;color: #25360C;letter-spacing: 0px;}
.form-label{margin-bottom: 0;font-family: 'Belleza-Regular';font-size: 14px;color: #656D37;text-transform: uppercase;margin-bottom: 0;}

/* Career */
.phone-input-wrapper {display: flex;flex-direction: column;}
.phone-input-group {display: flex;}
.phone-dropdown {width: 82px;border-top-right-radius: 0;border-bottom-right-radius: 0;}
.phone-input {border-top-left-radius: 0 !important;border-bottom-left-radius: 0 !important;}
.custom-page select.form-select[disabled] {background-image: none;}
.file-input {position: relative;display: inline-block;width: 100%;}
.file-upload-label {display: block;position: relative;cursor: pointer;background: #F2E6EE66;border: 0.5px solid rgba(30, 30, 30, 0.502);text-align: left}
.file-upload-label input[type="file"] {display: none;}
.placeholder {color: rgba(30, 30, 30, 0.502);;/* letter-spacing: 3px; *//* font-family: 'Jost-Light'; */font-size: 12px;background-color: transparent !important;opacity: 2}
.uploaded-files {display: flex;flex-wrap: wrap;gap: 10px;}
.uploaded-files span {display: flex;justify-content: space-between;align-items: center;font-size: 14px;gap: 10px;color: rgba(30, 30, 30, 0.502);font-weight: 500;}
.delete-file {color: #25360C;cursor: pointer;border: none !important;background-color: none !important;}

/* Careerblocks */
.careerBlock{display: flex;align-items: center;flex-direction: row;}
.blue{background-image: url(../Images/blue.svg);background-size: cover;background-position: top bottom;width: 100%;text-align: left;padding: 50px;background-repeat: no-repeat;background-color: #01308C;background-blend-mode: overcolor-dodgelay;min-height: 170px;display: flex;align-items: flex-end;}
.blue h5{color: #fff;}
.green{background-image: url(../Images/green.svg);background-size: contain;background-position: top bottom;width: 100%;text-align: left;padding: 50px;background-repeat: no-repeat;background-color: #6D9942;background-blend-mode: overcolor-dodgelay;min-height: 170px;display: flex;align-items: flex-end;}
.green h5{color: #fff;}
.organe{background-image: url(../Images/orange.svg);background-size: contain;background-position: top bottom;width: 100%;text-align: left;padding: 50px;background-repeat: no-repeat;background-color: #D56528;background-blend-mode: overcolor-dodgelay;min-height: 170px;display: flex;align-items: center}
.organe h5{color: #fff;}
/* Animation styles - only additions to your code */
.blue, .green, .organe {transform: translateX(100%);opacity: 0;transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);}

.blue.animate {transform: translateX(0);opacity: 1;transition-delay: 0.2s;}
.green.animate {transform: translateX(0);opacity: 1;transition-delay: 0.4s;}
.organe.animate {transform: translateX(0);opacity: 1;transition-delay: 0.6s;}

/* Positions */
.accordion{background-image: url(../Images/career-bg.webp);background-position: center;background-size: cover;padding: 30px;}
.accordion-button:not(.collapsed){background-color: transparent !important;box-shadow: inset 0 -1px 0 rgb(255 255 255) !important;color: #fff !important;padding: 10px;}
.accordion-item{background-color: transparent !important;border: none !important;}
.accordion-button{background-color: transparent !important;color: #fff !important;border-bottom: 1px solid #fff !important;font-family: 'Belleza-Regular';font-size: 20px;}
.accordion-button span{color:#fff ;font-size: 18px;}
.accordion-body{color: #fff !important;padding: 30px !important;border-bottom: 1px solid rgba(255, 255, 255, 0.5);}
.accordion-body p{font-size: 18px;}
.accordion-body p a{color: #fff !important;}
.accordion-body ul{margin-top: 10px !important;}
.accordion-body ul li{list-style-type: disc !important;margin-left: 20px;}
.accordion-button::after{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: center;background-size: 18px 18px;    }
.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='%23fff' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: center;background-size: 18px 18px;    }
.btn-apply{margin-top: 20px;}
.btn-apply a{background-color: #FD5900;color: #fff;padding: 10px 25px;display: inline-block;}
.btn-apply a:hover{background-color: #01308C;}


/* Modal */
.modal-content{background-color: #E3F081;border-radius: 1px !important;}
.modal-title{color: #656D37;}
.modal-header{padding: 10px 28px;border-bottom:none !important}
.modal-body{padding: 10px 28px;}


/* Products-page dark skinned */
.dark{background-image: url(../Images/product-ban.webp);background-position: center;background-size: cover;width: 100%;height: 400px;background-color: #1E1E1E80;background-blend-mode: overlay;display: flex;align-items: flex-end;}
.darktext{background-image: url(../Images/darkbg.webp);background-position: center;background-size: cover;padding: 40px;background-blend-mode: luminosity;background-color: #2B1B18;display: inline-block;position: relative;top: 60px;box-shadow: 0px 4px 15px 0px rgba(255, 239, 219, 0.4);}
.darktext h5, .darktext p{color: #fff;}
.darktext p{font-size: 16px;}
.greenprd{background-image: url(../Images/green1.webp);background-position: center;background-size: cover;width: 100%;height: 400px;background-color: #1E1E1E80;background-blend-mode: overlay;display: flex;align-items: flex-end;margin: 120px 0 0px 0;}
.greentext{background-image: url(../Images/greenbg.webp);background-position: center;background-size: cover;padding: 40px;display: inline-block;position: relative;top: -130px;box-shadow: 0px 4px 15px 0px rgba(255, 239, 219, 0.4);}
.greentext p{color: rgb(255, 239, 219);font-size: 16px;}
.greentext h5{color: rgb(255, 239, 219);font-size: 20px;}







.byprod p{color: #fff;;}
.packtext p{color: #fff;;}
.packhouse h3, .byprod h3{color: #fff;margin-bottom: 2px;}
.packhouse h4, .byprod h5{color: #fff;}
.packhouse {position: relative;}
.rightcol {position: absolute;right: 0;top: 0;bottom: 0;width: 56.66%;/* equivalent to col-xl-8 */height: 100%;overflow: hidden;z-index: 1;}
.slide-video {object-fit: cover;display: block;width: 100%;height: 100%;}
.packtext {padding: 60px 0px;/* Adjust padding as needed */overflow: hidden;/* background: rgba(255, 255, 255, 0.9); *//* Optional: add background for readability */position: relative;z-index: 2;}
.packtext p{margin-bottom: 8px;color: #fff;;font-size: 18px;}
.builttxt{margin-top: 30px;color: #fff;;font-family: 'Asap-Light';}
.packhouse .carousel-item {background-position: center;background-size: cover;height: 100%;/* make height consistent */min-height: 400px;width: 100%;}
.packlist{margin-top: 20px !important;}
.packlist li{margin-left: 20px;color: #fff;list-style: disc;padding: 6px 0;font-size: 16px;}
.packhouse .carousel-inner,
.packhouse .carousel,
.packhouse .carousel-item,
.packhouse .imgclm {
  height: 100%;
}

.lfttxt .imgclm img {width: 100%;object-fit: cover;display: block;}
.rightcolmob{display: none;}

/* Commitment */
.commit{background-color: #25360C;position: relative;z-index: 2;overflow: hidden;}
.comitext{padding: 80px 0;}
.comitext h3{color: #fff;;margin-bottom: 15px;}
.comitext p{color: #fff;;margin-bottom: 15px;}
.comitext ul li{margin-left: 30px;list-style: disc !important;color: #fff;;}
.rightimg{position: absolute;right: 0;top: 0;overflow: hidden;width: 40%;height: 100%;}
.rightimg img{width: 100%;object-fit: cover;height: 100%;}
.overlapimg {width: 100%;position: relative;}


/* Our Cultivard */
.culti {position: relative;background-image: url(../Images/culti.webp);background-size: cover;background-position: center;width: 100%;height: 900px;display: flex;align-items: center;}
.culti .row {display: flex;flex-wrap: wrap;align-items: center;gap: 20px;}
.culti-text {flex: 0 0 auto;max-width: 600px;padding: 40px;color: white;display: flex;flex-direction: column;justify-content: center;}
.culti h3 {font-size: 30px;margin-bottom: 20px;color: #25360C;}
.culti p {font-size: 18px;line-height: 1.6;color: #25360C;}
.avocado-ring {position: relative;flex: 0 0 auto;max-width: 700px;height: 700px;display: flex;align-items: center;justify-content: center;}
.avocado-container {position: absolute;width: 300px;height: 300px;transform: translate(-50%, -50%);opacity: 0;transition: opacity 0.5s ease;}
.avocado-container img {width: 350px;height: 350px;object-fit: contain;}
/* Initial state - hide all containers until animation starts */
.avocado-container {
    opacity: 0;
    animation-play-state: paused;
}
/* Same size images + evenly spaced positions */
.img-1 {top: calc(50% - 230px);left: -10%;}
.img-2 {top: calc(50% - 220px);left: calc(40% - 100px);}
.img-3 {top: 40%;left: calc(40% + 100px);}
.img-4 {top: calc(50% + 155px);left: calc(40% + 65px);}
.img-5 {top: calc(50% + 225px);left: 20%;}
.img-6 {top: calc(50% + 225px);left: calc(40% - 400px);}
/* Animation triggers - only when 'active' class is added */
.img-1.active {
    animation: fadeInTop 0.8s ease 0.3s forwards;
}
.img-2.active {
    animation: fadeInRight 0.8s ease 0.6s forwards;
}
.img-3.active {
    animation: fadeInRight 0.8s ease 0.9s forwards;
}
.img-4.active {
    animation: fadeInRight 0.8s ease 1.2s forwards;
}
.img-5.active {
    animation: fadeInBottom 0.8s ease 1.5s forwards;
}
.img-6.active {
    animation: fadeInBottom 0.8s ease 1.8s forwards;
}

/* Animations */
@keyframes fadeInTop {
  from {
    opacity: 0;
    transform: translate(-50%, -80%) scale(0.8);
  }

  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate(50%, -50%) scale(0.8);
  }

  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes fadeInBottom {
  from {
    opacity: 0;
    transform: translate(-50%, 80%) scale(0.8);
  }

  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}


.avoimg img{width: 350px !important;height:  400px !important;display: block !important;margin: 0 auto !important;}
/* About */
.abt{padding: 40px 0;background-color: #25360C;overflow: hidden;position: relative;z-index: 2;}
.abt1{background-image: url(../Images/abt-1.webp);background-position: center;background-size: cover;height: 450px;width: 100%;margin: 80px 0;position: relative;}
.abtleftimg{background-image: url(../Images/darkbg.webp);background-color: #452A25;background-blend-mode: luminosity;padding: 80px 30px;margin-top: -40px;box-shadow: 0px 4px 15px 0px #FFFFFF33;margin-bottom: 40px;}
.abtleftimg h5{color: #fff;}
.abtleftimg h6{font-family: 'Belleza-Regular';color: #fff;;text-transform: uppercase;margin: 18px 0;}
.abtleftimg p{color: #fff;;margin-bottom: 10px;font-size: 16px}
#abtrightimg{margin-top: -65px;margin-bottom: 60px; }
/* Apply same overlap to both sections */
.abt .abtleftimg {margin-top: -60px; margin-bottom: 60px;}


.abt2{position: relative;}
.abt2 .rightimg{position: absolute;top: 0;right: 0;width: 60%;}
.values{padding: 60px 0;}
.values h3{color: #fff;;}
.values p{color: #ffff;;margin-bottom: 20px;font-size: 18px;}

.keybg{background-color:#656D37;margin-bottom: 40px;}
.key{background-color: #E3F081;position: relative;}
.keycard{transition: all 0.5s ease-in-out;text-align: center;}
.keycard img{width: 80px;height: 80px;transition: all 0.5s ease-in-out;margin-bottom: 20px;}
.keycard h5{color: #25360C;}
.keycard:hover.keycard img{transform: scale(1.21);}

.philo{background-image: url(../Images/img-10.webp);background-position: center;background-size: cover;padding-bottom: 180px;height: 500px;}
.philotext h3{color: #fff;;margin-bottom: 15px;}
.philotext p{color: #fff;;margin-bottom: 15px;font-size: 18px;}
.philotext h6{color: #fff;;margin-bottom: 15px;text-transform: uppercase;font-family: 'Belleza-Regular';}
.philoimg{width: 100%;}

.featureblock{position: relative;margin-top: -200px;background-color: transparent;}
.featureblock h6{text-transform: uppercase;font-size: 20px;font-family: 'Belleza-Regular';}
.blueblock{position: relative;padding-bottom: 40px;background-color:rgba(37, 54, 12, 1);}
.featurecard1{background-color: #01308C;transition: all 0.5s ease-in-out;padding: 30px 15px 45px 15px;height: fit-content;margin-bottom: 40px;}
.featurecard1 img{width: 60px;transition: width 0.5s ease-in-out;}
.featurecard1 h6{font-size: 18px;font-weight: 600;color: #fff;;margin-top: 25px;width: auto;margin-bottom: 10px;}
.featurecard1 p{color: #fff;font-size: 16px;}
.featurecard1:hover.featurecard1 img{width: 85px;}

.stwew1{background-color: #767E07;padding: 40px 0;}
.stwetxt{padding: 40px 0;}
.imgbg{background-position: bottom;background-size: contain;width: 400px;height: 280px;background-repeat: no-repeat;position: relative;bottom: -40px;}
.stwew1 p{color: #fff;;margin-bottom: 15px;}

.stewe2{background-position: center;background-size: cover;background-attachment: fixed;width: 100%;padding: 60px 0;background-color: rgba(0, 0, 0, 0.6);background-blend-mode: overlay;}
.stwewgreen{padding: 32px;border-radius: 20px;}
.stwewgreen p{color: #fff;;margin-bottom: 15px;font-size: 16px;}
.stwewgreen h5{color: #fff;;margin-bottom: 15px;text-transform: uppercase;font-size: 26px;}

.envirow{background-color: #58743D;position: relative;margin-top: 60px;padding: 40px;border-radius: 20px;}
.agri-icon{position: absolute;top: -40px;left: -40px;width: 150px;height: 150px;display: flex;align-items: center;justify-content: center;background-color: #6D9942;border: 8px solid #fff;;box-shadow: 0px 4px 12px 5px #00000040; z-index: 2;border-radius: 50%;transform: translateX(-100%) rotate(-120deg);opacity: 0;transition: transform 3s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 1.8s ease;}


.agri-icon img{width: 100px;height: auto;}
.envirow h5{text-align: center;font-weight: 600;color: #fff;;line-height: 32px;margin-bottom: 30px;text-transform: uppercase;}
.envirow p{margin-bottom: 15px;font-size: 18px;color: #fff;;}
.envirow ul{margin-bottom: 15px !important;color: #fff;;}
.envirow ul li{margin-left: 30px;list-style-type: disc;font-size: 18px;color: #fff;;}
.steweimg {position: absolute;top: -80px;right: -180px;width:800px;/* height: 800px; */height: auto;z-index: 1;}

.my-rotator img {width: 100%;opacity: 1;border-radius: 12px;}








/* Sustianbility */
.sustainrow{background-color: #a3694a;position: relative;margin-top: 60px;padding: 40px;border-radius: 20px;}
.sustain-icon{position: absolute;top: -40px;left: -40px;width: 150px;height: 150px;display: flex;align-items: center;justify-content: center;background-color:#FD5900;border: 8px solid #fff;;box-shadow: 0px 4px 12px 5px #00000040; z-index: 2;border-radius: 50%;transform: translateX(-100%) rotate(-120deg);opacity: 0;transition: transform 3s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 1.8s ease;}

.sustain-icon img{width: 100px;height: auto;}
.sustainrow h5{text-align: center;font-weight: 600;color: #fff;;line-height: 32px;margin-bottom: 30px;text-transform: uppercase;font-size: 26px;}
.sustainrow p{margin-bottom: 15px;font-size: 16px;color: #fff;;}
.sustainrow ul{margin-bottom: 15px !important;}
.sustainrow ul li{margin-left: 30px;list-style-type: disc;font-size: 18px;}



/* Orange */
.commun-icon{position: absolute;top: -40px;left: -40px;width: 150px;height: 150px;display: flex;align-items: center;justify-content: center;background-color:#01308C;border: 8px solid #fff;;box-shadow: 0px 4px 12px 5px #00000040; z-index: 2;border-radius: 50%;transform: translateX(-100%) rotate(-120deg);opacity: 0;transition: transform 3s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 1.8s ease;}
.commun-icon img{width: 100px;height: auto;}

.active .agri-icon,
.active .sustain-icon,
.active .commun-icon {
  transform: translateX(0) rotate(0deg);
  opacity: 1;
}

.mobimg, .mobavocado-ring, .contactmob{display: none;}
.modal{overflow: hidden;}
.policy-section{padding: 40px 0;background-image: url(../Images/culti.webp);background-size: cover;background-color: #F1FBD1;width: 100%;background-repeat: no-repeat;background-attachment: fixed;}
.policy-section h5 {font-size: 18px;color: #253115;;margin-top: 30px;margin-bottom: 10px;font-weight: 600;}
.policy-section h6 {font-size: 14px;color: #253115;;margin-top: 30px;margin-bottom: 10px;font-weight: 600;}
.policy-section p strong {font-size: 14px;color: #253115;;font-weight: 600;margin-top: 10px;}
.policy-section p {font-size: 14px;color: #253115;;margin-bottom: 15px;}
.policy-section ul {padding-left: 20px;margin-bottom: 20px;}
.policy-section li {list-style-type: disc !important;font-size: 14px;color: #253115;;margin-bottom: 10px;}
.policy-section a {color: #253115;;text-decoration: none;font-weight: normal;}
.policy-section a:hover {text-decoration: underline;color: #FD5900;font-weight: 600;}
.policy-section li p {font-size: 14px;color: #253115;;margin: 10px 0;}

.accoridan-collapse{transition: height 3s ease !important;}
.accordion-item:first-of-type>.accordion-header .accordion-button, .accordion-item:last-of-type>.accordion-header .accordion-button.collapsed{padding: 10px;border-radius: 1px !important;}

.mobavocado-ring .carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2325360C' viewBox='0 0 16 16'%3E%3Cpath d='M6.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L11.293 8 6.646 3.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
}
.mobavocado-ring .carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2325360C' viewBox='0 0 16 16'%3E%3Cpath d='M9.354 1.646a.5.5 0 0 1 0 .708L4.707 8l4.647 4.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E");
}
.my-custom-carousel {
  position: relative;
}

.my-custom-carousel .carousel-control-prev,
.my-custom-carousel .carousel-control-next {
  top: auto;
  bottom: -50px;
  width: auto;
  height: auto;
  opacity: 1;
  background: none;
  border: none;
}

.my-custom-carousel .carousel-control-prev {
  left: 50%;
  transform: translateX(-150%);
}

.my-custom-carousel .carousel-control-next {
  right: 55%;
  transform: translateX(150%);
}

.my-custom-carousel .custom-arrow {
  width: 40px;
  height: 40px;
}

#cookieNotice h3{font-size: 20px;color: #25360C;font-family: 'Belleza-Regular';}
#cookieNotice p{font-size: 14px;color: #25360C;}
#cookieNotice p a{color: #FD5900;text-decoration: underline !important;font-weight: 600;}
#cookieNotice p a:hover{color: #01308C !important;text-decoration: underline !important;font-weight: 600;}
.btn-primary-outline{background-color: #FD5900;color: #fff;border-radius: 1px !important;margin-top: 20px;}
.btn-primary-outline:hover{color: #fff;;background-color: #01308C;}
.btn-primary1{background-color: #FD5900;color: #fff;border-radius: 1px !important;margin-top: 20px;margin-right: 10px;}
.btn-primary1:hover{color: #fff;background-color: #01308C;}

.overimg{position: relative;display: none;z-index: 1;}




/* Cookie Banner Styles */
.cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #D7E167;
    color: white;
    padding: 15px;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3);
    z-index: 10000;
    display: none;
}

.cookie-banner.show {
    display: block;
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(100%);
    }

    to {
        transform: translateY(0);
    }
}

.cookie-content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
}

.cookie-text {
    flex: 1;
    min-width: 300px;
}
.cookie-text h4 {
    font-size: 20px;
    color: #25360C;
    margin-bottom: 0px !important;
    font-weight: 500;
}
.cookie-text p{font-size: 13px;color: #25360C;}
.cookie-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.cookie-btn {
    padding: 8px 18px;
    border: none;
    border-radius: 1px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
    /* font-family: 'Belleza-Regular'; */
    font-size: 12px;
    /* font-style: italic; */
    font-weight: 600;
    line-height: normal;
    /* letter-spacing: 2.8px; */
    /* text-transform: uppercase; */
}

.cookie-btn.accept-all {
    background: #FD5900;
    color: white;
}

.cookie-btn.accept-all:hover {
    background: #dc4d00;
}

.cookie-btn.essential-only {
    background: #FD5900;
    color: white;
}

.cookie-btn.essential-only:hover {
    background: #dc4d00;
}

.cookie-btn.settings {
    background: #0056b3;
    color: #fff;
    border: 2px solid #0056b3;
}

.cookie-btn.settings:hover {
    background: #01308C;
    color: #fff;
    border: 2px solid #01308C;
}

/* Settings Modal Styles */
.cookie-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 10001;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.cookie-modal.show {
    display: flex;
    animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
.cookie-modal .modal-content {
  background-color: #F1FBD1;padding: 30px;
    border-radius: 10px !important;
    max-width: 600px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    animation: slideIn 0.3s ease-out;
}
/* .modal-content {
    background: white;
    border-radius: 10px;
    padding: 30px;
    max-width: 600px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    animation: slideIn 0.3s ease-out;
} */

@keyframes slideIn {
    from {
        transform: scale(0.9) translateY(-20px);
        opacity: 0;
    }

    to {
        transform: scale(1) translateY(0);
        opacity: 1;
    }
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #7f8c8d;
}

.modal-close:hover {
    color: #2c3e50;
}
.modal-content h2{font-size: 30px;color: #25360C;}

.cookie-category {
    margin: 20px 0;
    padding: 15px;
    border: 1px solid #253115;
    border-radius: 8px;
}

.category-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.category-title {
    font-weight: bold;
    color: #253115;
}

.toggle-switch {
    position: relative;
    width: 50px;
    height: 24px;
    background: #bdc3c7;
    border-radius: 12px;
    cursor: pointer;
    transition: background 0.3s;
}

.toggle-switch.active {
    background: #27ae60;
}

.toggle-switch.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.toggle-slider {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background: white;
    border-radius: 50%;
    transition: transform 0.3s;
}

.toggle-switch.active .toggle-slider {
    transform: translateX(26px);
}

.category-description {
    color: #7f8c8d;
    font-size: 14px;
    line-height: 1.4;
}

.modal-buttons {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 30px;
    flex-wrap: wrap;
}

/* Content styles */
.content {
    padding: 20px;
    margin: 20px;
    background: #f8f9fa;
    border-radius: 8px;
}

.test-button {
    background: #007bff;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin: 10px 5px;
    transition: background 0.3s;
}

.test-button:hover {
    background: #0056b3;
}

.status {
    margin-top: 20px;
    padding: 15px;
    background: #e9ecef;
    border-radius: 5px;
    font-family: monospace;
}


.tran01 {transition: all ease-in-out 1s;-moz-transition: all ease-in-out 1s;-webkit-transition: all ease-in-out 1s;-ms-transition: all ease-in-out 1s;-o-transition: all ease-in-out 1s;}
.tran02 {transition: all ease-in-out 1.2s;-moz-transition: all ease-in-out 1.2s;-webkit-transition: all ease-in-out 1.2s;-ms-transition: all ease-in-out 1.2s;-o-transition: all ease-in-out 1.2s;}
.tran03 {transition: all ease-in-out 2.5s;-moz-transition: all ease-in-out 2.5s;-webkit-transition: all ease-in-out 2.5s;-ms-transition: all ease-in-out 2.5s;-o-transition: all ease-in-out 2.5s;}
.tran04 {transition: all ease-in-out 1.7s;-moz-transition: all ease-in-out 1.7s;-ms-transition: all ease-in-out 1.7s;-webkit-transition: all ease-in-out 1.7s;-o-transition: all ease-in-out 1.7s;}
.tran05 {transition: all ease-in-out 1.9s;-moz-transition: all ease-in-out 1.9s;-webkit-transition: all ease-in-out 1.9s;-ms-transition: all ease-in-out 1.9s;-o-transition: all ease-in-out 1.9s;}
.tran06 {transition: all ease-in-out 2.1s;-moz-transition: all ease-in-out 2.1s;-webkit-transition: all ease-in-out 2.1s;-ms-transition: all ease-in-out 2.1s;-o-transition: all ease-in-out 2.1s;}
.fromtopcol {opacity: 0;transform: translateY(-200px);z-index: 2;}
.frombackcol {opacity: 0;transform: translateY(150px);z-index: 2;}
.fromleftcol {opacity: 0;transform: translateX(-500px);z-index: 5;}
.fromrightcol {opacity: 0;transform: translateX(500px);z-index: 5;}
.animat {padding: 80px 0px 0px 0px;background-image: url(../images/promo.png);background-size: cover;overflow: hidden;}
.animitopnrml {opacity: 1;transform: translateY(0);}
.animibacknrml {opacity: 1;transform: translateY(0);}
.animileftnrml {opacity: 1;transform: translateX(0);}
.animirightnrml {opacity: 1;transform: translateX(0);}