.home-container {
  width: auto;
  height: auto;
  display: flex;
  min-height: 20vh;
  align-items: center;
  flex-direction: column;
}

.home-title{
  margin-top: 3%;
  color: black;
}

.overview-container {
  width: auto;
  height: auto;
  display: flex;
  min-height: 20vh;
  align-items: center;
  flex-direction: column;
}

.overview-hero {
  /* top: -20%; */
  width: 100%;
  /* max-width: 100%; */
  /* overflow: hidden; */
  display: flex;
  overflow: hidden;
  padding-bottom: 4vh;
  flex-direction: row;
  justify-content: space-between;
  background-color: white;
  max-width: var(--dl-size-size-maxcontent);

  /* align-items: center; */

  /* background-image: linear-gradient(100.8deg, rgba(255, 76, 92, 0.8) 50%, rgba(100, 100, 70, 0.8) 10.47%),url("public/playground_assets/grass_layers-1500h.jpg"); */
}



.overview-image-container {
  width: 100%;
  height: 50vh;
  padding-top: 10%;
  display: flex;
  flex-direction: column;
  gap: 10%;
  align-items: center;
  cursor: pointer;
  z-index: 40;
  transition: all 1s ease-in-out;


}
/* 
.overview-image-container:hover {
  transform: scale(1.1);
} */


.overview-content{
  /* position: absolute; */
  display: flex;
  flex-direction: row;
  z-index: -2;
  text-align: center;
  justify-content: center;
  align-items: center;
  opacity: 0;
  margin: auto;
  transition: 1s ease-in-out;
}

.overview-text{
  color: black;
  width: 40%;
  height: 60%;
}

.overview-content img{
  width: 50%;
}

.overview-image-container:hover {
  transform: translateY(-20%);
}

.overview-image-container:hover .overview-content{
  opacity: 1;
  /* transform: translateY(-200px); */
}

.overview-text h2 {
  z-index: -4;
}

.overview-image-container .overview-image {
  /* width: 70%; */
  height: 40%;
}

.overview-hero-text{
  position: absolute;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  align-content: center;
  width: 100%;
  z-index: 5;
  top: 50%;

}

/* .opposite-fade-image-container{
  position:absolute;
  padding-top: 2%;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  max-width: var(--dl-size-size-maxcontent);
}
 */

.fade-image{

  z-index: 4;
  width: 18vw; 

  opacity: 0;
  transform: translateY(40%);
  transition: 1s ease-in-out;

}



.fade-slideshow{
  width: 18vw;
  position: relative;

  /* z-index: 100; */
  /* left: 15%; */
  /* display: flex;
  flex-direction: row;
  position: relative;
  justify-content: flex-start;
  align-items: center; */
  /* position: static; */
  /* overflow-x: hidden; */
  transition: 1s ease-in-out;

  opacity: 0;
}

.overview-hero-title{
  font-size: 3rem;
  font-weight: 400;
  color: white;


}
/* .image-container{
  width: 120%;
  height: 100%;
  margin-left: -10%;
  margin-right: -10%;
} */

/* .overview-image:first-child {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}

.overview-image:last-child {
  clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);
}

.middle{
  clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  z-index: 2;
} */





.re-dresser-product-blog {
  width: 100%;
  display: flex;
  padding: 48px;
  max-width: var(--dl-size-size-maxcontent);
  /* max-width: 1400px; */
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
  background-color: var(--green-opaque);

}
.re-dresser-product-container1 {
  display: flex;
  align-items: center;
  margin-bottom: 32px;
  flex-direction: column;
  justify-content: space-between;
}



.product-card-left-blog-post-card {
  width: 100%;
  display: flex;
  max-width: var(--dl-size-size-maxcontent);
  padding: 2.5%;
  flex-direction: row;
  justify-content: center;
}

.product-image{
  animation-delay: 0ms;
  opacity: 0;
  width: 48%;
  object-fit: contain;
}

.fadein {
	animation-name: fadein;
	animation-fill-mode: both;
	animation-duration: 1s;
	animation-timing-function: ease-in-out;
}

@keyframes fadein {
	0% {
		opacity: 0;
		transform: translateY(50%);
	}
	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}


.product-card-left-container {
  flex: 1;
  display: flex;
  position: relative;
  align-items: flex-start;
  padding-left: 10%;
  padding-top: 32px;
  padding-right: 32px;
  flex-direction: column;
  padding-bottom: 32px;
  justify-content: center;
}
.product-card-left-header {
  /* align-self: center; */
  text-align: center;
  margin-bottom: 48px;
  /* color: var(--engbakken-color) */
}
.product-card-left-container1 {
  display: flex;
  align-items: flex-start;
  margin-bottom: 48px;
  flex-direction: column;
  justify-content: flex-start;
}
.product-card-left-text {
  color: var(--dl-color-gray-black);
  align-self: center;
  margin-bottom: var(--dl-space-space-doubleunit);
}

.product-card-left-text h4{
  display: inline-block;
}





.product-card-right-blog-post-card {
  width: 100%;
  display: flex;
  max-width: var(--dl-size-size-maxcontent);
  flex-direction: row;
  padding: 2.5%;
  justify-content: center;
}
.product-card-right-container {
  flex: 1;
  display: flex;
  align-items: flex-start;
  padding-top: 32px;
  padding-left: 32px;
  padding-right: 10%;
  flex-direction: column;
  padding-bottom: 32px;
  justify-content: center;
}
.product-card-right-text {
  align-self: center;
  margin-bottom: 24px;
}
.product-card-right-container1 {
  display: flex;
  align-items: flex-start;
  margin-bottom: 48px;
  flex-direction: column;
  justify-content: flex-start;
}
.product-card-right-text1 {
  color: var(--dl-color-gray-black);
  align-self: left;
  text-align: left;
  margin-bottom: var(--dl-space-space-halfunit);
}


.layers-mdi svg path {
  fill: rgb(113, 73, 33);
}

.grass-mdi svg path {
  fill: rgb(22, 166, 46);
}

.water-drop-mdi svg path {
  fill: rgb(22, 77, 166);
}

.sprout-mdi svg path {
  fill: rgb(22, 166, 46);
}

.recycle-mdi svg path {
  fill: rgb(14, 124, 32);
}


@media(max-width: 991px) {
  .product-image {
    width: 50%;
  }
}
@media(max-width: 767px) {
  .product-card-left-blog-post-card {
    flex-direction: column;
    justify-content: space-between;
  }
  .product-image {
    width: 100%;
  }
  .product-card-left-container {
    width: 100%;
    padding: 32px;
  }
  .product-card-left-text {
    margin-bottom: 32px;
  }
  .product-card-left-container1 {
    margin-bottom: 32px;
  }
}