/*reset styles*/
*,
*::before,
*::after {
  box-sizing: border-box;
}
dl,
ol,
ul {
  margin-top: 0;
  margin-bottom: 0;
}

ol,
ul {
  padding-left: 0;
}

/*body style css*/
h2,
.navbar-brand {
  font-family: "Roboto", sans-serif;
}
.navbar-brand {
  font-size: 2rem;
  letter-spacing: 0.02em;
}
p {
  font-family: "Source Sans Pro", sans-serif;
}

#hero-banner {
  background-color: #f0f0f0 !important;
}
hr {
  margin: 0rem 0;
  opacity: 1;
  height: 0.1rem !important;
  border-radius: 2rem;
}
.fa-brands,
.fab {
  font-weight: 400;
  font-size: 3rem;
  margin-right: 1rem;
  margin-top: 5px;
}
footer i {
  font-size: 2rem;
  color: white;
}

footer ul li {
  text-decoration: none;
  list-style: none;
}

footer ul li a i:hover {
  color: #c1c1c1;
}

footer .fa-brands {
  font-size: 2rem;
}

/*button hover styles: button tags, outline buttons, */
a.btn:hover,
.btn-dark:hover {
  box-shadow: 0 3px 2px rgba(0, 0, 0, 0.07), 0 7px 5px rgba(0, 0, 0, 0.04),
    0 12px 10px rgba(0, 0, 0, 0.03), 0 22px 18px rgba(0, 0, 0, 0.03),
    0 42px 33px rgba(0, 0, 0, 0.02), 0 100px 80px rgba(0, 0, 0, 0.02);
  -webkit-box-shadow: 0 3px 2px rgba(0, 0, 0, 0.07),
    0 7px 5px rgba(0, 0, 0, 0.04), 0 12px 10px rgba(0, 0, 0, 0.03),
    0 22px 18px rgba(0, 0, 0, 0.03), 0 42px 33px rgba(0, 0, 0, 0.02),
    0 100px 80px rgba(0, 0, 0, 0.02);
  -moz-box-shadow: 0 3px 2px rgba(0, 0, 0, 0.07), 0 7px 5px rgba(0, 0, 0, 0.04),
    0 12px 10px rgba(0, 0, 0, 0.03), 0 22px 18px rgba(0, 0, 0, 0.03),
    0 42px 33px rgba(0, 0, 0, 0.02), 0 100px 80px rgba(0, 0, 0, 0.02);
}
.btn-portfolio {
  padding: 0.375rem 1.95rem;
  border-radius: 0;
}