:root {
  --mainGreen: #429f2a;
  --mainBlue: #004393;
}

body {
  font-family: "Courier New", Courier, monospace;
}

.orizzontale {
  display: flex;
  flex-direction: column;
}

.verticale {
  display: none;
}

.product-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  padding: 5px;
}

.descrizione-pompe {
  padding: 10px;
}

.product {
  width: 300px;
  margin: 10px;
  text-align: center;
}

.product img {
  width: 100%;
  size: 200px;
  height: auto;
}

.product-name {
  margin-top: 10px;
}

.descrizione-prodotto {
  text-align: justify;
}

.divisione-pompe {
  display: block;
}
.divisione-pompe h2 {
  text-align: center;
}

.item {
  font-size: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: auto;
}

h4 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.container-catalogo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.container-catalogo a {
  color: black;
  text-decoration: none;
}

.container-catalogo a:hover {
  color: var(--mainBlue);
  text-decoration: none;
}

.descrizione-homepage {
  border: 5px solid #429f2a;
  border-radius: 25px;
  padding: 50px;
  margin: 20px 20px 20px 20px;
  background-color: #cfd8dc;
  width: 50vw;
  line-height: 40px;
}

.HP-Video {
  margin-top: 10px;
  margin-bottom: 50px;
}

video {
  border: 5px solid var(--lightBlue);
  border-radius: 25px;
}

@media screen and (max-width: 1500px) {
  .descrizione-homepage {
    margin: 50px 10px 50px 10px;
    background-color: #cfd8dc;
    width: 95vw;
    line-height: 30px;
  }
}

@media screen and (max-width: 1024px) {
  video {
    width: 95%;
  }

  .orizzontale {
    display: flex;
    flex-direction: column;
  }

  .verticale {
    display: none;
  }
}

@media all and (display-mode: fullscreen) {
  video {
    border: none;
  }
}

@media screen and (max-width: 768px) {
  .product {
    width: 150px;
  }
  body {
    overflow-x: hidden;
  }
  .orizzontale {
    display: none;
  }
  .verticale {
    display: flex;
    flex-direction: column;
  }
}