/*---------------------------------------------------
Developed By: bdcoder
Developer URL: amitpaultl@gmail.com
Developer: Amit Paul

---------------------------------------------------

--------------------------------------------------
Table of Contents
--------------------------------------------------
1. Theme Color
2. font Style 
3. General Style 
4. Typography area 
5. Preloader Area 
6. button area
7. logo area start
8. banner area 
9. product-button
10. refreshment area
11. gallery area 
12. faq  area 
13. footer area

------------------------------------------------ */

/*--------------------------------
1 Theme Color
-----------------------------------*/
:root {
  --Background-Cream: #ffffff;
  --Green: #014011;
  --Black: #23312D;
  --Grey: #738C85;
  --Stroke: #DEEDF3;
  --white: #ffff;
  --Yellow: #F8F815;
  --body-font-family: "Open Sans", serif;
}


/*-----------------------------------------------
  2.  font Style Start
-------------------------------------------------*/

/* google font */




/*-----------------------------------------------
  2.  font Style end
-------------------------------------------------*/


/*-----------------------------------------------
  3. General Style Start
-------------------------------------------------*/
* {
  margin: 0;
  padding: 0;
  border: none;
  outline: none;
}

body,
html {
  height: 100%;
  margin: 0;
}

body {
  background: var(--Background-Cream) none repeat scroll;
  font-size: 16px;
  font-weight: normal;
  font-family: var(--body-font-family);
  color: var(--Grey);
  overflow-x: hidden;
  scroll-behavior: smooth;
  position: relative;
  z-index: 1;
}

ul {
  padding: 0;
  margin: 0;
}

li,
ol {
  /* list-style: none; */
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: var(--Grey);
}

a:hover {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

p {
  color: var(--Grey);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.176px;
  margin: 0;

}

@media (max-width: 991.98px) {
  .production-modal-dialog {
    width: 90% !important;
    max-width: 90% !important;
  }
}

@media (min-width: 992px) {
  .production-modal-dialog {
    width: 70% !important;
    max-width: 70% !important;
  }
}

.production-modal-dialog {
  margin-left: auto;
  margin-right: auto;
  height: 90%;
  max-height: 90%;
}

.modal-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #014011;
}

@media (max-width: 767.98px) {
  #productionModal .modal-content {
    height: 50vh !important;
    max-height: 50vh !important;
  }
}



/*-------------------------------------------
  4.Typography area start
-------------------------------------------*/

/* color text */

.color-green {
  color: var(--Green) !important;
}

.color-yellow {
  color: var(--Yellow);
}

.color-black {
  color: var(--Black);
}

.color-grey {
  color: var(--Grey);
}

.color-white {
  color: var(--white);
}

/* background color */
.bg-green {
  background: var(--Green);
}

.bg-origin {
  background: #FD8E3F;
}

.bg-blue {
  background: #277EFF;
}

/* font size  */

.bdf-fs-65 {
  font-size: 65px;
  font-weight: 800;
}

.bdf-fs-40 {
  font-size: 40px;
  font-weight: 800;
  line-height: normal;
}

.bdf-fs-24 {
  font-size: 24px;
  font-weight: 600;
  line-height: normal;
}

.bdf-fs-16 {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.176px;
}

.bdf-fs-14 {
  font-size: 14px;
  font-weight: 400;
}

.bdf-fs-12 {
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
}

/* font weight  */

.bdf-fw-300 {
  font-weight: 300;
}

.bdf-fw-400 {
  font-weight: 400;
}

.bdf-fw-500 {
  font-weight: 500;
}

.bdf-fw-600 {
  font-weight: 600;
}

.bdf-fw-700 {
  font-weight: 700;
}

.bdf-fw-800 {
  font-weight: 800;
}

.bdf-fw-900 {
  font-weight: 900;
}

/* font family*/
.montserrat-font {
  font-family: "Montserrat", serif;
}


/* margin area start */

.bdf-mb-50 {
  margin-bottom: 50px;
}

.bdf-mb-30 {
  margin-bottom: 30px;
}

.bdf-mt-30 {
  margin-top: 30px;
}

.bdf-mb-25 {
  margin-bottom: 25px;
}

.bdf-mb-10 {
  margin-bottom: 10px;
}

.bdf-mt-10 {
  margin-top: 10px;
}

.bdf-mb-20 {
  margin-bottom: 20px;
}



/* padding area start */

.section-pt-150 {
  padding-top: 150px;
}

.section-pb-150 {
  padding-bottom: 150px;
}

.section-pb-75 {
  padding-bottom: 75px;
}

.section-pt-75 {
  padding-top: 75px;
}

.section-pb-50 {
  padding-bottom: 50px;
}

.section-pt-50 {
  padding-top: 50px;
}

.bdf-pb-10 {
  padding-bottom: 10px;
}

.bdf-pt-30 {
  padding-top: 30px;
}

.bdf-pb-24 {
  padding-bottom: 24px;
}

.bdf-pb-20 {
  padding-bottom: 20px;
}

.bdf-pb-30 {
  padding-bottom: 30px;
}



/* border */

.bdf-border-top {
  border-top: 1px solid var(--Stroke);
}

/* border  radius*/

.bdf-border-radius {
  border-radius: 30px;
}

/* gab */

.bdf-gab-10 {
  gap: 10px;
}

.bdf-gab-16 {
  gap: 16px;
}

.bdf-gab-20 {
  gap: 20px;
}

.bdf-gab-30 {
  gap: 30px;
}

/* width */

/* hight */


/* cursor */

.bdf-pointer {
  cursor: pointer;
}

/* after none */




/*-------------------------------------------
  4.Typography area end
-------------------------------------------*/


/*-------------------------------------------
 5 Preloader Area Start
-------------------------------------------*/
#bdfPreloaderBg {
  position: fixed;
  top: 0;
  bottom: 0;
  background-color: var(--Background-Cream);
  z-index: 999999999999;
  width: 100%;
  height: 100%;
}

#bdfLoader {
  width: 300px;
  display: block;
  align-content: center;
  margin: 0 auto;
  height: 100%;
}

#bdfLoader img {
  width: 100%;
  height: auto;
}


/*-------------------------------------------
  5 Preloader Area End
-------------------------------------------*/


/*-------------------------------------------
  6.button area start
-------------------------------------------*/
.bdf-btn-theme {
  border-radius: 13px;
  border: 1px solid var(--Green);
  background: var(--white);
  padding: 15px 20px;
  color: var(--Green);
  transition: .3s;
  display: flex;
  justify-content: center;
  gap: 10px;
  font-size: 14px;
}

.bdf-btn-theme:hover {
  background: var(--Stroke);
  color: var(--Green);
}

.bdf-button-shape {
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  transition: .3s;
}

.bdf-btu-theme:hover .bdf-button-shape {
  bottom: -100%;
}

/*-------------------------------------------
  6.button area end
-------------------------------------------*/

/*-------------------------------------------
  6.menu area start
-------------------------------------------*/

.bdf-menu a {
  font-size: 20px;
  color: var(--Black) !important;
  display: inline-block;
}

.bdf-menu {
  margin: 0 9px;
  padding-bottom: 13px;
  position: relative;
}

.bdf-sub-menu {
  position: absolute;
  padding: 6px 20px;
  background: #ffffff;
  border-radius: 10px;
  left: 0;
  top: 45px;
  z-index: 111;
  width: 280px;
  box-shadow: -1px 9px 44px 0px rgb(247 247 247 / 95%);
  visibility: hidden;
  transition: .3s;
  opacity: 0;
}

.bdf-menu-list {
  padding: 8px 0;
}

.bdf-menu-list {
  width: 100%;
  transition: .3s;
}

.bdf-menu:hover .bdf-sub-menu {
  visibility: visible;
  transition: .3s;
  top: 35px;
  opacity: 1;
}

.navbar-nav .nav-link {
  position: relative;
  transition: color 0.2s;
  overflow: hidden;
}

.navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 2px;
  background: var(--Green) !important;
  transition: all 0.3s cubic-bezier(.4, 0, .2, 1);
  transform: translateX(-50%);
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: var(--Green) !important;
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
  width: 80%;
}

body {
  padding-top: 100px;
}

@media (max-width: 991.98px) {
  body {
    padding-top: 110px;
  }
}

/* mobile css  */

.sidebar-menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100vw;
  height: 100%;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  z-index: 1050;
  transition: transform 0.3s;
  transform: translateY(-100%);
  padding: 2rem 1.5rem 1.5rem 1.5rem;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.sidebar-menu.open {
  transform: translateY(0);
}

.sidebar-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1049;
}

.sidebar-overlay.active {
  display: block;
}

.close-sidebar {
  background: none;
  border: none;
  font-size: 2rem;
  position: absolute;
  top: 10px;
  right: 20px;
  color: #333;
  cursor: pointer;
}

.sidebar-links-container {
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
}

/* Mobile active style */
#navbarLinksSidebar .nav-link.active {
  background: #C4F2D4;
  border-radius: 8px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}

#navbarLinksSidebar .nav-link {
  color: #222;
  font-weight: 500;
  margin-bottom: 6px;
  transition: background 0.2s, color 0.2s;
}

#navbarLinksSidebar .nav-link:not(.active):hover {
  background: #e8f8f5;
  color: #C4F2D4;
}

@media (min-width: 992px) {

  .sidebar-menu,
  .sidebar-overlay,
  #sidebarToggle {
    display: none !important;
  }
}

@media (max-width: 991.98px) {
  .d-lg-flex {
    display: none !important;
  }
}

/*-------------------------------------------
  6.menu area end
-------------------------------------------*/

/*-------------------------------------------
  6.banner area start
-------------------------------------------*/

.bdf-hero-bg-area {
  position: relative;
  z-index: 1;
  padding: 200px 0;
  background-image: url('../images/bg-hero-1.png');
  background-position: -5.96px -5.13px;
  background-size: cover;
}

.bdf-bg-section {
  background-image: url('../images/bg-section.png');
  background-position: center;
  background-size: cover;
}

.color-bg-img {
  position: relative;
}

.banner-vector {
  position: absolute;
  top: -11px;
  left: 75px;
}

.banner-bg-bdf {
  padding: 0 0 150px 0;
}


.bdf-demo-box {
  border-radius: 20px;
  background: var(--white);
}

.bdf-demo-img {
  border-radius: 20px 20px 0px 0px;
}

.bdf-demo-content {
  padding: 20px;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.bdf-rating {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 176px;
}

.bdf-bg-color-count {
  background: var(--Green);
  border-radius: 30px;
  padding: 40px 0;
  background-image: url('../images/dots.png');
  background-position: center;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.bdf-demo-img {
  height: 334px;
}

@keyframes floatY {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-20px);
  }
}

@keyframes floatX {

  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(20px);
  }
}

@keyframes spin {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(360deg);
  }
}

.banner-shape {
  pointer-events: none;
  z-index: 1;
}

.bdf-banner-area {
  z-index: 2;
}

.banner-bg-bdf {
  position: relative;
  z-index: 2;
}


/*-------------------------------------------
  6.banner area end
-------------------------------------------*/

/*-------------------------------------------
  6.Crafted  area start
-------------------------------------------*/
.bg-admin-thumbnail {
  width: 100%;
  border-radius: 20px;
}

.bdf-text-assisted {
  border-radius: 30px;
  background: var(--Green);
  padding: 5px 15px;
  color: var(--white);
  text-align: center;
  display: inline-block;
}

.bdf-bg-admin {
  border-radius: 20px;
  box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.15);
  padding: 30px;
  background-image: url('../images/bg-section-1.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  overflow: hidden;
}

.section-bg-2-bdf {
  background-image: url('../images/bg-section-1.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  overflow: hidden;
}


.bdf-title-text {
  text-align: center;
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 600;
}

.bdf-bg-color-green {
  border-radius: 30px;
  background: var(--Green);
  padding: 5px 10px;
  color: var(--white);
}

.crafted-content-bdf {
  text-align: center;
}

.bdf-crafted-icon {
  width: 88px;
  height: 88px;
  padding: 20px;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
  background: var(--white);
  margin-top: -50px;
  margin-bottom: 10px;
}

.bdf-crafted-icon img {
  width: 41px;
  height: 42px;
  object-fit: cover;
}

.bdf-crafted-box {
  position: relative;
  z-index: 1;
  overflow: hidden;
  height: 442px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.crafted-retort-box-bdf {
  position: absolute;
  width: 320px;
  overflow: hidden;
  height: 320px;
  border-radius: 30px;
  background-position: center;
  background-size: cover;
  z-index: -1;
  transform: rotate(45deg);
  left: 60px;
  top: 58px;
  background-color: var(--white);
  opacity: 40%;
}

.crafted-bdf-border {
  text-align: left;
  padding-left: 10px;
  width: 48%;
  border-left: 2px solid var(--Stroke);
}

.bdf-crafted-text-area {
  display: flex;
  width: 350px;
  margin: auto;
}

.bdf-crafted-title {
  width: 48%;
  text-align: left;
  font-size: 24px;
  color: var(--Black);
}

.bdf-mt-170 {
  margin-top: -170px;
}

.retort-1-img {
  transform: rotate(315deg);
  position: absolute;
  top: -27px;
  left: -108px;
  width: 100%;
}

img.retort-2-img {
  transform: rotate(315deg);
  position: absolute;
  bottom: -35px;
  right: -103px;
  width: 100%;
}

.bdf-start-1 {
  top: 10px;
  left: 96px;
}

.bdf-start-2 {
  top: 120px;
  left: 10px;
}

.bdf-start-3 {
  top: 244px;
  left: 10px;
}


.bdf-start-4 {
  top: -32px;
  right: 223px;
}

.bdf-start-5 {
  top: 120px;
  right: 146px;
}

.bdf-start-6 {
  top: 250px;
  right: 268px;
}


.star-container {
  position: absolute;
  width: 100%;
  top: 36%;
  left: 3%;
  z-index: -1;
}

.star,
.star-1 {
  width: 40px;
  height: 40px;
  position: absolute;
  transition: transform 1.5s ease;
  z-index: -1;
}

.hidden {
  transform: scale(0);
}

/*-------------------------------------------
  6.Crafted  area end
-------------------------------------------*/

/*-------------------------------------------
  6.infinity  area start
-------------------------------------------*/

.bdf-bg-infinity {
  background: #23312D;
  background-image: url('../images/illustration-bg.png');
  background-position: center;
  background-size: cover;
}

.bdf-slider-infinity-box {
  border-radius: 30px;
  background: #273733;
  box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.15);
  padding: 30px 20px;
  margin-bottom: 24px;
}

.bdf-slider-img img {
  width: 100%;
}

.w-title-bdf {
  width: 650px;
  margin: auto;
}


.bdf-img-slider .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
  position: relative;
  pointer-events: none;
}

.bdf-img-slider .swiper-wrapper .swiper-slide {
  width: -webkit-max-content !important;
  width: -moz-max-content !important;
  width: max-content !important;
}

.bdf-img-slider .item {
  position: relative;
  overflow: hidden;
  width: 450px;

}

.bdf-img-slider .item img {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: top;
  object-position: top;
  box-shadow: 0 0 30px rgba(0, 0, 0, .08);
  border-radius: 20px;
}

.section-inner-area {
  padding: 130px 0;
  overflow: hidden;
}

.shadow-top-bdf {
  height: 231px;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.00) 0%, #FFF 43.58%);
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 11;
  top: -125px;
}

.shadow-bottom-bdf {
  height: 231px;
  background: linear-gradient(179deg, rgba(255, 255, 255, 0.00) 0%, #FFF 43.58%);
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 11;
  bottom: -125px;
}

.bg-wrapper-bg {
  border-radius: 30px;
  background: var(--Green);
  padding: 64px 30px;
  position: relative;
  z-index: 1;
}

.bdf-btn-status {
  border-radius: 5px;
  padding: 3px 10px;
  font-size: 12px;
  color: var(--white);
}

.d3-icon {
  position: absolute;
  right: 15px;
  bottom: -26px;
  animation: orbit 5s linear infinite;
}

@keyframes orbit {
  0% {
    right: 0px;
    bottom: 0px;
  }

  25% {
    right: 25px;
    bottom: 0px;
  }

  50% {
    right: 25px;
    bottom: 25px;
  }

  75% {
    right: 0px;
    bottom: 25px;
  }

  100% {
    right: 0px;
    bottom: 0px;
  }
}

/*-------------------------------------------
  6.infinity  area end
-------------------------------------------*/

/*-------------------------------------------
  6.Customers page area start 
-------------------------------------------*/

.map-section-area {
  background: var(--Black);
  padding: 60px 0;
  margin-top: 130px;
}

/* .bdf-text-wrapper {
  max-width: 640px;
  width: 100%;
  margin: auto;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -320px;
}

@media (max-width: 767.98px) {
  .bdf-text-wrapper {
    height: -webkit-fill-available;
    max-width: 90vw;
    margin-left: calc(-45vw);
    padding: 20px;
    ;
  }
} */



/*-------------------------------------------
  6.Customers page area   end
-------------------------------------------*/

/*-------------------------------------------
  6.comment page area   start
-------------------------------------------*/

.single-comment-box {
  border-radius: 30px;
  background: var(--white);
  box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.07);
  padding: 30px;
}

.comment-bg {
  background-image: url('../images/comment-bg.png');
  background-position: center;
  background-size: cover;
  padding: 20px 0;
  border-radius: 30px;
  text-align: center;
  margin-bottom: 30px;
}

.comment-bg img {
  width: 140px;
  height: 140px;
  border-radius: 50%;
}

.bdf-comment-area {
  margin-top: -15px;
}

/*-------------------------------------------
  6.comment page area   end
-------------------------------------------*/

/*-------------------------------------------
  6.footer page area   start
-------------------------------------------*/

.footer-area-start {
  background-image: url('../images/footer-shade.png');
  background-position: center;
  background-size: cover;
  padding: 90px 0 50px 0;
}

.theme-btn-footer {
  border-radius: 13px;
  border: 1px solid var(--Green);
  background: var(--Green);
  color: var(--white);
  padding: 15px 20px;
  display: inline-block;
}

/*-------------------------------------------
  6.footer page area   end
-------------------------------------------*/