/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */
 /* #header{ background: red !important; } */
 body {
    background-color: #FAF8F4;
 }
 .header {
    --header-bg: rgb(255, 255, 255, 0.7);
    --header-top-bg:rgb(243, 237, 226, 0.6);
    
    
 }
.header-top {
  --header-top-border-bottom: 0px;
  --header-bottom-border-bottom: 0px;
}

.header-bottom {
  --header-top-border-bottom: 0px;
  --header-bottom-border-bottom: 0px;
}

 .footer {
    --footer-background-color: #8E7352;
 }

.card {
    background-color: #ffffff;
}

.product-miniature .product-miniature__image-container {
background-color: #ffffff;
}

.header a:not(.dropdown-item):not(.btn) {
  color: #2B2B2B;
}
.header a:not(.dropdown-item):not(.btn):hover,
.header a:not(.dropdown-item):not(.btn):hover i {
  color: #A68A64;
}
.carousel .carousel-caption {
  bottom: inherit;
  max-width: 1500px;
  text-align: left;
  top: 50%;
  transform: translateY(-50%);
}
.ratio-homeSlider {
  min-height: 500px;
  /*--bs-aspect-ratio: 42.85714%;*/
  --bs-aspect-ratio: 75%;
}
.carousel .carousel-caption .h2, .carousel .carousel-caption h2 {
  font-size: 2rem;
}
.carousel .carousel-caption .caption-description .h3, .carousel .carousel-caption .caption-description h3 {
  font-size: 1.5rem;
}
.carousel .carousel-caption .caption-description p {
  font-size: 1rem;
}
@media (min-width: 768px) {
  .ratio-homeSlider {
    /*--bs-aspect-ratio: 23.33333%;*/
    --bs-aspect-ratio: 60%;
  }
  .carousel .carousel-caption .h2, .carousel .carousel-caption h2 {
  font-size: 3em;
  }
  .carousel .carousel-caption .caption-description .h3, .carousel .carousel-caption .caption-description h3 {
    font-size: 2rem;
  }
  .carousel .carousel-caption .caption-description p {
    font-size: 1rem;
  }
}
@media (min-width: 960px) {
  .ratio-homeSlider {
    /*--bs-aspect-ratio: 23.33333%;*/
    --bs-aspect-ratio: 50%;
  }
  .carousel .carousel-caption .h2, .carousel .carousel-caption h2 {
    font-size: 4rem;
  }
  .carousel .carousel-caption .caption-description .h3, .carousel .carousel-caption .caption-description h3 {
    font-size: 3rem;
  }
  .carousel .carousel-caption .caption-description p {
    font-size: 2rem;
  }
}
.carousel-caption {
  color: #ffffff;
}
.carousel .carousel-control-prev {
  left: 1rem;
}
.carousel .carousel-control-next {
  right: 1rem;
}


.carousel .carousel-caption .caption-description {
  max-width: 60rem;
}

.ratio {
  position: relative;
  width: 100%;
}
.ratio:before {
  content: "";
  display: block;
  padding-top: var(--bs-aspect-ratio);
}
.ratio > * {
  height: 100%;
  left: 0;
  position: absolute;
  top: -130px;
  width: 100%;
}