:root {
	
  --dry-sage: hsla(90, 18%, 64%, 1);
  --baltic-blue: hsla(200, 99%, 30%, 1);
  --ash-grey: hsla(78, 17%, 73%, 1);
  --muted-teal: hsla(132, 20%, 61%, 1);
  --sea-green: hsla(148, 30%, 46%, 1);
  --shadow-grey: hsla(320, 17%, 17%, 1);

    /* 
	--cassiopeia-color-primary: #00ff00;	
    --cassiopeia-color-hover: #ff0000;	  
    --cassiopeia-color-link: #0000ff;
	*/
    --cassiopeia-color-primary: var(--baltic-blue);	
    --cassiopeia-color-link: var(--shadow-grey);	
    --cassiopeia-color-hover: var(--sea-green);
	

    --cassiopeia-font-family-body: "Roboto", sans-serif;
    --cassiopeia-font-family-headings: "Roboto", sans-serif;
    --cassiopeia-font-weight-headings: 600;
    --cassiopeia-font-weight-normal: 400;
    
    --blue: #0d6efd;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #d63384;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #198754;
    --teal: #20c997;
    --cyan: #0dcaf0;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-300: #dee2e6;
    --gray-400: #ced4da;
    --gray-500: #adb5bd;
    --gray-600: #6c757d;
    --gray-700: #495057;
    --gray-800: #343a40;
    --gray-900: #212529;
    --primary: #0d6efd;
    --secondary: #6c757d;
    --success: #198754;
    --info: #0dcaf0;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #212529;
    --primary-rgb: 13, 110, 253;
    --secondary-rgb: 108, 117, 125;
    --success-rgb: 25, 135, 84;
    --info-rgb: 13, 202, 240;
    --warning-rgb: 255, 193, 7;
    --danger-rgb: 220, 53, 69;
    --light-rgb: 248, 249, 250;
    --dark-rgb: 33, 37, 41;
    --white-rgb: 255, 255, 255;
    --black-rgb: 0, 0, 0;
    --body-color-rgb: 33, 37, 41;
    --body-bg-rgb: 255, 255, 255;
    --font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --body-font-family: var(--cassiopeia-font-family-body);
    --body-font-size: 1rem;
    --body-font-weight: 400;
    --body-line-height: 1.5;
    --body-color: #383838;
    /* --body-bg: #efefef; */
    /*--body-bg: #ACC8E5; */
	--body-bg: #E4EDF7
}

/*
wordt in versie 6.0 niet ondersteund...
@include media-breakpoint-up(sm) { ... }  576px
@include media-breakpoint-up(md) { ... }  768px,
@include media-breakpoint-up(lg) { ... }  992px
@include media-breakpoint-up(xl) { ... }  1200px
*/

footer div.mod-footer {
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  justify-content: space-between;
}
/* @include media-breakpoint-up(md) { */
@media (min-width: 768px) {
  footer div.mod-footer {
    flex-direction: row;    /* PC-weergave, modules in de voet naast elkaar. Mobiel-weergave, onder elkaar */
  }
}

/* @include media-breakpoint-down(lg) */
@media (max-width: 992px)  {
		div.grid-child.container-sidebar-right {
  		display: none; /* rechter kolom wordt standaard onder artikel geplaatst bij de mobiel weergave, door 'none' zijn de extra menu's niet meer zichtbaar.  */		
		}
		div.container-top-b, div.container-top-a {
  		display: none; /* verbergt module 'beleving-random' op de Viskussie pagina, alleen te zien als rij, niet als kolom op klein scherm */
		}
}
@media (min-width: 992px)  {	
		div.container-bottom-b {
  		display: none; /* verbergt module 'Snel naar' in de voet, die zit ook in de rechter kolom als 'hoofdmenu' */
		}	
}	

header.top-b {
	margin-bottom:0px;
}

ul.mod-articles-items {	
	margin-bottom:0px;
}
figure.newsflash-image {	
	margin-bottom: 0.5em;
}
ul.mod-articlesnews-horizontal{	
	margin-bottom: 0px;
}
	

.container-header {
position: relative;
z-index: 10;
background-color: rgb(193, 205, 207);
background-image: linear-gradient(135deg, var(--cassiopeia-color-primary) 0%, var(--cassiopeia-color-hover) 100%); 
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.03) inset;
}

/* CLASSIC BANNER */
.container-banner .banner-overlay {    
      height: max(300px, 45vh); /* by default is 50vh in Cassiopeia */
	  color: #fff;
}

#mod-custom125 {
/* clamp instelling */
/* minimum viewport width = 600 */
/* maximum viewport width = 1200 */
.display-4 {
  font-size: clamp(1.3rem, 0.443rem + 2.286vw, 2.5rem);
  margin-bottom: .3rem;
}
.lead {
  font-size: clamp(1.1rem, 0.814rem + 0.762vw, 1.5rem);
  margin-bottom: clamp(0.2rem, -0.371rem + 1.524vw, 1rem);  
 /* margin-bottom: 1rem; */
}
.overlay .text-thin::after {
  content: "";
  background: #fff;
  width: 60%;
  height: 2px;  
  margin-top: clamp(0rem, -0.2143rem + 0.9524vw, 0.5rem);
  margin-top: clamp(0.3rem, -0.057rem + 0.952vw, 0.8rem);
  margin-bottom: clamp(0.5rem, 0.2000rem + 1.3333vw, 1.2rem);
  /* margin-bottom: clamp(1rem, 0.643rem + 0.952vw, 1.5rem); */
  margin-right: auto;
  margin-left: auto;
  display: block;
}
.btn {
	margin-bottom: 0.2rem;
}
}

/* top cards */
/* geen achtergrond, alleen border om afbeelding */

div.top-a li, div.top-b li {
  /* background-color: #fff;	*/
  /* background-color: var(--ash-grey);	*/
}

.top-a img, .top-b img {
	border-style: solid;
	border-color: var(--secondary);
	border-width: 1px;
	border-radius: .25rem;	
}

/* top menu */

.header .grid-child.container-nav{
 padding-top: 0;
 padding-bottom: 0.5rem;
}
.container-header .navbar-brand {
 padding: 0;
}

.sidebar-right, .bottom-a.card, .bottom-b.card {
	background: var(--white) ;
}

/* Smart Search Results Pages */

li .result__taxonomy-item + .result__taxonomy--Author {
  display: none;
}
li .result__taxonomy-item + .result__taxonomy--Category {
  display: none;}
  

/* opmaak  */	

h1, .h1 {	
	font-size: clamp(1.5rem, 0.328rem + 3.125vw, 2.75rem);
}
h2, .h2 {
	font-size: clamp(1.3rem, 0.644rem + 1.75vw, 2rem);
}
h3, .h3 {
	font-size: clamp(1.2rem, 0.914rem + 0.762vw, 1.6rem)
}
h4, .h4 {
	font-size: clamp(1.1rem, 0.957rem + 0.381vw, 1.3rem);
}
h5, .h5 {
	font-size: clamp(1rem, 0.857rem + 0.381vw, 1.2rem);
}
h6, .h6 {
	font-size: 1.0rem; 
}
/* opmaak eerste paragraaf, fractie groter */

p.first {
    font-size: calc(1.1*var(--body-font-size));
	padding:0.4em 0;
	}

h2,  .contentheading {
  /* border-bottom: 1px solid #d4d4d4; */
  clear: left;
  /*  color: #83201a; */
  margin-bottom: 0.2em;
  padding-bottom: 0.1em;
  word-spacing: 0;
}


h3, .feed-link {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
}


/* ###################### contactformulier ###################### */

div.contact h3 {
      display: none;
    }

div.contact {
    background-color: #edf4f5;
    
    border: 1px solid #d4d4d4;   
    border-radius: 6px;
    
    overflow: hidden;
    padding: 5px;
}	
div.contact h2 {
	padding-left:10px;
	padding-right:10px;
}

form#contact-form {
	padding: 25px 10px 10px ;
}

form#contact-form legend {
    background-color: #e0ffff;
    border: 1px solid #adadad;
    padding-left: 4px;
    padding-right: 4px;
  	position: relative;
  	top: -30px;
}

form#contact-form  fieldset {
    background-color: #66ffe1;
    border: 1px solid #adadad;
    padding:10px; 
}

form#contact-form  legend {
      font-size: 14px;
      line-height: 20px;
      padding: 5px;
      margin-bottom: 0px;
      width: 100%;
      margin-right:10px;
    }
    
form#contact-form .controls {
    margin-left: 0;
}
     
form#contact-form .control-label {
      padding-right: 5px;
      text-align: left;
      width: 150px;
    }
     
div.contact .form-horizontal .control-group {
      margin-bottom: 10px;
    }
     
div.contact .form-horizontal .form-actions {
      padding-left: 0;
    }
     
div.contact .form-actions {
      background: none;
      border-top: none;
      margin-bottom: 10px;
      margin-top: 10px;
      padding: 0;
    }

/* ###################### lijst opmaak met auto-nummering ###################### */

/* spiegelkarperproject */
/* Voortgangsverslag spiegelkarperproject 2011    */
/* Voortgangsverslag spiegelkarperproject 2008  - archief */

ol.overzicht {
	list-style-type: none; 
  counter-reset: ol-counter;
	list-style-position: outside; 
	font-family: Tahoma,Arial,Helvetica,sans-serif; 
	font-size: 1.0em; 
	float:right; 
	border:1px solid #ccc; 
	padding:5px; margin-left:10px; margin-bottom:5px; 
	background-color: #ece9d8; 
	}
	
ol.overzicht > li:before {
  content: counter(ol-counter);
  counter-increment: ol-counter;
   /* Position and style the number */
    position:absolute;
    top:-2px;
    left:-2em;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    width:2em;
    /* Some space between the number and the content in browsers that support
       generated content but not positioning it (Camino 2 is one example) */
    margin-right:8px;
    padding:4px;
    border-top:2px solid #666;
    color:#fff;
    background:#666;
    font-weight:bold;
    font-family:"Helvetica Neue", Arial, sans-serif;
    text-align:center;  
	}
	
ol.overzicht > li{
    position: relative;
    margin:0 0 6px 2em;
    padding:4px 8px; 
    border-top:2px solid #666;
    background-color: #d5d5d5;
}	

/* standaard border om  nieuwsflash-items voorpagina (positie top-a en top-b)*/

.no-card .newsflash-horiz li {
	border-style: solid;
	border-color: var(--secondary);
	border-width: 1px;
	border-radius: .25rem;	
}

.no-card .newsflash-horiz li {
	padding: 0 1rem 1rem;
}

/* standaard border om categorie afbeelding ( bestuur, jeugd en viskussie) */

.category-desc > img:nth-child(1) {
	border-style: solid;
	border-color: var(--secondary);
	border-width: 1px;
	border-radius: .25rem;	
}
/* @include media-breakpoint-down(sm) */
@media (max-width: 576px)  {
		div.category-desc {
  		display: none; /* verbergt categorie afbeelding op klein scherm */		
		}

}

/* centrering banners (beter: breedte van meerdere vertikale items gelijk maken) */

.mod-banners img {	
    display: block;
	margin-left:auto;
	margin-right:auto;
	/* float:right; */
}


/* wit-ruimte verlagen tussen banner en onder top-a banner */

.container-banner {
	margin-bottom: 0px;
}

.top-a div.card-body {
	padding-bottom: 0px;
}


/* alle afbeeldingen binnen artikelen met rand */
	
.com-content-article figure img {
	border-style: solid;
	border-color: var(--secondary);
	border-width: 1px;
	border-radius: .25rem;	
	margin-bottom:0.3rem;
}
