body{
  margin:0;
  width: 100%;
 overflow-x: hidden;
}
section {
    display: block;
    unicode-bidi: isolate;
}


.hover-icons:hover{
  color: white;
  background-color: #333333;
  text-decoration: none;
  border-radius: 10px;
}

.hero__background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left;
}

img, svg {
    vertical-align: middle;
}
.hero {
    position: relative;
}

.hero__foreground {
    position: relative;
    z-index: 2;
    padding-top: 5vw;
    color: white;
}

 ::after, ::before {
    box-sizing: border-box;
}

.hero__foreground .container {
    position: relative;
    z-index: 2;
}

.hero__foreground::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #800101 35vw);
}

#logo-hero-background{
  filter: blur(1px) grayscale(70%);

}

.lead {
    font-size: 1.25rem;
    font-weight: 300;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

.pb-5 {
    padding-bottom: 3rem !important;
}

.pt-5 {
    padding-top: 3rem !important;
}
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, .75rem);
    padding-left: var(--bs-gutter-x, .75rem);
    margin-right: auto;
    margin-left: auto;
}
div {
    display: block;
    unicode-bidi: isolate;
}

*, ::after, ::before {
    box-sizing: border-box;
}

.logo-text{
font-size: 16px;
}

#service-logos{
  text-align: center;
}

#blurb-row{
  background-color: #800101;
}
#blurb-row2{
  background-color:#800101;

}

.h4-weight{
  font-weight: 700;

}

#contact-row{
  text-align: center;
}

#contact-row > div:nth-child(3) > img{
  margin-top: 25px;
}

.infra-bg{
  background-color: #CC7833;

}



@media screen and (max-width: 500px) {
  #blurb-row{
    display: none;
  }
  #blurb-row2{
    padding: 20px;
  }

#contact-row > div:nth-child(2) > img{
  margin-top: 25px;
}

#contact-row > div:nth-child(3) > img{
  margin-top: 25px;
}

html, body{
  margin:0;
  width: 100%;
 overflow-x: hidden;
}

}

@media (min-width: 505px) and (max-width: 750px){

html, body{
  margin:0;
  width: 100%;
 overflow-x: hidden;
}

}

@media (min-width: 768px) and (max-width: 1050px) {

html, body{
  margin:0;
  width: 100%;
 overflow-x: hidden;
}

}

@media only screen and (orientation: landscape) {

  #contact-row > div:nth-child(3) {
   text-align: center;
}

#blurb-row2{
  padding: 20px;

}





}