/* Font, text colors and background colors used throughout the site */

body {
  font-family: "IBM Plex Sans", sans-serif;
  background-color: #000;
  color: #fff;
}

/* Hero image */
.callout-container {
  height: 50vh;

  background: url("../images/hero_image.jpeg") no-repeat bottom center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

/* Navbar */
.navbar {
  margin-bottom: 0;
  border: 0;
  width: 100%;
}

.navbar .navbar-toggler {
  border: 0;
}

.navbar-brand {
  font-weight: 700;
}

.navbar .navbar-nav a {
  font-weight: 500;
}

/* Index Page Content */
.index-page-header {
  padding-top: 75px;
  padding-bottom: 25px;
}

.index-page-text {
  padding-bottom: 75px;
}

/* Horizontal Rule Styling */
.block-divider {
  width: 100px;
  height: 5px;
  border: 0;
  background-color: #fff;
}

/* Footer */
footer {
  height: 150px;
}

.social-media-links {
  text-align: center;
}

.social-media-links li {
  display: inline;
}

.social-media-links i {
  font-size: 175%;
  margin: 1%;
  padding: 5%;
  padding-top: 15%;
}

/* Content styles for all other pages */
.general-page-heading {
  padding-top: 75px;
  padding-bottom: 125px;
}

.general-content {
  text-align: center;
}

.general-content h2 {
  padding-top: 75px;
}

/* Styles captions for figures */ 
.figure-caption a {
  color: inherit;
  text-decoration: none;
}

/* Styles for large screens and above */
@media (min-width: 992px) {
  .callout-container {
    height: 75vh;
  }

  .navbar-brand {
    font-size: 150%;
  }

  .navbar .navbar-nav a {
    font-size: 125%;
  }

  .general-content {
    text-align: left;
  }

  .general-content h2,
  h3 {
    padding-left: 75px;
    padding-top: 0px;
  }

  .general-content p {
    padding-left: 75px;
  }
}