@font-face {
  font-family: BorisBlackBloxx;
  src: url(./assets/BorisBlackBloxx.ttf);
}
@font-face {
  font-family: Coolvetica;
  src: url(./assets/TangoSans.ttf);
}
@font-face {
  font-family: Coolvetica;
  src: url(./assets/TangoSans_Bold.ttf);
  font-weight: bold;
}
:root {
  --bg-color: #58D9C8;
}
html, body {
  background: var(--bg-color);
  color: #003737;
  font-family: Coolvetica;
}
h2,h4, .eddfont {
  font-family: BorisBlackBloxx;
}
header {
  background: linear-gradient(179deg, #00DA9F, var(--bg-color));
}
footer {
  color: white;
}
nav {
  z-index: 999;
  background: var(--bg-color);
}
header #logo {
  width: max(300px, 40vw);
}
header #logo.min {
  width: 250px;
}
.btn-primary, .bg-primary {
  border-color: transparent !important;
  background: #148360 !important;
}
.btn-primary:hover, .btn-primary:active {
  border-color: #148360 !important;
  background: #00DA9F !important;
}
#team {
  min-height: 70vh;
  background: url(./assets/EDD_MOTIF.png);
  background-size: 1200px;
  background-attachment: fixed;
}
#team .d-flex img {
  transition: transform .5s;
  height: 400px;
}
#team .d-flex img:hover {
  transform: translateY(-10px) scale(1.02);
}
#test_electoral {
  right: 10px;
  z-index: 1000;
}
#test_electoral div {
  transform: translate(30px, -20px);
}
.eddstory {
  transform: translateY(200px);
  transition: transform .5s;
}
.eddstory.shown {
  transform: translateY(0);
}
.eddstory div.animated {
  background: linear-gradient(18deg, #ee7752, #bf3ce7, #88eeee, #00DA9F);
	background-size: 400% 400%;
  animation: storyanim 5s infinite;
}
.videoContainer {
  width: 80vw;
}
@media screen and (min-width: 990px) {
  section#intro {
    padding-left: 10vw !important;
    padding-right: 10vw !important;
  }
  .eddstory {
    transform: translateY(0);
    position: relative !important;
  }
  div.presentation {
    max-width: 45%;
  }
  .videoContainer {
    width: 45vw;
  }
}
@keyframes storyanim {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
.timebar {
  height: 10px;
  background: white;
}
.timebar > div.animate {
  background: #aad5dc;
  animation: timebar 7.8s linear forwards;
}
@keyframes timebar {
	0% {
		max-width: 100%;
	}
	100% {
		max-width: 0;
	}
}