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

/* 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:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }

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


/* custom */
div {
  padding-bottom: 0px;
  margin-bottom: 12px;
}

li {
  margin: 1px;
}

p {
  text-align: justify;
}

.container {
  padding-top: 12px;
  padding-bottom: 12px;
}

#bgDivvTeampage {
  display: flex;
  justify-content: center;
  box-sizing: border-box;
  cursor: url('https://static.igem.wiki/teams/5317/images/team/hydroguardian-transparent-40.png') 25 25, auto;
}

.people_pill {
  width: 100%;
  display: block;
  position: relative;
}

body {
  margin: 0;
  padding: 0;
  width: 100vw;
  overflow-x: hidden;
  padding-top: 56px;
}

.image-holder {
  position: relative;
  display: inline-block;
}

.cursor-area {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: url('https://static.igem.wiki/teams/5317/images/team/hydroguardian-transparent-60.png') 25 25, auto;
}

#galleryPhotos {
  display: none;
}

.imgol {
  position: relative;
  display: inline-block;
  cursor: url('https://static.igem.wiki/teams/5317/images/team/hydroguardian-transparent-60.png') 25 25, auto;
}

.btmimg {
  display: block;
  width: 100%;
  height: auto;
}

.topimg {
  display: block;
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
  /*cursor: pointer;*/
}

.imgol.active .topimg {
  opacity: 0.7;
}

.txtol {
  /*top: 0;*/
  /*left: 0;*/
  opacity: 0;
  transition: opacity 0.3s ease;
}

.txtol-team1 {
  /*top: 0;*/
  /*left: 0;*/
  opacity: 0;
  transition: opacity 0.3s ease;
}

.txtol-team2 {
  /*top: 0;*/
  /*left: 0;*/
  opacity: 0;
  transition: opacity 0.3s ease;
  justify-content: center;
  align-items: center;
}

.imgol.active .txtol {
  opacity: 1;
}

.imgol.active .txtol-team1 {
  opacity: 0.7;
}

.imgol.active .txtol-team2 {
  opacity: 1;
}

#footerLinks {
  opacity: 0;
}

#orderedGallery-1 {
  /*display: none;*/
  cursor: url('https://static.igem.wiki/teams/5317/images/team/hydroguardian-transparent-40.png') 25 25, auto;
}

#orderedGallery {
  /*display: none;*/
  cursor: url('https://static.igem.wiki/teams/5317/images/team/hydroguardian-transparent-40.png') 25 25, auto;
}

#carouselcont1 {
  display: flex;
}

.carousel {
  flex: 1;
  overflow: hidden;
}

.centerdiv {
  display: flex;
  align-items: center;
}

.sidebarmenu {
  position: absolute;
  /*top: 116px;*/
  /*bottom: 0;*/
  right: 0;
  overflow-y: auto;
  z-index: 3;
}

.sidebarmenu-fixed {
  position: fixed;
  z-index: 3;
  top: 116px;
  right: 0;
  overflow-y: auto;
}

.sbm-content {
  max-height: calc(100vh - 170px);
  overflow-y: auto;
}

.acc-button-sb {
  position: sticky;
  top: 0;
  z-index: 100;
}

#hydroGuardian {
  position: relative;
  z-index: 2;
}

.linkDiv {
  position: relative;
  z-index: 1;
}

#movingImgSus {
  position: absolute;
  /* z-index: 5; */
  /*top: 50%;*/
  /*left: 0;*/
  /*animation: moveAlongPath 10s linear infinite;*/
  /*transition: transform 0.5s ease;*/
  /*transform: translateY(-50%);*/
}

#movingImg {
  position: absolute;
  /*top: 50%;*/
  /*left: 0;*/
  /*animation: moveAlongPath 10s linear infinite;*/
  /*transition: transform 0.5s ease;*/
  /*transform: translateY(-50%);*/
}

.islandCont {
  position: relative;
  display: inline-block;
}

.islandOL {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*display: flex;*/
  /*justify-content: center;*/
  /*align-items: center;*/
  /*pointer-events: none;*/
}

.islandBG {
  display: block;
  width: 100%;
  height: auto;
  cursor: url('https://static.igem.wiki/teams/5317/images/home/lupe-surfing-hydroguardian-40x40px.png') 25 25, auto;
}

.headerBG {
  position: relative;
  display: inline-block;
}

.headerImg {
  display: block;
}

.headerOL {
  /*position: absolute;*/
  /*top: 0;*/
  width: 100%;
  height: 100%;
  /*width: auto;*/
  display: flex;
  justify-content: center;
  align-items: center;
}

.headerLogo {
  max-height: 90%;
  height: 80vh;
}

.headerRow {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}

#alteDescription {
  display: none;
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.photoHeader {
  position: relative;
  background: none;
}

.headerCont::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(176,218,241);
  /*background-position: bottom;*/
  /*background-size: cover;*/
  opacity: 0.5;
  z-index: -1;
}

#descriptionHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/discription/foto-discription.png');
  background-position: bottom;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#attributionHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/attributions/attributions-foto-von-pexels-2.jpg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#implementationHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/implementation/implementation-foto.png');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#notebookHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/notebook/notebook.jpeg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#safetyHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/safety/safety-foto.jpeg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#spectroscopyHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/spectroscopy-analysis/spectroscopy-analysis-foto.jpeg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#sponsorsHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/sponsoren/stock-foto-sponsoren-von-pexels-1.jpg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#modelHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/model/foto-model.jpeg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#contributionHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/contribution/foto-contribution.png');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#sustainableHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(176, 218, 241, 0.5), rgba(176, 218, 241, 0.5)), url('https://static.igem.wiki/teams/5317/images/header/sustainable/sdg-alternativ-hintergrund-4.png');
  background-blend-mode: normal;
  background-position: center;
  background-size: cover;
  /*opacity: 0.5;*/
  z-index: -1;
}

#videosHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/video/foto-video.jpeg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#resultsHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/results/foto-results.png');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#experimentsHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/experiments/experiments.png');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#engineeringHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/engineering/engineering-alternativ-foto-1.png');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#mcHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/award/pexels-nietjuh-796607.jpg');
  background-position: center;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#educationHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/education/foto-education.png');
  background-position: bottom;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

#hpHeader::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://static.igem.wiki/teams/5317/images/header/human-practices/human-practices-foto-kleiner.jpg');
  background-position: top;
  background-size: cover;
  opacity: 0.5;
  z-index: -1;
}

.headerCont {
  position: relative;
}

.sponsor-logo {
  cursor: pointer;
}

.background-left {
  left: 0;
}

.insel_sus {
  display: flex;
  justify-content: center;
  align-items: center;
}

.accordion-item {
  width: auto;
}

.sbm_nav-item {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

.sbm_nav-link {
  padding: 4px;
  text-align: center;
  width: 100%;
}

.sbm_nav-tabs {
  padding-left: 0;
}

.sbm_acc-body {
  padding: 0;
}

.island_img {
  cursor: url('https://static.igem.wiki/teams/5317/images/home/lupe-surfing-hydroguardian-60x60px.png') 25 25, auto;
}

.summaryHG {
  display: flex;
  justify-content: center;
  align-items: center;
}

.full-width-link {
  display: inline-block;
  width: 100%;
  text-align: justify;
  word-wrap: break-word;
  text-align-last: left;
}

@keyframes glitter {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.glitter-box {
  position: relative;
  overflow: hidden;
  /*border-radius: 10px;*/
  /*background: rgb(255, 245, 191);*/
  /*color: rgb(127, 107, 0);*/
  /*z-index: 1;*/
}

.glitter-box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*top: -8px;*/
  /*left: -8px;*/
  /*width: calc(100% + 16px);*/
  /*height: calc(100% + 16px);*/
  /*border-radius: 10px;*/
  /*border: 8px solid transparent;*/
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.0) 30%, rgba(255, 255, 255, 0.9) 40%, rgba(255, 255, 255, 0.0) 80%);
  background-size: 400% 400%;
  animation: glitter 7s ease infinite;
  pointer-events: none;
  /*z-index: 1;*/
}

.glitter-box > * {
  position: relative;
  z-index: 2;
}



.pdf-container {
  width: 100%; /* Full width */
  max-width: 100%; /* Prevents it from exceeding the container */
  height: 100vh; /* Sets height to full viewport height (optional) */
}

/* #startPath{
  position: fixed;
} */