/* ************* Global Styles for porte-forte-grid-bootstrap ************* */
.porte-forte-grid-bootstrap {
  width: 100%;
  /* height: auto; */
  min-height: 22rem; /* Default minimum height */
  border: 2px #d2d2d2 solid;
  padding: 0.625rem;
  margin-bottom: 2rem;
  overflow: hidden;
  text-align: center;
  transition: box-shadow 400ms ease-out;
}

.view .active {
border-color:/*#be273b*/var(--color-text-primary-medium);
}

/* General styling for images inside porte-forte-grid-bootstrap */
.porte-forte-grid-bootstrap img {
  display: block;
  max-height: 190px;
  width: auto;
  margin: auto;
}

/* Headings styling for porte-forte-grid-bootstrap */
.porte-forte-grid-bootstrap h3 {
  margin-block: 1.4rem;
  line-height: 1.2;
  font-size: 1.1rem;
}
.porte-forte-grid-bootstrap a{
	font-size:0.9rem;
}

/* Paragraph styling */
.porte-forte-grid-bootstrap p {
  margin: 0.1rem;
  line-height: 1.2rem;
}

/* Anchor styling */
.porte-forte-grid-bootstrap a {
  text-decoration: none;
  color: black;
  width: 100%;
  height: 100%;
}

/* Hover effect for porte-forte-grid-bootstrap */
.porte-forte-grid-bootstrap:hover {
  z-index: 10;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  border-color: transparent;
}

/* ************* Media Queries ************* */

/* Styling for screens smaller than 600px */
@media only screen and (max-width: 600px) {
  .porte-forte-grid-bootstrap {
    min-height: 15rem;
    border: 0px #d2d2d2 solid;
    border-bottom: 2px #d2d2d2 solid;
    padding: 0 10px;
    margin-right: 0;
    margin-bottom: 10px;
    overflow: hidden;
    float: left;
    -webkit-border-radius: 5px;
    border-radius: 5px;
  }

  .porte-forte-grid-bootstrap img {
    height: auto;
    width: auto;
    margin: auto;
  }

  .porte-forte-grid-bootstrap h3, 
  .porte-forte-grid-bootstrap div, 
  .porte-forte-grid-bootstrap {
    text-align: center;
  }

  .porte-forte-grid-bootstrap:hover {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  }
}

/* Styling for screens between 601px and 993px */
@media only screen and (min-width: 601px) and (max-width: 993px) {
  .porte-forte-grid-bootstrap {
    min-height: 18rem;
  }

  .porte-forte-grid-bootstrap:hover {
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
  }
}

/* Styling for screens between 993px and 1326px */
@media only screen and (min-width: 993px) and (max-width: 1326px) {
  .porte-forte-grid-bootstrap {
    min-height: 26rem;
  }
}

/* Styling for screens between 1327px and 1451px */
@media only screen and (min-width: 1327px) and (max-width: 1451px) {
  .porte-forte-grid-bootstrap {
    min-height: 25rem;
  }
}

/* Styling for screens larger than 1423px */
@media only screen and (min-width: 1423px) {
  .porte-forte-grid-bootstrap {
    min-height: 22rem;
  }

  .porte-forte-grid-bootstrap:hover {
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.2);
  }
}