html,
body {
  padding: 0;
  font-family: Karla;
}

.contenu{
  margin-top:5%;
  margin-left: 8%;
  margin-right: 8%;
  justify-content: flex-start;
}

.contenu-projets{
  margin-top:5%;
  margin-left: 10%;
  margin-right: 10%;
  margin-bottom: 5%;
}

.photos-projet{
  margin-top:15%;
  margin-left: 15%;
  margin-right: 15%;
  margin-bottom: 8%;
  justify-content: center;
}

.logo-footer{
  height: 30%;
}

* {
  box-sizing: border-box;
}

main {
  padding: 1rem 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.site-title {
            font-family: Karla;
            color: black;
        }

nav {
      font-family: Karla;
      height: 6rem;
      color: white;
        }


#custom-navbar {
  padding-left: 8%;
  padding-right: 8%;
  padding-bottom: 2%;
  font-size: large;

}

.footer-title{
  font-family: Karla;
  color: white;
}

.custom-footer{
  padding-bottom: 2%;
} 

.projet-p{
  text-align: justify;
}

code {
  background: #fafafa;
  border-radius: 5px;
  padding: 0.75rem;
  font-family: Menlo, Monaco, Lucida Console, Courier New, monospace;
}

.container {
  display: flex;
  flex-direction: column;
  justify-content: center; 
  align-items: center;
}

.projet {
  width :100%;
  margin-left: 8%;
  margin-right: 8%;
  margin-bottom: 8%;
  padding-right: 10%;
}

.small-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

a:link {
  color: black;
  /* text-decoration: none; */
}

a:visited {
  color: black;
  /* text-decoration: none; */
}

#bootstrap-overrides a:hover {
  color: hotpink;
  /* text-decoration: none; */
}

a:active {
  color: black;
  /* text-decoration: none; */
}