/* --------------------- Fonts --------------------- */
p{
  font-weight: 200;
}


/* --------------------- Algemeen --------------------- */

.title-sticky{
  position: sticky;
}

html {
  scroll-behavior: smooth;
}

.w-webflow-badge{
  display: none !important;
}

@keyframes header {
  0%   {height: calc( 90vh)}
  50%  {height: calc( 90vh)}
  75%  {height: calc( 80vh)}
  100% {height: calc( 80vh)}
}

section:last-child{
  margin-bottom: 200px;
}

/* --------------------- section 1 text-header--------------------- */

.section1{
  width: 100vw;
  height: calc( 80vh);
  width: 90vw;
  margin-left: 5vw;
  margin-top: -170px;

  display: flex;
  align-content: center;
  align-items: center;

  animation-name: header;
  animation-duration: 2s;
}


.section1 h1{
  text-align: center;
  font-weight: normal;
  width: 100%;
}

/* --------------------- section 2 lijn info header--------------------- */
.section2 {
  width: 90vw;
  margin-left: 5vw;
}

.section2 .info{
  width: 100%;

  display: flex;
  justify-content: space-between;
  align-items: center;
}

.info h3{
  font-size: 1.5em;
  line-height: unset;
}

.info a{
  padding: 7px 15px;
  border: 1px solid black;
  border-radius: 30px;
  margin-right: 20px;

  font-size: 0.8em;
}

.info a:last-child{
  margin-right: 0px;
}

.info{
  padding-top: 7px;
}


/* --------------------- section 3 foto-header--------------------- */

.section3 {
  width: 100vw;
  aspect-ratio: 16/9;

  background-color: aliceblue;
  margin-top: 5vh;
}

.section3 img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* --------------------- section 4 uitleg --------------------- */

.section4{
  width: 80vw;
  margin-left: 10vw;
  margin-top: 200px;
  margin-bottom: 200px;
}

/* --------------------- section 5 animatie--------------------- */

.section5{
  width: 80vw;
  margin-left: 10vw;
}


/* --------------------- section 6 --------------------- */


/* --------------------- section 7 --------------------- */

.section7{
  width: 80vw;
  margin-left: 10vw;
}

.section7 video{
  object-position: bottom;
}

/* --------------------- section 8 --------------------- */

.section8{

}

/* --------------------- section 9 --------------------- */

.section9{
  width: 80vw;
  margin-left: 10vw;
}


/* --------------------- section 10 --------------------- */

.section10{
  width: 80vw;
  margin-left: 10vw;
}

/* --------------------- section 10 --------------------- */

.section11{
  margin-top: 50px;
  width: 80vw;
  margin-left: 10vw;
}

/* --------------------- section 10 --------------------- */

.section12{
  width: 80vw;
  margin-left: 10vw;
}