/* BEGIN definitie standaard kleuren voor Paulus Ludger ======================================= */
:root {
  --pl-blauw:         #004282;
  --pl-blauw50:       #7fa0c0;
  --pl-blauw25:       #bfd0e0;

  --pl-geel:          #ffd503;
  --pl-geel50:        #ffea81;
  --pl-geel25:        #fff4c0;

  --pl-groen:         #45812b;
  --pl-groen50:       #a2c095;
  --pl-groen25:       #d0dfca;

  --pl-wit:           #ffffff;
  --pl-lichtgrijs:    #eeeeee;
  --pl-donkergrijs:   #303030;
  --pl-zwart:         #000000;

/*  --pl-bg-artikelkort: var( --pl-geel25 ); */
/*  --pl-bg-artikelkort: var( --pl-groen25 ); */
  --pl-bg-artikelkort: var( --pl-lichtgrijs ); 
  --pl-bg-balk:        var( --pl-groen );

  --pl-optie-inactief:       var( --pl-groen);
  --pl-optie-inactief-tekst: var( --pl-wit);
  --pl-optie-actief:         var( --pl-geel);
  --pl-optie-actief-tekst:   var( --pl-zwart);
}
/* EINDE definitie standaard kleuren voor Paulus Ludger ======================================= */
body {
  background-color: var( --pl-geel25 );
}

/* alle kopteksten zijn --pl-blauw */
h1,
h2,
h3,
h4,
h5,
h6  {
  color: var( --pl-blauw );
}

/* BEGIN opmaak IMG in paragraaf ======================================= */
p > img {
  padding: 5px;
}

/* EINDE opmaak IMG in paragraaf ======================================= */

/* BEGIN opmaak (gekleurde) bovenbalk ======================================= */
.container-header {
  position: relative;
  z-index: 10;
  background-color: var( --pl-bg-balk );
  background-image: none;
  box-shadow: 0 0;
}
/* EINDE opmaak gekleurde bovenbalk ======================================= */

/* BEGIN opmaak hoofdmenu ======================================= */
div .navbar {
  justify-content: flex-start;
}

.container-header .grid-child {
  padding-top: 0;
}

.container-header .container-nav nav {
  margin-top: 0;
}

.container-header nav {
  margin-top: 0;
  line-height: 16px;
}

.container-header .container-nav {
  padding-bottom: .25em;
}

.metismenu.mod-menu .metismenu-item {
  color: var( --pl-optie-inactief-tekst );
  background-color: var( --pl-optie-inactief);
  border-style: solid;
  border-width: 2px 4px 2px 4px;
  border-color: var( --pl-bg-balk ); /* bordercolor is gelijk aan backgroundcolor */
  border-radius: .5em;
  text-decoration: none;
  padding: 4px 8px 4px 8px;   /* ruimte rond de buttons in menu balk */
  line-height: 1.25;
/*  align-items: center; */
}

.metismenu.mod-menu .metismenu-item.active {
  color: var( --pl-optie-actief-tekst );
  background-color: var( --pl-optie-actief );
  border-style: solid;
  border-width: 2px 4px 2px 4px;
  text-decoration: none;
}

.metismenu.mod-menu .metismenu-item > a {
  color: var( --pl-optie-inactief-tekst );
  background-color: var( --pl-optie-inactief);
  border-style: none;
  text-decoration: none;
}

.metismenu.mod-menu .metismenu-item.active > a {
  color: var( --pl-optie-actief-tekst );
  background-color: var( --pl-optie-actief );
  border-style: none;
  text-decoration: none;
}

.metismenu.mod-menu .mm-collapse {
  background-color: var( --pl-bg-balk );
}

.navbar-toggler {
  background-color: var( --pl-optie-inactief );
}

/* EINDE opmaak hoofdmenu ======================================= */


/* BEGIN opmaak Noodwacht ======================================= */

.noodwacht {
  margin-top: 20px;
}
/* EINDE opmaak Noodwacht ======================================= */

/* BEGIN opmaak Aanmelden nieuwsbrief ======================================= */
.nieuwsbrief {
  background-color: var( --pl-groen );
}

.nieuwsbrief p a {
  color: var( --pl-wit );
  text-decoration: none
}
/* EINDE opmaak Aanmelden nieuwsbrief ======================================= */

/* BEGIN opmaak voor de nieuwsheaders ======================================= */
.nieuws {
  background-color: var( --pl-geel25 );
}

.nieuws .card-header,
.nieuws .card-body {
  background-color: var( --pl-geel25 );
  border-bottom: solid 1px;
  border-bottom-color: var( --pl-groen );
}

.nieuws h3 {
  color: var( --pl-groen );
}

.nieuws a {
  color: var( --pl-donkergrijs );
  font-weight: 700;
}
/* EINDE opmaak voor de nieuwsheaders ======================================= */

/* BEGIN opmaak nieuwsflits ======================================= */
.nieuwsflits { /* geen border rond blok van nieuwsflitsen */
  border: none;
  background-color: var( --pl-geel25 );
}

.nieuwsflits .card-body { /* geen padding rond nieuwsflitsen */
  padding: 8px;
}

.nieuwsflits .mod-articlesnews__item { /* instellingen voor lijn onder item */
/*  border-bottom: solid 2px; */
/*  border-color: var( --pl-geel ); */
  margin-bottom: 8px;
}

/* EINDE opmaak nieuwsflits ======================================= */

/* BEGIN opmaak blog ======================================= */
/* omdat padding niet lukt is er een border geplaatst met dezelfde kleur als de achtergrond */
.blog-item {
  background-color: var( --pl-bg-artikelkort );
  height: 400px;
  border-width: 1em;
  border-style: solid;
  border-color: var( --pl-bg-artikelkort );
  mask-image: linear-gradient(180deg, #000 70%, transparent);
}

/* .com-content-category-blog {
  padding: 10px;
  margin: 20px;
}
*/

.blog-item a {
  text-decoration: none;
  color: var( --pl-blauw );
}
/* EINDE opmaak blog ======================================= */


/* BEGIN opmaak locatiemenu ======================================= */
.locatiemenu {
  background-color: var( --pl-wit );
  border: none;
}

.locatiemenu .card-header,
.locatiemenu .card-body {
  background-color: var( --pl-wit );
  padding: 0;
  border: none;
}

.locatiemenu .card-header {
  padding-bottom: 5px;
}

.locatiemenu .metismenu.menu-horizontal {
  flex-wrap: wrap;
  background-color: white;
  padding: 12px;
}

.locatiemenu .metismenu.mod-menu .metismenu-item {
  color: var( --pl-optie-inactief-tekst );
  background-color: var( --pl-optie-inactief );
  border-style: solid;
  border-width: 2px 4px 2px 4px;
  border-color: white;
  border-radius: .5em;
  text-decoration: none;
}

.locatiemenu .metismenu.mod-menu .metismenu-item.current {
  color: var( --pl-optie-actief-tekst );
  background-color: var( --pl-optie-actief );
  border-style: none;
  text-decoration: none;
}

.locatiemenu .metismenu.mod-menu .metismenu-item > a {
  color: var( --pl-optie-inactief-tekst );
  background-color: var( --pl-optie-inactief );
  border-style: none;
  text-decoration: none;
}

.locatiemenu .metismenu.mod-menu .metismenu-item.current > a {
  color: var( --pl-optie-actief-tekst );
  background-color: var( --pl-optie-actief );
  border-style: none;
  text-decoration: none;
}

.locatiemenu .metismenu.mod-menu .metismenu-item:not(.level-2) > ul {
  background-color: var( --pl-wit );
}

.locatiemenu .metismenu.mod-menu .metismenu-item.active > button,
.locatiemenu .metismenu.mod-menu .metismenu-item > button  {
  text-decoration: none;
}

/* EINDE opmaak locatiemenu ======================================= */

/* BEGIN opmaak image-ovz ======================================= */
.image-ovz-4kolom img {
  padding: 8px;
  transition-duration: .5s;
  width: 24.5%; 
}

.image-ovz-4kolom img:hover {
  padding: 0 2px 0 2px;
}

.image-ovz-3kolom img {
  padding: 8px;
  transition-duration: .5s;
  width: 33%;
}

.image-ovz-3kolom img:hover {
  padding: 0 2px 0 2px;
}

/* EINDE opmaak image-ovz ======================================= */

/* BEGIN fading kop ======================================= */
.PL-balk-geel {
  float: left;
  width: 100%;
  border-bottom: solid 5px; 
  border-bottom-color: var( --pl-groen );
}

.PL-animate-fading {
  animation: PL-fading 10s infinite
}

@keyframes PL-fading {
  from {opacity:0}
  20%  {opacity:1}
  80%  {opacity:1}
  to   {opacity:0}
}
/* EINDE fading kop ======================================= */

/* BEGIN verwijderen verticaal menu ======================= */
@media (min-width:768px) and (max-width:992px) {
.container-header .mod-menu {
display:flex;
flex: 1 1 0%;
flex-direction: row
}
}
/* EINDE verwijderen verticaal menu ======================= */

/* BEGIN opmaak footer ======================================= */
.footer {
  position: relative;
  z-index: 10;
  background-color: var( --pl-bg-balk );
  background-image: none;
  box-shadow: 0 0;
}

.footer .grid-child {
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: center;
  flex: 0;
  display: block;
}

/* EINDE opmaak footer ======================================= */

/* BEGIN opmaak Zoeken ======================================= */

div .zoeken .card-body {
  background-color: var( --pl-groen );
}

div .zoeken .card-body button,
.form-inline button {
  background-color: var( --pl-blauw );
  border-style: groove;
  border-width: 2px;
  border-color: var( --pl-lichtgrijs );
}

/* EINDE opmaak Zoeken ======================================= */

/* BEGIN opmaak JEvents ======================================= */

a .ev_link_row 
a .ev_link_row:visited {
  font-size: 16px;
  color: var( --pl-blauw );
}

/* EINDE opmaak JEvents ======================================= */