body { 
    padding-top: 56px; 
    background-color: #e8dbb7;
}

.left-aligned { margin-left: auto; }
.bg-dark { background-color: #e8dbb7 !important; }
.bg-hero { background-color: rgb(232, 219, 183); }
.bg-body { background-color: #343840;}

/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom:.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#042f56 }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }


/* footer */
footer a { color: rgb(0, 0, 0); font-weight: bold; text-decoration: none; }
footer a:hover { color: rgb(0, 0, 0); text-decoration: underline; }

/* fonts */

/* Averia-Libre - regular */
@font-face {
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 400;
    src: 

         url('https://static.igem.wiki/teams/5097/fonts/averialibre-regular.ttf') format('truetype'), /* Safari, Android, iOS */

  }
 
  /* TEXT STYLING */

.standard-header h1{
    font-size: clamp(2rem, 1rem + 5vw ,5rem);
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 300;
    color: black;
    
}

h2{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 300;
    font-size: clamp(1rem, calc(0.89rem + 1.86vw), 2rem);
  }
  
  h3 {
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 300;
    font-size: clamp(0.5rem, 0.5rem + 0.8vw, 1.1rem);
  }
  
  h4{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 600;
    font-size: clamp(1rem, 0.5rem + 1.7vw, 1.5rem);
  
  }
  
  h5{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 300;
    font-size: clamp(1rem, 0.5rem + 1.86vw, 1.5rem);
  
  }
  
  p{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 400;
    font-size: clamp(0.8rem, calc(0.87rem + 0.10vw), 1rem);
  }
  
  .bold-text{
    font-weight: 700;
  }
  
  title{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 400;
    color: black;
  }
  
  li{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 400;
    font-size: clamp(0.8rem, calc(0.87rem + 0.10vw), 1rem);
    color: black;

}

a{
    font-family: 'Averia Libre';
    font-style: normal;
    font-weight: 400;
    color: black;

}

/* NAVIGATION */

nav.navbar{
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.navbar{
  display: flex;
  width: 100%;
  background-color:rgba(255, 255, 255, 0);
  backdrop-filter: blur(5px);
  transition: visibility 0s, 0.6s, opacity 0.6s linear, transform 1s;
}

.nav-item{
  padding: 0px 20px;
  font-family: 'Averia Libre';
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
}

.scrolled{
  background-color: #06053fff;
  backdrop-filter: blur(5px);
  transition: visibility 0s, 0.6s, opacity 0.6s linear, transform 1s;
  box-shadow: 10px 0 5px #2128327a;
}

.scrolled ul.dropdown-menu.show{
  background-color: #161617df;
  text-align: left;
}
ul.dropdown-menu.show {
  backdrop-filter: blur(5px);
  background-color: #00000044;
  text-align: left;
}

a.dropdown-item.hvr-fade {
  color: black;
}