/* Typography */
body {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* Navbar styling */
/* .navbar {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));

} */

.navbar-home {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
}

.navbar-default {
  background: #000; /* or any solid color */
  margin-bottom: 30px;
}

.navbar .active {
  font-weight: 800;
  color: white !important;
}
.border-primary{
    border-color: #c8102e !important;
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link.show {
  color: white;
  /* Bootstrap primary color */
}

.top-strip {
  height: 35px;
  /* or whatever fits */
  line-height: 1.2;
  z-index: 1045;
  /* below navbar (Bootstrap navbar z-index = 1045) */
}

.navbar {
  top: 35px;
  /* offset by the height of top-strip */
}

.bg-primary,
.btn-primary {
  background: #c8102e !important;
}

.btn {
  width: 100%;
}

.btn-inline {
  width: fit-content;
}

.navbar.scrolled {
  background: rgba(0, 0, 0, 0.85);
  backdrop-filter: blur(6px);
}

/* Hero section */
.hero-slider {
  height: 110vh;
}

.hero-slider .carousel-item {
  height: 110vh;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

@media screen and (max-width: 768px) {

  .top-strip .location {
    display: none;
  }
  .top-strip{
    justify-content: center;
  }
  .navbar {
    background: black;

  }

  .hero-slider {
    margin-top: 128px;
    height: 278px;
  }

  .hero-slider .carousel-item {
    /* margin-top: 70px; */
    /* height: 200px; */
    background-size: contain;

  }
}

.carousel-caption {
  bottom: 50%;
  transform: translateY(50%);
}

/* Product cards */
.product-card img {
  height: 400px;
  transition: all 0.3s ease;
  object-fit: contain;
}

.product-card {
  transition: all 0.3s ease;
  border: none;
}

  .product-card:hover > img {
    transform: translateY(-5px);
    /* box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05); */
  }

/* Red Section */
.red-section {
  background-color: #c8102e;
  color: #fff;
}

.red-section img {
  max-width: 100%;
  border-radius: 10px;
}

/* Footer */
footer {
  background-color: #111;
  color: #ccc;
  padding: 40px 0;
}

footer li {
  padding-bottom: 15px;
}
footer a {
  color: #ccc;
  text-decoration: none;
}

footer a:hover {
  color: #fff;
}
