@media only screen and (min-width: 320px) and (max-width: 550px) {
  .hero__slider {
    margin-top: 3rem;
  }
  .hero__slider .text-items h3 {
    font-size: 25px;
  }
  .hero__slider .text-items a {
    padding: 7px 0;
    margin-top: 0.5rem;
  }
  .card__sec .card__box {
    height: auto;
  }
  header ul {
    justify-content: center;
  }
  header .contact_link ul {
      justify-content: center;
  }
  header .contact_link ul li a {
    font-size: 13px;
  }
  .hero__sec img {
    height: 180px;
  }
  .hero__sec .owl-carousel img {
    width: auto;
  }
  .hero__sec .bg__color {
    height: 35%;
    width: 100%;
    top: 65%;
  }
  .products__top__sec {
    height: 250px;
  }
  .products__top__sec h3 {
    font-size: 22px;
  }
  .pro__sec .product_block h3 {
    margin-top: 1rem;
  }
  .contact_sec .contact_wrapper {
    padding: 20px;
  }
  .top__head h3 {
    font-size: 30px;
  }
  .contact_wrapper> .row{
    flex-direction: column-reverse;
  }
}