body.container {

  padding-top: 20px;

}



header {

  margin-bottom: 20px;

}



.home-pros-logo,

.naf-logo {

  height: 64px;

}



.house-listing {

  height: 130px;

  background-color: rgb(0, 105, 147);

  margin-bottom: 15px;

}



.house-listing .title-h {

  font-size: 2rem;

  color: white;

  font-weight: 600;

  z-index: 1;

  padding-top: 28px;

  padding-left: 25px;

  text-transform: capitalize;

}



.listing-price,

.address {

  background-color: white;

  height: 32px;

  position: relative;

  font-weight: 500;

  line-height: 32px;

  font-weight: 600;

}



.address {

  padding-left: 50px;

  padding-right: 40px;

  margin-top: 20px;

}



.address:before {

  content: "";

  position: absolute;

  bottom: 0px;

  left: 0;

  border-top: 25px solid rgb(0, 105, 147);

  border-left: 25px solid rgb(0, 105, 147);

  border-bottom: 25px solid transparent;

  border-right: 25px solid transparent;

}



.listing-price {

  padding-left: 25px;

  padding-right: 55px;

  margin-top: 46px;

}



.listing-price:before {

  content: "";

  position: absolute;

  top: 0px;

  left: 0;

  border-top: 16px solid transparent;

  border-left: 17px solid rgb(0, 105, 147);

  border-bottom: 16px solid transparent;

}



/*.house-pictures .first-column {

  width: 29%;

}*/

.house-pictures {

  padding-top: .5rem;

}

.house-pictures .first-column img.first:first-of-type {

  margin-bottom: 12px;

}



/*.house-pictures .second-column {

  width: 60%;

}*/



.house-pictures img {
  width: 100%;
  border-radius: 6px;
}



.photos-row {
  display: flex;
  flex-wrap: wrap;
}



.description {

  margin-top: 10px;

  padding: 80px 0;

  background-color: #0066f3;

}



.description .col-md>div {

  display: inline-block;

  max-width: 100%;

  background-color: white;

  padding: 30px;

  position: relative;

  line-height: 30px;

  width: 92%
}



.top-border {

  position: absolute;

  width: 90%;

  top: -26px;

  left: 5%;

  border-top: 10px solid rgb(198, 220, 234);

}



.bottom-border {

  position: absolute;

  width: 90%;

  bottom: -26px;

  left: 5%;

  border-top: 10px solid rgb(198, 220, 234);

}



.house-desc-box {

  font-size: 18px;

}



.house-desc-box h3 {

  font-size: 24px;

  font-weight: 400;

}



.house-desc-box ul {

  margin-bottom: 40px
}


.call-us>div {

  width: 50%;

  color: white;

  position: relative;

  line-height: 50px;

}



.call-us>div:first-of-type {

  padding-left: 15px;

  background-color: rgb(129, 130, 134);

}



.call-us>div:last-of-type {

  padding-left: 15px;

  padding-right: 15px;

  background-color: rgb(0, 105, 147);

}



.call-us>div:first-of-type:after {

  content: "";

  position: absolute;

  top: 0px;

  right: -38px;

  border-top: 25px solid transparent;

  border-left: 19px solid rgb(129, 130, 134);

  border-bottom: 25px solid rgb(129, 130, 134);

  border-right: 19px solid transparent;

  z-index: 10;

}



.agents {

  padding: 0px 15px 15px 15px;

  background-color: rgb(234, 235, 237);

}



.agents .agent-box {

  margin-top: 15px;

}



.agent-image-wrapper {

  width: 30%;

}



.agents img {

  width: 100%;

}



.agent-box {

  width: 50%;

}



.blue-line {

  height: 30px;

  background-color: #0066f3;

}



.agents-contact {

  padding: 1px 20px;

  width: 70%;

}



.agents-contact>p {

  word-break: break-all;

  -ms-word-break: break-all;

}



.agents-contact>p:not(.agents-contact-name) {

  font-size: 13px;

  font-weight: 500;

}



.agents-contact-name {

  font-weight: 600;

  font-size: 18px;

  margin-bottom: 4px;

}



@media screen and (max-width: 320px) {

  header img {

    max-width: 290px;

  }

  .house-listing .title-h {

    padding-top: 5px;

  }

  .listing-price {

    margin-top: 4px;

  }

}



@media (max-width: 575.98px) {

  .house-listing>div:first-of-type {

    height: 56%;

  }



  .listing-price,

  .address {

    background-color: transparent;

    color: white;

  }



  .listing-price {

    position: relative;

    bottom: 13px;

  }



  .address {

    height: 64px;

    margin-top: 0px;

  }



  .title-h {

    padding: 15px;

  }

}



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

  .home-pros-logo,

  .naf-logo {

    max-width: 300px;

  }



  body.container {

    max-width: none;

  }



  .house-listing .title-h {

    font-size: 18px;

  }



  .house-listing {

    height: 177px;

    margin-bottom: 40px;

  }



  .house-listing>div:last-of-type {

    width: 100%;

  }



  .listing-price {

    margin-top: 3px;

    font-size: 12px;

  }



  .listing-price::before {

    content: none;

  }



  .house-pictures .first-column {

    width: 100%;

  }



  .house-pictures .second-column {

    width: 100%;

  }



  .house-pictures .first-column img.first:first-of-type {

    margin-bottom: 0px;

  }



  .address {

    padding-top: 7px;

    padding-left: 5px;

    padding-right: 0px;

    font-size: 12px;

    margin-top: 30px;

    line-height: 16px;

  }



  .address:before {

    content: none;

  }



  .description {

    padding-left: 15px;

    padding-right: 15px;

  }



  .description>div>div:last-of-type {

    margin-top: 40px;

  }



  .description .col-md>div {

    min-width: 90%;

  }



  .call-us>div {

    width: 100%;

  }



  .call-us>div:first-of-type:after {

    content: none;

  }



  .agent-image-wrapper {

    width: 100%;

    margin-bottom: 5px;

  }



  .agents-contact {

    padding-left: 4px;

    padding-right: 4px;

    width: 100%;

  }



  .agent-box {

    width: 100%;

  }

}

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

  body.container {

    padding-left: 8px;

    padding-right: 8px;

  }



  .house-pictures .first-column {

    width: 100%;

  }



  .house-pictures .second-column {

    width: 100%;

  }



  .house-pictures .first-column img.first:first-of-type {

    margin-bottom: 0px;

  }



  .house-listing .title-h {

    font-size: 18px;

  }



  .house-listing {

    margin-bottom: 40px;

  }







}