
body {
  margin: 0;
  padding: 30px;
}
.teal-font {
    color:black;
    font-weight: bold;
}

#interest {
    font-style: italic;
}

#home {
    width: 100%;
    height: auto;
    margin: 0;

}

.picture {
    max-width: 100%;
    height: auto;
    margin: 0px;
}

.box {
  color:white;
  background-color: grey;
  width: 20%;
  height: 20%;
  box-sizing: border-box;
  border: 1px solid black;
  /* padding: 30px;
  margin: 30px 500px; */
  margin: 2% 30%;
  
}

#projects_blank {
  height: 90px;
}
.flex-container{
  display: flex;
  flex-direction: column;
  align-items: flex-end;

}

.flex-container .box {
  text-align: center;
}

.navbar {
  background:white;
}

.nav-link,
.navbar-brand {
  color: black;
  font-weight: bold;
}
.nav-link{
  margin-right: 1em;
}

.nav-link:hover {
  color: black;
  font-weight: bold;
}

.teal-font:hover {
  color:rgba(47, 188, 146, 1);
}

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

.col-4 {
  text-align: center;
  font-weight: bold;
  color: rgba(47, 188, 146, 1);
  font-size: large;
  text-indent: 35%;
  padding-top: 30px;
}

.col-sm-6, .col-8{
  /* border: 1px solid black; */
  padding: 20px;
}

.project-img {
  border: 1px solid black;
  width: 100%;
  height: auto;
}

.project-name {
  color: rgba(47, 188, 146, 1);
}

.subtitle {
  color: gray;
}

.btn {
  padding: 12px 16px; /* Some padding */
  width: 45%;
  white-space:normal !important; 
  word-wrap:break-word;
}

.btn:hover {
  background-color:  rgba(47, 188, 146, 1);
  color: white;
}

i {
  color: rgba(47, 188, 146, 1);
}

.btn:hover i {
  color: white;
}


.footer {

  text-align: center;
  margin-top: 80px;
  width: 100%;
  height: 100px;
}

.quote {
  margin-bottom: 50px;
}

.footer-text {
  margin-bottom: 20px;
  color: gray;
}

.btn .links {
  color: black;
  text-decoration: none;
}

@media (max-width:800px) {
  #home {
    margin-top: 50px;

  }
  #contact {
    display: none;
  }

  .btn {
    width: 100%;
  }

  .col-8 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
  }

  .quote {
    font-size: 20px;
  }

  .footer-text {
    margin-bottom: 20px;
  }

  #projects_blank {
    display: none;
  }

  .description {
    font-size: medium;
  }
}