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

.logo {
  height: 40px;
}

.home-tron {
  height: 90vh;
  margin-bottom: 0px;
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.6)), url("/images/pic3.JPG");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: white;
  align-items: center;
  display: flex;
}

.home-tron .container {
  width: 90%;
  text-align: center;
}

.home-title .btn {
  margin-top: 30px !important;
}

.masonry-display {
  column-count: 1;
}

.about-tron {
  margin-bottom: 0px;
}

.pic {
  display: inline-block;
  margin: 0 0 1em;
  width: 100%;
}

img {
  width: 100%;
}

.text-container {
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
  min-height: 80vh;
}

.text-content {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.about-text {
  padding: 20px 20px 50px 20px;
  font-size: 1.25rem;
  font-weight: 300;
  font-family: -apple-system, BlinkMacSystemFont,"Segoe UI", Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.review {
  padding: 20px 20px;
  margin: 15px 15px;
  border-radius: 15px;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.footer {
  width: 100%;
  background-color: #343a40;
  padding: 30px 10%;
  min-height: 10vh;
}

.footer-links {
  color: rgba(255,255,255,.5);
}

.footer-links:hover {
  color: rgba(255,255,255,1);
}

.footer-links:visited {
  color: rgba(255,255,255,.5);
}

@media only screen and (min-width: 600px) {
    .home-tron .container {
      text-align: left;
    }

    .masonry-display {
      column-count: 2;
      column-gap: 1em;
    }

    .about-content {
      flex-direction: row;
      align-items: center;
    }

    .profile-pic {
      flex-grow: 1;
      padding: 20px;
    }

    .about-text {
      flex-grow: 2;
    }

}

@media only screen and (min-width: 900px) {
    .home-tron .container {
      width: 80%;
    }

    .masonry-display {
      column-count: 3;
      column-gap: 1em;
    }

    .profile-pic {
      flex-grow: 1;
      padding: 20px;
    }

    .about-text {
      flex-grow: 2;
    }

}

@media only screen and (min-width: 1200px) {
    .home-tron .container {
      width: 70%;
    }

    .masonry-display {
      column-count: 4;
      column-gap: 1em;
    }

}