.maincontent {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    border: none;
}


.hero img {
  width: 100%;
}
.hero{
  display:grid;
  background-color:#363E44;
background-blend-mode:multiply;
}
.heroBox{
  height:75vh;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  display:grid;
  place-content: center;
}

.heroBox h1{
  font-family: "Poppins", system-ui;
  font-size:clamp(28px, 3.5vw, 48px);
  color:#fff;
}
#heroBox1{
  visibility:hidden;
  text-align: center;
}
hr{
  visibility:hidden;
  text-align: center;
  width:0;
}
#heroBox1 h1{
  font-weight:400;
  letter-spacing: .6rem;
  text-transform: uppercase;
  color:#fff;
}
#heroBox1 h2{
  font-family: "Poppins", system-ui;
  font-size:clamp(22px, 2vw, 38px);
  visibility:hidden;
  font-weight:200;
  font-style: italic;
  color:#FFFFFF;
  transform:translateY(100%);
}

#heroBox1{
  background-image: 
  linear-gradient(rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.8) 100%),
  url('/imageserver/UserMedia/southcountyexteriors/hero.jpg');
  grid-column: 1/2;
  grid-row: 1/2;
}

#heroBox1Img{
  max-width:400px;
  transform:translateY(200px) scale(.5) ;
}

#heroBox2{
  visibility:hidden;
  grid-column: 1/2;
  grid-row: 1/2;
  text-align:center;
}
#heroBox2 h1{
  color:#fff;
  text-transform: uppercase;
  font-weight:400;
  letter-spacing: .6rem;
}
#heroBox2Img{
  max-width:200px;
  text-align: center;
  margin:0 auto;
}
#heroBox3{
  background-image: url('/imageserver/UserMedia/southcountyexteriors/hero.jpg');
  background-position: top;
  visibility:hidden;
  grid-column: 1/2;
  grid-row: 1/2;
  text-align: center;
}
#heroBox3 h1{
  font-family: "Poppins", system-ui;
  color:#fff;
}
#gaf{
  font-style:normal;
  font-weight:800;
  color:#E71A23;
}
@media screen and (max-width:500px) {
  .heroBox{
    height:75vh;
  }
}