@import url('https://fonts.googleapis.com/css2?family=Baskervville:ital,wght@0,400..700;1,400..700&family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Oswald", sans-serif;
}

body,
p,
span,
a {
  font-family: "Inter", sans-serif;
  text-decoration: none;
}

.space {
  padding: 45px 0px;
}

:root {
  --ap-black: #000;
  --ap-Charcoal-black: #212529;
  --ap-red: #ed3237;
  --ap-grey: #e9ecef;
  --ap-white: #fff;
}


@media (min-width:992px) {
  .dropdown:hover .dropdown-menu {
    display: block;
  }

}

/* product start */
/* Responsive layout voor kleinere schermen */

@media only screen and (max-width: 1200px) {
  /* .container {
      margin-top: 3rem;
      justify-content: left;
      gap: 1.5rem;
    } */
}

@media only screen and (max-width: 768px) {
  h1 {
    font-size: 1.5rem;
  }

}

@media only screen and (max-width: 480px) {
  h1 {
    font-size: 1.2rem;
  }

  h3 {
    font-size: 1rem;
  }

  .flip-card {
    transform: translateX(-100%);
  }
}

/* product end */

@media only screen and (max-width: 600px) {
  .logo-main {
    width: 44px;
  }

  .border {
    display: none;
  }

  .flip-card-container {
    height: 170px;
    margin: 10px 0px;
  }

  .product-title h2 {
    font-size: 17px;
  }

  .banner-slider .item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .banner-slider .item {
    height: 20vh;
    position: relative;
  }

  .c1 {
    height: 180px;
  }

  .c2 {
    height: 180px;
    border-radius: 0px;
  }

  .c3 {
    height: 180px;
    border-radius: 0px;
  }

  .c4 {
    height: 180px;
  }

  .c5 {
    height: 180px;
  }

  .c6 {
    height: 180px;
    border-radius: 0px;
  }

  .counter {
    padding: 20px 0px;
  }

  .add-img img {
    margin-top: -100px;
    height: 260px;
    width: 260px;
    object-fit: cover;
  }

  .tagline h2 {
    font-size: 24px;
  }

  .add-bg {
    height: 390px;
  }

  .abt-img img {
    margin: 20px 0px;
  }

  .space {
    padding: 30px 0px;
  }
  .dropdown-item {
    font-size: 13px;
}
.nav-link {
  font-size: 13px;
}

  .product-detail-page::before {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 35%;
    height: 100%;
    background-color: #ed32381e;
    content: "";
    z-index: -1;
  }

  .feature-card {
    height: 200px;
    margin: 10px 0px;
  }

  .product-detail-page::after {
    display: none;
  }
  .contact-bg {
    margin-top: 20px!important;
}
.product-title a h2 {
  font-size: 13px;
}
.social-icon {
  display: flex;
  margin: 10px 0px;
}
.product-heading {
  margin-left: 0px;
  margin-top: 30px;
  margin-bottom: 30px;
}
.product-details {
  margin-left: 0px;
}
.product-service-card {
  padding: 5px;
  height: 627px;
  margin: 10px 0px;
}
.product-detail-page {
  padding: 45px 0px;
}
.inner-part {
  height: 0px;
}
}

@media screen and (min-width: 625px) and (max-width: 768px) {
  .banner-slider .item {
    height: 59vh;
    position: relative;
  }

  .top-nav .top-nav-sp1 {
    color: #fff;
    padding: 2px 0px;
    font-size: 15px;
  }

  .flip-card-container {
    height: 217px;
  }

  .product-title h2 {
    font-size: 18px;
  }

  .special-title {
    color: var(--ap-white);
    font-size: 15px;
  }

  .counter-card h5 {
    font-size: 21px;
  }

  .add-img img {
    margin-top: -100px;
    height: 300px;
    width: 300px;
    object-fit: cover;
  }

  .tagline h2 {
    font-size: 25px;
  }

  .tagline {
    padding-top: 35px;
    padding-right: 50px;
  }

  .product-detail-page::after {
    display: block;
    width: 14%;
    height: 262px;
  }
  .feature-card {
    height: 200px;
}
.contact-bg {
  margin-top: 20px!important;
}

}

@media (max-width: 768px) {

  .gallery-item:nth-child(1),
  .gallery-item:nth-child(3) {
    width: 100%;
    height: 100%;
    margin: 10px 0px!important;
  }
  .gallery-item img {
    margin: 15px 0px;
}

  .gallery-item:nth-child(2) {
    width: 200px;
    height: 200px;
  }

  .gallery {
    gap: 10px;
    padding: 30px 10px 40px;
  }
}