:root {
  --my-dark-back: #232427;  /* Shark */
  --my-dark-color: #232427;  /* Shark */
  --my-light-back: #F1F4F1;  /* Grey Nurse */
  --my-light-color: #F1F4F1;  /* Grey Nurse */
  --my-accent-poc: #C2F146;  /* Pear */
  --my-accent-subtle: #848B88;  /* Gunsmoke */
}

/* establish baseline font for website */
body {
  font-family: Roboto, Arial, sans-serif;
}

/** height of logo image is constrained by the height of navbar */
.navbar-logo {
  max-height: 100%;
}

/* hero background image */
.bgimage {
  height:100vh;
  background: url('/img-portfolio/heroimage.png');
  background-size:cover;
  background-repeat: no-repeat;
  position:relative;
}

/* text css above hero image*/
.hero_title {
  font-size: 4.5rem;
}
.hero_desc {
  font-size: 2rem;
}
.hero-text {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: var(--my-light-color);
}

#contact {
  padding-bottom: 4rem;
}
/* about section image css */
.imageAboutPage {
  width: 100%;
}

.card-title {
  text-align: center;
}

.cite-small {
  font-size: .5rem;
}

/* social media icons styling */
.social-icons {
  font-size: 36px;
  cursor: pointer;
}
.fa-facebook:hover,.fa-instagram:hover,.fa-linkedin:hover {
  color: var(--my-accent-poc);
}
.fab {
  color: #000000;
}
/* footer styling */
#footer {
  background-color: var(--my-accent-subtle);
  text-align: center;
}