body { padding-top: 56px; overflow-x: hidden; }
.left-aligned { margin-left: auto; }
.bg-dark { background-color: #343a40 !important; }
.bg-hero { background-color: #45b06cff; }

a {
  color: #533292; 
  }

/* CALLOUT */
.bd-callout { padding:1.25rem; margin:1.25rem; border:3px dotted #CEB2FF; border-radius:.25rem }
.bd-callout h4 { margin-bottom: 1.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:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }
.purple-highlight {
  background-color: #D0C4E8;
  padding: 0 4px;
  border-radius: 4px;
}

/* footer */
footer a { color: white; font-weight: bold; text-decoration: none; }
footer a:hover { color: white; text-decoration: underline; }


.footer-overlay {
  position: relative;
  background-image: 
    linear-gradient(#69488A,#3F185C),
    url(../static/footer-image-plastic-crinkle.jpg);
  background-blend-mode: overlay;
  background-blend-mode: multiply;
}

/*header*/
.navbar-logo-container{
  display: flex;
  align-items: center;
  justify-content: start;
}

.navbar-brand{
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-size: 2rem;
  margin-right: 10px;}


.navbarSupportedContent .nav-link{
  justify-content: flex-end;
  align-items: center;
  display: flex;
  font-size: 1.3rem;
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  
  
}

.dropdown-item {
  font-size: 1.4rem;
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
}


/*HOME PAGE CSS CONTENT*

/*individual elements from canva*/
.hero-elements {
  position: absolute;
  overflow-y: visible;
  overflow-x:visible;
  z-index: 20;
  }

  .canva-element-w-overflow {
  position: relative;
  animation: float 6s ease-in-out infinite;
  z-index: 1000;
    
  }
  .hand-bottle {
  transform: translate(100%, -30%);
  bottom:250px;
  left:25px;
  width:105%;

  }

  .plastic-bottle-1{
  transform: translate(0%, 90%) rotate(5deg);
  top:20%;
  right:70%;
  width:90%;
  }


  .plastic-bag-1{
    transform: translate(50%, -20%) rotate(10deg);
    left:70%;
    top: 60%;
  }

  .bacteria-1{
    transform: translate(75%, -90%) rotate(0deg);
    left:0%;
    top: 50%;
  }

  .bacteria-2{
  transform: translate(-50%, -30%);
  top:50%;
  right:80%;
  width:110%;
  }

  .bacteria-3{
  width:150%;
  transform: translate(-100%, 0%) rotate(20deg);
  right:125px;
  }

  .bacteria-4 {
  width:130%;
  transform: translate(80%, 40%) ;
  left:50px;
  top:100px;
  }

  /* Hero Page Components*/

  .hero-img {
    background-size: cover;
    min-height: 100vh;
    width: 100vw;

    overflow-y: visible;  
    /*Don't do overflow-x: hidden; because it messes up the floating images*/
    position: relative;
    background-repeat: no-repeat;
    justify-content: center; 
    align-items: center;  

    display: flex;
    flex-direction: column;

  }

  /*Hero-text components*/

  .hero-centered-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .hero-numbers-text {
    position: absolute;
    color:black;
    text-align: center;
  }


  .hero-heading-text {
    font-family: 'League Spartan', sans-serif;
    font-optical-sizing: auto;
    font-weight: 750;
  }
  #hero-subtext-1 {
    font-family: 'Montserrat', sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-size: 1.5rem;
  }
  #hero-subtext-2 {
    font-family: 'PT Sans', sans-serif;
    font-optical-sizing: auto; 
    font-weight: 400; 
    font-size: 1rem;
    padding: 30px;
    margin-left: 17%;
    margin-right: 17%;
  }
  #hero-subtext-3{
    font-family: "Questrial", sans-serif;
    font-weight: 400;
    font-style: normal;
  }



  /*Project Components Section Components*/

  #project-component-heading {
    margin: 2%;
    font-size: 4.1625rem; 
    color: black; 
    position: relative;
    top: 10px;
  }


  .project-photo {
    max-width: 100%;
    min-height: 100%; 
    object-fit: cover; 
    padding: 10px;

  }

  .project-label {
    font-weight: 900;
    text-transform: uppercase;
    color:black;
    text-align: center;
  }

  .team-container{
    align-items: center;
    justify-content: center;
    display: grid;
  }

/*end of home*/
  

/*experiments.html css*/

/*experimental nav bar*/


.side-navbar {
  position: sticky;
  top: 14%;
  display: flex;
  flex-direction: column;
  z-index: 1000;

  /*font*/
  border-left: 0.3rem solid #492e5c; 
  padding-left: 1rem;
  max-width: 30vw;
 
}

.nav-toc-header{
 font-family: 'League Spartan', sans-serif;
 font-optical-sizing: auto;
 font-weight: 600;
 font-size: 1.8rem;
 text-align: center;
 color: black;
 text-decoration: underline;
 margin-bottom: 3%;
}


.nav-link {
  display: block;
  margin-bottom: 6px;
  padding: 0.25rem 0.5rem;
  text-decoration: none;
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: 1.1rem;
  color: #000000;
  position: relative;
}

nav.side-navbar a.active {
  color: #6f3687;
}
.nav-link-sub{
  margin-left:10px; 
  padding-bottom: 0%; 
  padding-top: 0%;
}

.nav-link:hover {
  text-decoration: underline;
}


.side-navbar .toc-line {
  position: absolute;
  left: -4px;         
  width: 3.2px;
  background: #ffffff;
  transition: top 0.25s, height 0.25s;
  z-index: 1;
}



/*<!--- main body content --->*/

.mainbody-container {
  align-items: center;
  margin: auto;
  padding:0%
}

.mainbody-content {
  background-color: white;
  margin-bottom: 20px;
}

.mainbody-content h1, h2, h3, h4, h5 {
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  margin-top: 20px;
  margin-bottom:10px;
}

.mainbody-content p, ol, li {
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-size: 1.2rem;
  margin-bottom:10px;
}

.mainbody-content img {
  height: auto;
  width: 100%;
}


/*Text for Figures*/
.figures {
  margin-top: 15px;
}

.figure-title{
  color:#6c3a85;
  font-weight: 700;
  font-style: italic;
}
.figure-text{
  color:black;
  font-style: italic;
}


/*Text for Referennces*/

.references {
  font-size: 0.96rem;
}

.reference-number {
  font-weight: bold;
  color: #6f42c1; 
  margin-right:2px;
}

.reference-text {
font-weight: 500;
}

.references a{
  color: #533292; 
  text-decoration: underline;
  margin-left: 20px;
}

.individual-reference {
  margin-bottom: 10px;
  overflow-wrap: break-word;
  text-indent: -2em;
  padding-left: 2em;
}


/* Table CSS */
.tbody {
  font-size: 1.2rem
}

.thead {
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
}


/*Entrepreneurship accordion CSS*/

  /*new new new */
  .accordion {
    --bs-accordion-active-bg:#ffffff;
    --bs-accordion-border-color: rgb(73, 48, 103);
    --bs-accordion-border-width: 3px;
    --bs-accordion-btn-focus-box-shadow: white;
    --bs-accordion-active-color: black;
    
}

.accordion-item {
font-family: 'League Spartan', sans-serif;
font-optical-sizing: auto;
font-weight: 300;
margin-bottom: 2%;
font-size: 1.25rem;
}

.accordion-body h1, h2, h3, h4, h5, p {
  margin-bottom: 10px;
}




.accordion-body img {
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}


.accordion-item img {
  max-width: 100%;
}

.accordion-header {
font-family: 'League Spartan', sans-serif;
font-optical-sizing: auto;
font-weight: 600;
margin-bottom: 1.5%;
}

.accordion-button{
font-family: 'League Spartan', sans-serif;
font-optical-sizing: auto;
font-weight: 600;
font-size: 3rem;
}
  

.accordion-collapse {
  width:96%; 
  margin-left: auto; 
  margin-right:auto;
  font-size:1.25rem;
}




/*Sustainablity Cards CSS*/


.card {
  height: 38vh;
}
.card-title{
  font-size: 3rem;
}
.card-text{
font-size: 2rem;
}
.card-body img {
  max-width: 220px;
  margin-right: 3%;
  border-radius: 10px;
}

/*modal content */
.modal-dialog {
  min-width: 45vw; 

}
.modal-body {
  max-height: 60vh;  
  overflow-y: auto;
}

/* links */
.links {
  text-decoration: #6f3686 wavy underline ;
}

/* Button */
.hp-button{
  font-family: 'League Spartan', sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-size: 1.25rem;
  --bs-btn-padding-y: .3rem; --bs-btn-padding-x: .7rem;
}