/* ====== HERO ====== */

.heroNavRow {
  position: relative;
}

.heroNavRow .contact-info {
  position: absolute;
  top: 20%;
}

.hero-area {
  background: #272727;
  padding: 85px 0;
}

.hero-area .block p {
  margin-bottom: 20px;
  color: #c8c8c8;
}

p.subtitle {
  font-size: 18px;
  word-spacing: 1px;
  line-height: 1.4em;
  font-weight: 200;
}

.hero-area .block .heroHeadOne {
  font-size: 1.65rem;
  font-family: "Open Sans", sans-serif;
}

.hero-area .block .heroHeadTwo {
  font-size: 4.35rem;
  font-family: "Open Sans", sans-serif;
}

.hero-area .block .heroHeadThree {
  font-size: 2.5rem;
  font-family: "Open Sans", sans-serif;
}

div.container
  div.row.d-flex.justify-content-between
  div.col-lg-5.col-md-12.d-flex.loginButtons {
  justify-content: end;
}

.netbasisTagline {
  color: #34f76d;
}

.hero-nav {
  padding: 25px 0;
  background: #eeeeee;
}

.hero-nav .loginButtons {
  display: flex;
  justify-content: end;
}

/* Tablet Landscape */
@media (max-width: 1080px) {
  .heroNavRow .contact-info {
    position: relative;
    display: inline block;
    margin-bottom: 2em;
    text-align: center;
  }
  
  .loginButtons {
    justify-content: center;
  }
}

/* Tablet Profile */
@media (max-width: 1079px) {
  .hero-nav .loginButtons {
    display: flex;
    justify-content: center;
  }
}

/*  Phone Screens */
@media (max-width: 576px) {
  .hero-area .block .heroHeadOne {
    text-align: center;
    font-size: 1.8rem;
  }

  .hero-area .block .heroHeadTwo {
    margin: unset;
    font-size: 4.5rem;
    text-align: center;
  }

  .hero-area .block .heroHeadThree {
    text-align: center;
    font-size: 2.5rem;
  }
}