/* overwrite stylesheet for videncenter subsite */

.videncenter-page .nav {
  background-color: #F4F1EA;
  color: #1B4D3E;
}

.videncenter-page .main-menu__item { color: #1B4D3E;}
.videncenter-page .main-menu__marker { background-color: #1B4D3E;}
.videncenter-page .main-menu { border-top: 1px solid #c6c4c0; }

.videncenter-page .theme--local.theme-dpf .spot-image::after {  
  background-color: #1B4D3E; }
.videncenter-page .theme--local.theme-viden-alt .spot-image::after {  
  background-color: #6A754A; }

.videncenter-page .theme--local.theme-dpf a.button, 
.videncenter-page .theme--local.theme-dpf .button {
  background-color: #1B4D3E;
}

.videncenter-page .theme--local.theme-viden-alt a.button, 
.videncenter-page .theme--local.theme-viden-alt .button {
  background-color: #6A754A;
}

.videncenter-page .footer {
  background-color: #f4f1ea;
}

.videncenter-page .swiper-module--background-light::after,
.videncenter-page .contact-list-item,
.videncenter-page .nav-box,
.videncenter-page .fact-box__wrapper.-people,
.videncenter-page .search-list-item {
  background-color: #f4f1ea;
  color: black;
}

.videncenter-page .carousel-courses__slide,
.videncenter-page .cta-banner__wrapper {
  background-color: #1B4D3E;
}

.videncenter-page .fact-box__wrapper,
.videncenter-page .foldout-box__wrapper {
  background-color: #6A754A;
  color: white; 
}

.videncenter-page .accordion__item.open .accordion__item-question, 
.videncenter-page .accordion__item.open .accordion__item-answer {
  background-color: #f4f1ea;
}

.videncenter-page .foldout-box__wrapper::after {
  background: linear-gradient(to top, rgb(200, 208, 199) 0%, 
  rgba(200, 208, 199, 0.738) 19%, 
  rgba(200, 208, 199, 0.541) 34%, 
  rgba(200, 208, 199, 0.382) 47%, 
  rgba(200, 208, 199, 0.278) 56.5%, 
  rgba(200, 208, 199, 0.194) 65%, 
  rgba(200, 208, 199, 0.126) 73%, 
  rgba(200, 208, 199, 0.075) 80.2%, 
  rgba(200, 208, 199, 0.042) 86.1%, 
  rgba(200, 208, 199, 0.021) 91%, 
  rgba(200, 208, 199, 0.008) 95.2%, 
  rgba(200, 208, 199, 0.002) 98.2%, 
  rgba(200, 208, 199, 0) 100%);
}

.videncenter-page .wysiwyg p a, 
.videncenter-page .wysiwyg ul a, 
.videncenter-page .wysiwyg ol a, 
.videncenter-page .wysiwyg table {
  border-color: #1B4D3E;
}

.videncenter-page .button { background-color: #1B4D3E; }

.videncenter-page .brandboxes__item .brand-box.theme-dpf.theme--local {
  background-color: #1B4D3E;
  color: white;
}
.videncenter-page .brandboxes__item .brand-box.theme-dpf.theme--local .button {
  background-color: white;
  color: #000;
}

.videncenter-page .brandboxes__item:nth-child(3n-1) .brand-box.theme-dpf.theme--local {
  background-color: #6A754A;
  color: white;
}
.videncenter-page .brandboxes__item:nth-child(3n-1) .brand-box.theme-dpf.theme--local .button {
  background-color: white;
  color: #000;
}

.videncenter-page .brandboxes__item:nth-child(3n) .brand-box.theme-dpf.theme--local {
  background-color: #F7B6A3;
  color: #1B4D3E;
}
.videncenter-page .brandboxes__item:nth-child(3n) .brand-box.theme-dpf.theme--local .button {
  background-color: #1B4D3E;
  color: white;
}

/* videncenter font changes */

.videncenter-page .ts-h1 { font-family: "IBM Plex Sans",Tahoma,sans-serif; }
.videncenter-page .ts-h2 { font-family: "IBM Plex Sans",Tahoma,sans-serif; }
.videncenter-page .ts-h3 { font-family: "IBM Plex Sans",Tahoma,sans-serif; }
.videncenter-page .button { font-weight: 500; padding: 12px 40px; }


/* videncenter hero */

.videncenter-hero {
  background-color: #1B4D3E;
  padding: 130px 0 30px;
}

.videncenter-hero .ts-h1 {
  font-size: 2.8rem;
  line-height: 1.2;
  -moz-hyphens: none;
  hyphens: none;
  letter-spacing: 1px;
}

.videncenter-hero figure {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  z-index: 1;
}

.videncenter-hero .hero__boxed_content {
  background-color: #F4F1EA;
  border-radius: 10px;
  color: #1B4D3E;
  position: relative;
  box-shadow: -35px -40px 0px 1px #F7B6A3;
} 

.videncenter-hero .button {
  background-color: #F4F1EA;
  color: #1B4D3E;
}

/* hero responsive */

@media screen and (max-width: 766px) {

  .videncenter-hero {
    display: flex;
    flex-direction: column;
    padding: 90px 0 0;
  }

  .videncenter-hero figure {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    margin-top: 25px;
  }

  .videncenter-hero .flex-grid.hero__content {
    padding: 0 10px 0 47px;
  }

  .videncenter-hero .mb8 {
    margin-bottom: 40px;
  }

}
