* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: Montserrat, serif;
}

a {
  text-decoration: none;
}

.home {
  justify-content: center;
  display: flex;

  & img {
    width: 46.5vw;
    margin-top: 5rem;
  }

  & .textWrapper {
    position: absolute;
    transform: translateY(12rem);

    & h1 {
      font-size: 2.7rem;
      font-style: italic;
      font-weight: 900;
    }

    & p {
      font-size: 1.65rem;
      font-style: italic;
      font-weight: 500;
    }
  }

  & .navButtons {
    position: absolute;
    transform: translate(-3.7rem, 26rem);

    & .row1 {
      margin-bottom: 1rem;
    }

    & a {
      color: #000;
      border: .1rem solid #000;
      border-radius: 1rem;
      padding: .1rem .7rem;
      font-size: 1rem;
    }

    & a:hover {
      color: #fff;
      background-color: #000;
    }
  }
}

.hoardings {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 3rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;

    & img {
      width: 1.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translateX(60rem);
  }

  & .hoardingImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 30vw;
    }

    & img:nth-child(2) {
      transform: translateY(10rem);
    }
  }
}

.poleKiosk {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 3rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;

    & img {
      width: 1.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translateY(30rem);
  }

  & .poleKioskImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 30vw;
    }
  }
}

.canopy {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 3rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;

    & img {
      width: 1.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(80rem, 20rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 50vw;
    }
  }
}

.siteBranding {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 5rem;
    font-size: 2rem;
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(80rem, -35rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 90vw;
    }
  }
}

.directionBoards {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 5rem;
    font-size: 2rem;

    & img {
      width: 2.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(80rem, -35rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 90vw;
    }
  }
}

.salesOfficeBranding {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 12rem;
    font-size: 2rem;

    & img {
      width: 2.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(45rem, -10rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 50vw;
    }
  }
}

.dropdownBanners {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 12rem;
    font-size: 2rem;

    & img {
      width: 2.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(45rem, -10rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 50vw;
    }
  }
}

.circlePole {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 12rem;
    font-size: 2rem;

    & img {
      width: 2.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(45rem, -10rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 20vw;
    }
  }
}

.stationary {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 0;
    font-size: 2rem;

    & img {
      width: 2.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(45rem, -10rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 22vw;
    }
  }

  & .brochureImgs {
    padding: 5rem;

    & img {
      width: 90vw;
    }
  }
}

.onlineAds {
  padding-top: 10rem;

  & .h4Heading {
    flex-direction: column;
    align-items: center;
    display: flex;

    & h4 {
      text-align: center;
      color: #1e90ff;
    }

    & hr {
      text-align: center;
      border-top: 3px solid #1e90ff;
      width: 4rem;
    }
  }

  & h1 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 4.5rem;
    font-style: italic;
    font-weight: 900;

    & img {
      width: 64px;
      transform: translateY(1rem);
    }
  }

  & p {
    text-align: center;
    margin-bottom: 0;
    font-size: 2rem;

    & img {
      width: 2.5rem;
      transform: translateY(.5rem);
    }
  }

  & .hoardingBadge {
    width: 15rem;
    position: absolute;
    transform: translate(45rem, -10rem);
  }

  & .canopyImgs {
    justify-content: space-evenly;
    align-items: center;
    padding: 5rem;
    display: flex;

    & img {
      width: 22vw;
    }
  }

  & .brochureImgs {
    padding: 5rem;

    & img {
      width: 90vw;
    }
  }
}

#navbarNav{
    background:black;
}

@media only screen and (width <= 1500px) and (width >= 1459px) {
  .home {
    & img {
      width: 45vw;
    }

    & .textWrapper {
      transform: translateY(11rem);

      & h1 {
        font-size: 2.4rem;
      }

      & p {
        font-size: 1.45rem;
      }
    }

    & .navButtons {
      transform: translate(-1.7rem, 23rem);
    }
  }

  .canopy {
    & .hoardingBadge {
      transform: translate(70rem, 20rem);
    }
  }

  .siteBranding {
    & .hoardingBadge {
      transform: translate(70rem, -32.5rem);
    }
  }
}

@media only screen and (width <= 1459px) and (width >= 1323px) {
  .home {
    & img {
      width: 45vw;
    }

    & .textWrapper {
      transform: translateY(11rem);

      & h1 {
        font-size: 2rem;
      }

      & p {
        font-size: 1.25rem;
      }
    }

    & .navButtons {
      transform: translate(-1.7rem, 21rem);

      & a {
        padding: .1rem .7rem;
        font-size: .8rem;
      }
    }
  }

  .canopy {
    & .hoardingBadge {
      transform: translate(70rem, 20rem);
    }
  }

  .siteBranding {
    & .hoardingBadge {
      transform: translate(68rem, -32.5rem);
    }
  }

  .salesOfficeBranding {
    & .hoardingBadge {
      transform: translate(40rem, -10rem);
    }
  }

  .circlePole {
    & .hoardingBadge {
      transform: translate(40rem, -10rem);
    }
  }

  .dropdownBanners {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(40rem, -10rem);
    }
  }
}

@media only screen and (width <= 1323px) and (width >= 1225px) {
  .home {
    & img {
      width: 45vw;
    }

    & .textWrapper {
      transform: translateY(10rem);

      & h1 {
        font-size: 2rem;
      }

      & p {
        font-size: 1.25rem;
      }
    }

    & .navButtons {
      transform: translate(-2.5rem, 20rem);

      & .row1 {
        margin-bottom: .5rem;
      }

      & a {
        padding: .1rem .7rem;
        font-size: .7rem;
      }
    }
  }

  .canopy {
    & .hoardingBadge {
      transform: translate(60rem, 20rem);
    }
  }

  .siteBranding {
    & .hoardingBadge {
      transform: translate(65rem, -32.5rem);
    }
  }

  .circlePole {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(36rem, -10rem);
    }
  }

  .salesOfficeBranding {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(35rem, -10rem);
    }
  }

  .dropdownBanners {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(35rem, -10rem);
    }
  }
}

@media only screen and (width <= 1225px) and (width >= 1125px) {
  .home {
    & img {
      width: 45vw;
    }

    & .textWrapper {
      transform: translateY(10rem);

      & h1 {
        font-size: 1.75rem;
      }

      & p {
        font-size: 1.1rem;
      }
    }

    & .navButtons {
      transform: translate(-.8rem, 18.5rem);

      & .row1 {
        margin-bottom: .5rem;
      }

      & a {
        padding: .1rem .7rem;
        font-size: .7rem;
      }
    }
  }

  .hoardings {
    & .hoardingBadge {
      transform: translateX(45rem);
    }
  }

  .canopy {
    & .hoardingBadge {
      transform: translate(55rem, 20rem);
    }
  }

  .siteBranding {
    & .hoardingBadge {
      transform: translate(60rem, -30rem);
    }

    & p {
      font-size: 1.6rem;
    }
  }

  .circlePole {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(36rem, -10rem);
    }
  }

  .salesOfficeBranding {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(35rem, -10rem);
    }
  }

  .dropdownBanners {
    & .hoardingBadge {
      width: 15rem;
      transform: translate(35rem, -10rem);
    }
  }
}

@media only screen and (width <= 600px) and (width >= 431px) {
  .home {
    justify-content: center;
    display: flex;

    & img {
      width: 90vw;
      margin-top: 5rem;
    }

    & .textWrapper {
      transform: translateY(8rem);

      & h1 {
        font-size: 1.3rem;
        font-style: italic;
        font-weight: 900;
      }

      & p {
        font-size: .8rem;
        font-style: italic;
        font-weight: 500;
      }
    }

    & .navButtons {
      transform: translateY(15rem);

      & .row1 {
        margin-bottom: .1rem;
      }

      & a {
        padding: .1rem .7rem;
        font-size: .45rem;
      }
    }
  }

  .hoardings {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2.5rem;

      & img {
        width: 44px;
        transform: translateY(.5rem);
      }
    }

    & p {
      font-size: .8rem;

      & img {
        width: 1.2rem;
        transform: translateY(.3rem);
      }
    }

    & .hoardingBadge {
      width: 9rem;
      transform: translate(14rem, 3rem);
    }

    & .hoardingImgs {
      justify-content: space-evenly;
      align-items: center;
      padding: 1rem;
      display: flex;

      & img {
        width: 40vw;
      }

      & img:nth-child(2) {
        transform: translateY(10rem);
      }
    }
  }

  .poleKiosk {
    & .poleKioskImgs {
      padding: 1rem;

      & img {
        width: 40vw;
      }
    }

    & .hoardingBadge {
      transform: translateY(10rem);
      width: 9rem !important;
    }
  }

  .canopy {
    padding-top: 2rem;

    & .canopyImgs {
      margin-top: 7rem;
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }

    & .hoardingBadge {
      transform: translateX(8rem);
      width: 9rem !important;
    }

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;

      & img {
        width: 38px;
        transform: translateY(.5rem);
      }
    }

    & p {
      font-size: .8rem;

      & img {
        width: 1.2rem;
        transform: translateY(.3rem);
      }
    }
  }
}

@media only screen and (width <= 431px) and (width >= 401px) {
  .home {
    & img {
      width: 90vw;
      margin-top: 5rem;
    }

    & .textWrapper {
      transform: translateY(8rem);

      & h1 {
        font-size: 1.3rem;
      }

      & p {
        font-size: .8rem;
      }
    }

    & .navButtons {
      transform: translate(-.5rem, 14rem);

      & .row1 {
        margin-bottom: .1rem;
      }

      & a {
        padding: .1rem .7rem;
        font-size: .45rem;
      }
    }
  }

  .hoardings {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2.5rem;

      & img {
        width: 44px;
        transform: translateY(.5rem);
      }
    }

    & p {
      font-size: 1.2rem;

      & img {
        width: 1.2rem;
        transform: translateY(.3rem);
      }
    }

    & .hoardingBadge {
      width: 9rem;
      transform: translate(14rem, 3rem);
    }

    & .hoardingImgs {
      padding: 1rem;

      & img {
        width: 40vw;
      }

      & img:nth-child(2) {
        transform: translateY(10rem);
      }
    }
  }

  .poleKiosk {
    & .poleKioskImgs {
      padding: 1rem;

      & img {
        width: 40vw;
      }
    }

    & .hoardingBadge {
      transform: translateY(10rem);
      width: 9rem !important;
    }
  }

  .canopy {
    padding-top: 2rem;

    & .canopyImgs {
      margin-top: 7rem;
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }

    & .hoardingBadge {
      transform: translateX(8rem);
      width: 9rem !important;
    }

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;

      & img {
        width: 38px;
        transform: translateY(.5rem);
      }
    }

    & p {
      font-size: .8rem;

      & img {
        width: 1.2rem;
        transform: translateY(.3rem);
      }
    }
  }

  .siteBranding {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 5rem;
      font-size: .7rem;
    }

    & .hoardingBadge {
      width: 7rem;
      transform: translate(10rem, -11rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }
  }

  .directionBoards {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;

      & img {
        width: 64px;
        transform: translateY(1rem);
      }
    }

    & p {
      margin-bottom: 5rem;
      font-size: .8rem;

      & img {
        width: 1rem;
        transform: translateY(.2rem);
      }
    }

    & .hoardingBadge {
      width: 15rem;
      transform: translate(100rem, -65rem);
    }

    & .canopyImgs {
      justify-content: space-evenly;
      align-items: center;
      padding: 1rem;
      display: flex;

      & img {
        width: 89vw;
      }
    }
  }

  .salesOfficeBranding {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 1rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 12rem;
      font-size: 1.2rem;

      & img {
        width: 2.5rem;
        transform: translateY(.5rem);
      }
    }

    & .hoardingBadge {
      width: 15rem;
      transform: translate(7rem, -12rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }
  }

  .dropdownBanners {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 12rem;
      font-size: 1.2rem;
    }

    & .hoardingBadge {
      width: 15rem;
      position: absolute;
      transform: translate(8rem, -10rem);
    }

    & .canopyImgs {
      padding: 5rem;

      & img {
        width: 70vw;
      }
    }
  }

  .circlePole {
    padding-top: 0;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 12rem;
      font-size: 1rem;

      & img {
        width: 2.5rem;
        transform: translateY(.5rem);
      }
    }

    & .hoardingBadge {
      width: 11rem;
      position: absolute;
      transform: translate(9rem, -10rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 20vw;
      }
    }
  }

  .stationary {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 0;
      font-size: 1rem;
    }

    & .hoardingBadge {
      width: 15rem;
      position: absolute;
      transform: translate(45rem, -10rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 22vw;
      }
    }

    & .brochureImgs {
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }
  }

  .onlineAds {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 0;
      font-size: 1rem;
    }

    & .hoardingBadge {
      width: 15rem;
      position: absolute;
      transform: translate(45rem, -10rem);
    }

    & .canopyImgs {
      flex-direction: column;
      justify-content: space-evenly;
      align-items: center;
      padding: 5rem;
      display: flex;

      & img {
        width: 90vw;
      }
    }
  }
}

@media only screen and (width <= 401px) and (width >= 320px) {
  .home {
    & img {
      width: 90vw;
      margin-top: 5rem;
    }

    & .textWrapper {
      transform: translateY(8rem);

      & h1 {
        font-size: 1.1rem;
      }

      & p {
        font-size: .7rem;
      }
    }

    & .navButtons {
      transform: translate(-.6rem, 13rem);

      & .row1 {
        margin-bottom: .05rem;
      }

      & a {
        padding: .1rem .5rem;
        font-size: .4rem;
      }
    }
  }

  .hoardings {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2.5rem;

      & img {
        width: 44px;
        transform: translateY(.5rem);
      }
    }

    & p {
      font-size: 1.2rem;

      & img {
        width: 1.2rem;
        transform: translateY(.3rem);
      }
    }

    & .hoardingBadge {
      width: 9rem;
      transform: translate(14rem, 3rem);
    }

    & .hoardingImgs {
      padding: 1rem;

      & img {
        width: 40vw;
      }

      & img:nth-child(2) {
        transform: translateY(10rem);
      }
    }
  }

  .poleKiosk {
    & .poleKioskImgs {
      padding: 1rem;

      & img {
        width: 40vw;
      }
    }

    & .hoardingBadge {
      transform: translateY(10rem);
      width: 9rem !important;
    }
  }

  .canopy {
    padding-top: 2rem;

    & .canopyImgs {
      margin-top: 7rem;
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }

    & .hoardingBadge {
      transform: translateX(8rem);
      width: 9rem !important;
    }

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;

      & img {
        width: 38px;
        transform: translateY(.5rem);
      }
    }

    & p {
      font-size: .8rem;

      & img {
        width: 1.2rem;
        transform: translateY(.3rem);
      }
    }
  }

  .siteBranding {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 5rem;
      font-size: .7rem;
    }

    & .hoardingBadge {
      width: 7rem;
      transform: translate(10rem, -11rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }
  }

  .directionBoards {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;

      & img {
        width: 64px;
        transform: translateY(1rem);
      }
    }

    & p {
      margin-bottom: 5rem;
      font-size: .8rem;

      & img {
        width: 1rem;
        transform: translateY(.2rem);
      }
    }

    & .hoardingBadge {
      width: 15rem;
      transform: translate(100rem, -65rem);
    }

    & .canopyImgs {
      justify-content: space-evenly;
      align-items: center;
      padding: 1rem;
      display: flex;

      & img {
        width: 89vw;
      }
    }
  }

  .salesOfficeBranding {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 1rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 12rem;
      font-size: 1.2rem;

      & img {
        width: 2.5rem;
        transform: translateY(.5rem);
      }
    }

    & .hoardingBadge {
      width: 15rem;
      transform: translate(7rem, -12rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }
  }

  .dropdownBanners {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 12rem;
      font-size: 1.2rem;
    }

    & .hoardingBadge {
      width: 15rem;
      position: absolute;
      transform: translate(6rem, -10rem);
    }

    & .canopyImgs {
      padding: 5rem;

      & img {
        width: 70vw;
      }
    }
  }

  .circlePole {
    padding-top: 0;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 12rem;
      font-size: 1rem;

      & img {
        width: 2.5rem;
        transform: translateY(.5rem);
      }
    }

    & .hoardingBadge {
      width: 11rem;
      position: absolute;
      transform: translate(9rem, -10rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 20vw;
      }
    }
  }

  .stationary {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 0;
      font-size: 1rem;
    }

    & .hoardingBadge {
      width: 15rem;
      position: absolute;
      transform: translate(45rem, -10rem);
    }

    & .canopyImgs {
      padding: 1rem;

      & img {
        width: 22vw;
      }
    }

    & .brochureImgs {
      padding: 1rem;

      & img {
        width: 90vw;
      }
    }
  }

  .onlineAds {
    padding-top: 5rem;

    & h1 {
      margin-bottom: 2rem;
      font-size: 2rem;
    }

    & p {
      margin-bottom: 0;
      font-size: 1rem;
    }

    & .hoardingBadge {
      width: 15rem;
      position: absolute;
      transform: translate(45rem, -10rem);
    }

    & .canopyImgs {
      flex-direction: column;
      justify-content: space-evenly;
      align-items: center;
      padding: 5rem;
      display: flex;

      & img {
        width: 90vw;
      }
    }
  }
}
/*# sourceMappingURL=riveraHomesAdvert.197463fc.css.map */