html {
    scroll-behavior: smooth;
}

body {
  padding: 0;
  margin: 0;
  background: #E8E8E8;
}

nav ul > .active > a,
nav ul > .active > a:hover,
nav ul > .active > a:focus,
nav ul > .active > .bio-nav a {
    color: #064F25;
}

/*--- navigation bar ---*/

.navbar {
  background:#00C860;
}

.nav-link,
.navbar-brand {
  font-weight: bold;
  color: #fff;
  cursor: pointer;
}

.nav-link {
  margin-right: 1em !important;
}

.navbar-brand:hover {
  color: #064F25;
}

.nav-link:hover {
  color: #064F25;
}

.navbar-collapse {
  justify-content: flex-end;
}

.header {
  background-image: url("images/background.png");
  background-size: cover;
  background-position: center;
  position: relative;
  background-color: #fff;
}

.description { 
  left: 1%;
  position: absolute;
  top: 20%;
  text-align: center;
}

.back {
  background-image: url("images/background.png");
  background-size: cover;
  background-position: center;
  position: relative;
}

.about p {
  color: #fff;
  font-size: 1.25rem;
  line-height: 1.5;
  text-align: justify;
}

.about {
    margin: 2rem;
}

.description h1 {
  color: #00C860;
  font-weight: bold;
  text-align: center;
}

.description p {
  color: #fff;
  font-size: 1.25rem;
  line-height: 1.5;
}

#license {
  font-size: 0.1rem;
  color: #065226;
  left: 90%;
  position: absolute;
  top: 92.5%;
}

.description button {
  border:1px solid #00C860;
  background:#00C860;
  border-radius: 30px;
  color:#fff;
  transition: transform .2s;
}
.description button:hover {
  border:1px solid #fff;
  background:#fff;
  color:#064F25;
  transform: scale(1.1);
}

.features {
  margin: auto;
  padding: 1em;
  position: relative;
}
.feature-title {
  color: #333;
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.features img {
  -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
  margin-bottom: 16px;
}

.page-footer {
  background-color: #222;
  color: #ccc;
  padding: 60px 0 30px;
}

.img-fluid {
    transition: transform .2s;
}

.img-fluid:hover {
    transform: scale(1.05);
}

.display {
    display: block;
}

.about_img {
    border: solid 2px #00C860;
    border-radius: 5px;
}