.mainCatalogDiv{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.catalogNav{
  width: 90%;
  display: flex;
  align-items: center;
}

.catalogNav .searchBarContainer{
  width: 100%;
  margin-right: 1rem;
}

.searchBarContainer input[type="text"]{
  width: 100%;
}

.productsContainer{
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  
  align-items: center;
}

.product{
  display: flex;
  width: 90%;
  border: 2px solid black;
  margin: 1rem;
}

.product .prodImg{
  width: 100%;
  max-width: 50rem;
  max-height: 50rem;
  align-self: center;
}

.product .prodImg img{
  width: 100%;
  max-height: 50rem;
  align-self: center;
}

.product .productPrice .price {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.price hr{
  width: 100%;
}

.product section{
  display: flex;
  flex-direction: column;
}



@media screen and (max-width: 800px){
  .catalogNav{
    flex-direction: column;
  }

  .catalogNav form{
    align-items: center;
  }

  .searchBarContainer input[type="text"]{
    width: 100%;
    height: 100%;
    font-size: 2rem;
  }

  .searchBarContainer button{
    height: 100%;
    padding: 1rem;
    border-top-right-radius: 7.5px;
    border-bottom-right-radius: 7.5px;
  }

  .product .ProductDetails{
    margin-left: 1rem;
  }

  
  
  .Btn{
    border: 2px solid black;
  }
}