:root {
  --dark-purple: #DAD6ED;
  --light-purple: #E5DFEB;
  --nav-bg: #ECE8F6;
  --dark-blue: #2C4182;
  --copper-orange: #bf850f;
  --light-blue: #30bbdc;
}

a:not(.btn) { color: var(--dark-blue) }
body { background-color: var(--light-purple) }
#nav-container { background-color: var(--nav-bg); border-bottom: 0; }
.btn-inloggen-login, .btn-primary { background: var(--copper-orange); color: white !important; border-radius: 4px; }
.btn-inloggen-login { border-color: #222 !important }
.btn-inloggen-login:hover, .btn-primary:hover { background: #ae740e }
.btn { border-radius: 4px !important }
.btn-info { background: var(--dark-blue); color: white !important; border-radius: 4px; }
.btn-info:hover { background: #1b3071; }
#footer { background-color: var(--dark-purple); padding: 0; min-height: auto; }
#copyright { background-color: transparent }
.bericht { background-color: var(--light-purple); box-shadow: 0 -2px 6px -1px rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,01,.12) !important; border-radius: 4px; border: 1px solid var(--dark-purple); }
.foot-event a:hover { color: #444 }
#copy-center a:hover { color: #444 }
#copy-right a:hover { color: #444 }
.foot-event { border-bottom: var(--dark-blue) }
.bericht-foto a:hover { background-color: rgba(218,214,237, 0.5) }

@media (min-width: 1200px) {
  #nav > li > a { padding-left: 20px; padding-right: 20px }
}

#logo { text-align: left; background: transparent; padding-left: 0; padding-right: 0; }
#logo h3 { color: white; font-size: 2rem; background: #2C4182; background: linear-gradient(240deg,rgba(44, 65, 130, 0) 0%, rgba(44, 65, 130, 1) 90%); padding: 20px 40px; font-weight: normal; margin-top: 20px; margin-bottom: 10px; border-radius: 4px; }
#logo h4 { color: white; padding: 0 40px; border: none; font-weight: normal; text-shadow: 1px 1px 0 #000; }

.card { background-color: var(--light-purple); box-shadow: 0 -2px 6px -1px rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,01,.12) !important; border-radius: 4px; border: 1px solid var(--dark-purple); }
.card .card-title { padding: 10px 15px; border-top-right-radius: 4px; border-top-left-radius: 4px; border: 0; margin-bottom: 0;}
.card .card-title:not(.no-bg) {  background: var(--dark-blue); color: white; }
.card .card-title.no-bg { color: var(--dark-blue); font-weight: bold; }
.card.card-orange .card-title {  background: var(--copper-orange); color: white; }

#landing-container { background-image: url("/themes/63c82113cb9997e9fc1e78b1/stylesheets/images/hero.png") !important; /*background-position: top center; background-attachment: inherit; height: 550px*/ }

.nav-fixed #nav > li > a { padding-left: 20px !important; padding-right: 20px !important }
#nav > li#nav-viag > a { padding-top: 0 !important; padding-bottom: 0 !important; }
#nav > li#nav-viag > a img { height: 79px !important; margin-top: 0 !important; }
.nav-fixed #nav > li#nav-viag > a { padding-top: 0 !important; padding-bottom: 0 !important; }
.nav-fixed #nav > li#nav-viag > a img { height: 50px !important }

.shadowed { box-shadow: 0 -2px 6px -1px rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,01,.12) !important }

.card-body p { font-size: inherit; color: inherit }

#nav > li > a:hover { background-color: var(--dark-purple); }
#nav > li.active > a { background-color: var(--dark-purple) }

#nav > li#nav-lid-worden > a { background-color: var(--copper-orange); color: white !important; padding: 6px 8px; border-radius: 4px; border: 1px solid black; margin-left: 5px }
#nav > li#nav-lid-worden > a:hover { background: #ae740e; color: white; }

@media (min-width: 1200px) {
  #nav > li#nav-lid-worden > a { padding: 12px 18px; }
}

.tekst h3 {
  color: var(--dark-blue);
}

.tekst form, .new-contact {
  background: var(--light-purple);
  border-color: var(--dark-purple);
  border-radius: 4px;
}

.devent-subtitel {
  background-color: var(--dark-purple);
  color: black;
}

#pagina-banner h1 {
  color: var(--dark-blue);
}

#partners a {
  float: left;
  margin: 5px;
  padding: 5px;
  background: white;
  height: 66px;
  border-radius: 4px;
}

#partners img {
  max-height: 56px;
}