/* Corporate */

#masterheader,
.card-header {
  clip-path: polygon(0 0, 100% 0%, 100% 96%, 98% 100%, 0 100%);
}


/* Animation on focus */

.focus {
  opacity: 0;
  transform: translateY(48px) scale(80%);
  transition: opacity 0.64s ease, transform 0.64s ease;
}

.focus.show {
  opacity: 1;
  transform: translateY(0) scale(100%);
}


/* Sections */

header,
main,
hgroup,
figure,
section,
article,
aside,
address,
footer,
#address {
  float: left;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

time {
  display: block;
  padding: 1rem 0;
}

#article h1,
#article h2,
#article h3,
#article h4,
#article h5,
#article h6 {
  color: var(--primary-color) !important;
  margin-bottom: .64rem !important;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { border: none !important; }

#article p:first-of-type {
  font-size: calc(1rem + 0.32vw) !important;
  text-decoration: none;
}

#article blockquote {
  clear: both;
  display: block;
  text-align: right;
  margin: 3rem 5rem 4rem;
}

#article blockquote q {
  display: block;
  font-family: inherit;
  font-weight: 300;
  font-size: 1.44rem;
  font-style: normal;
  line-height: 1.92;
  color: inherit;
}

#article blockquote cite,
#article blockquote cite a {
  float: right;
  width: inherit;
  font-family: var(--sans-serif);
  font-size: .8rem;
  font-weight: 300 !important;
  font-style: normal !important;
  line-height: 1.92;
  color: var(--font-color);
  border: none !important;
}

/*
Conflicts with buttons
#article a:link, #article a:visited {
  color: var(--text-color) !important;
  text-decoration: none !important;
  border-bottom: var(--primary-color) solid 1px;
}

#article a:hover {
  color: var(--primary-color) !important;
  text-decoration: none !important;
  border-bottom: var(--primary-color) solid 1px;
}
*/

#payoff {
  float: left;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  background-attachment: fixed;
}

/* Curve */

.curve {
  clip-path: ellipse(144% 100% at 32% 0%);
  transition: .48s;
}

@media (max-width: 768px) { 

  .curve {
      clip-path: ellipse(192% 100% at 32% 0%);
  }
  
}

.bg-paper {
  background: var(--gray-subtle) url("../assets/bg-paper.jpg") center scroll;
}

.card-header {
  background-blend-mode: overlay;
  background-color: transparent;
  transition: 1s;
}

.card:hover > .card-header {
  background-blend-mode: overlay;
  background-color: rgba(0, 0, 0, 0);
}


/* productcategories */

.Team {
  background-image: url("../images/bg-teamtraining-9.jpg");
  background-position: center center;
  background-size: cover;
}

.Medezeggenschap {
  background-image: url("../images/bg-medezeggenschap-9.jpg");
  background-position: center center;
  background-size: cover;
}

.Over {
  background-image: url("../images/bg-over-ons-1.jpg");
  background-position: center center;
  background-size: cover;
}

.Expertise {
  background-image: url("../images/bg-expertise-1.jpg");
  background-position: center top;
  background-size: cover;
}

.Kennisbank,
.OR-actueel {
  background-image: url("../images/bg-kennisbank-1.jpg");
  background-position: center top;
  background-size: cover;
}

.OR-training {
  background-image: url("../images/bg-training-1.jpg");
  background-position: center top;
  background-size: cover;
}

.Trainingsmodules {
  background-image: url("../images/bg-trainingsmodules-1.jpg");
  background-position: center top;
  background-size: cover;
}

.OR-trainer {
  background-image: url("../images/bg-trainers-1.jpg");
  background-position: center top;
  background-size: cover;
}

.OR-advies {
  background-image: url("../images/bg-advies-1.jpg");
  background-position: center top;
  background-size: cover;
}

.OR-coaching {
  background-image: url("../images/bg-coaching-1.jpg");
  background-position: center center;
  background-size: cover;
}

.OR-cursussen {
  background-image: url("../images/bg-cursussen-1.jpg");
  background-position: center top;
  background-size: cover;
}

.OR-trainingen {
  background-image: url("../images/bg-trainingen-1.jpg");
  background-position: center top;
  background-size: cover;
}

.OR-cursus,
.PVT-training {
  background-image: url("../images/bg-cursus-1.jpg");
  background-position: center top;
  background-size: cover;
}

.Contact {
  background-image: url("../images/bg-contact-1.jpg");
  background-position: center -3rem;
  background-size: cover;
}

.Error {
  background-image: url("../images/bg-error-1.jpg");
  background-position: center bottom;
  background-size: cover;
}


/* Courses */

.sm-basiscursus {
  background-image: url("../images/courses/sm-basiscursus.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-effectief {
  background-image: url("../images/courses/sm-effectief.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-invloedrijk {
  background-image: url("../images/courses/sm-invloedrijk.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-arbo {
  background-image: url("../images/courses/sm-arbo.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-financien {
  background-image: url("../images/courses/sm-financien.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-reorganisatie {
  background-image: url("../images/courses/sm-reorganisatie.jpg");
  background-position: center center;
  background-size: cover;
}
.sm-fusie {
  background-image: url("../images/courses/sm-fusie.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-inzetbaarheid {
  background-image: url("../images/courses/sm-inzetbaarheid.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-voorzitter {
  background-image: url("../images/courses/sm-voorzitter.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-bestuurder {
  background-image: url("../images/courses/sm-bestuurder.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-wor {
  background-image: url("../images/courses/sm-wor.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-pvt {
  background-image: url("../images/courses/sm-pvt.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-teambuilding {
  background-image: url("../images/courses/sm-teambuilding.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-adviestraject {
  background-image: url("../images/courses/sm-adviestraject.jpg");
  background-position: center center;
  background-size: cover;
}

.sm-maatwerk {
  background-image: url("../images/courses/sm-maatwerk.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-basiscursus {
  background-image: url("../images/courses/lg-basiscursus.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-effectief {
  background-image: url("../images/courses/lg-effectief.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-invloedrijk {
  background-image: url("../images/courses/lg-invloedrijk.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-arbo {
  background-image: url("../images/courses/lg-arbo.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-financien {
  background-image: url("../images/courses/lg-financien.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-reorganisatie {
  background-image: url("../images/courses/lg-reorganisatie.jpg");
  background-position: center center;
  background-size: cover;
}
.lg-fusie {
  background-image: url("../images/courses/lg-fusie.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-inzetbaarheid {
  background-image: url("../images/courses/lg-inzetbaarheid.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-voorzitter {
  background-image: url("../images/courses/lg-voorzitter.jpg");
  background-position: center bottom;
  background-size: cover;
}

.lg-bestuurder {
  background-image: url("../images/courses/lg-bestuurder.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-wor {
  background-image: url("../images/courses/lg-wor.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-pvt {
  background-image: url("../images/courses/lg-pvt.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-teambuilding {
  background-image: url("../images/courses/lg-teambuilding.jpg");
  background-position: center center;
  background-size: cover;
}

.lg-adviestraject {
  background-image: url("../images/courses/lg-adviestraject.jpg");
  background-position: center center;
  background-size: cover;
}

/* Animation */

.fadeIn {
  animation-name: fadeIn;
  animation-duration: 1.5s;
  animation-fill-mode: both;
}

@keyframes fadeIn {
  from {
      opacity: 0;
  }

  to {
      opacity: 1;
  }
}

@keyframes fadeInSlow {
  from {
      opacity: 0;
  }

  to {
      opacity: 1;
  }
}

.fadeInSlow {
  animation-name: fadeInSlow;
  animation-duration: 2s;
  animation-fill-mode: both;
}


.animated.bounceIn{
  animation-duration: .75s;
}

.bounceIn {
  animation-name: bounceIn;
  animation-duration: .5s;
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }

  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  animation-name: pulse;
  animation-duration: 1s;
}

@keyframes pulse {
  from {
    transform: scale3d(1, 1, 1);
  }

  50% {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

