#products {
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: #f4f7fd;
}

@media screen and(max-width:720px){
  #products{
  }
}
.categories,
.UseCase {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
  /* justify-content: center; */
  /* border: 1px solid #ccc; */
  color: black;
  width: 100%;
}
@media screen and (min-width:720px){
  .categories,
.UseCase{
  width:80% ;
}
}
.categories {
  flex-grow: 1;
}
.UseCase {
  flex-grow: 1;
}

/* -----Products Catagory----- */
.products_catagories {
  width: 100%;
  height: 100%;
  position: relative;
  margin: 1rem 0 1rem 0;
}
.Prdct_cata_heading {
  display: flex;
  align-items: center;
  justify-content: center;
}
.products_catagories h2 {
  display: inline;
  position: relative;
  font-weight: 600;
  font-size: 2.5rem;
  color: #1a2238;
}
.proCataDiv {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2rem;
}
.cata_all_log {
  width: 95%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: row wrap;
  flex-basis: auto;
}
.eightCata {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  /* background-color: aqua; */
  margin: 1rem;
}
.eightcata_one {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 7rem;
  height: 7rem;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.16);
  border-radius: 1.5rem;
  /* background-color: #01d1c3; */
  background-color: #ffffff;
}
.eightcata_one:hover {
  box-shadow: 0 0.125rem 0.125rem -0.125rem rgb(31 27 45 / 8%),
    0 0.25rem 0.75rem rgb(31 27 45 / 8%);
  background-color: #9cf6fb;
  transition: 0.3s ease;
  cursor: pointer;
  transition: 0.3s ease;
}
.cata_img {
  width: 60%;
  height: 60%;
}
.cata_img_heading {
  padding-top: 0.5rem;
  font-weight: 600;
  color: #1a2238;
}
.moreIdiv {
  width: 60%;
  height: 60%;
  display: flex;
  border-radius: 46px;
  justify-content: center;
  align-items: center;
  /* background-image: linear-gradient(135deg, #3C8CE7 10%, #00EAFF 100%); */
  text-align: center;
}
.moreIcon {
  position: relative;
  bottom: 10px;
  font-size: 60px;
  color: #00ddff;
}
@media screen and (max-width: 600) {
  .cata_all_log {
    width: 100%;
    padding: 10px;
  }
  .eightcata_one {
    width: 5rem !important;
    height: 5rem !important;
  }
  .cata_img_heading {
    padding-top: 0.7rem;
  }
}
@media only screen and (max-width: 600px) {
  .usecaseHeading h2 {
    font-size: 27px;
  }
}