/* Nodig: de wrapper heeft overflow-x: hidden, en daardoor werkt sticky niet */
.outer-wrapper {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

/* Header vastzetten bovenaan */
#content-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  /* witte achtergrond over de volle breedte van het scherm */
  box-shadow: 0 0 0 100vmax #fff;
  clip-path: inset(0 -100vmax);
}



/* De knop rechts boven */

a.phonebutton.btn.btn-primary,
#dc_button {
  --bs-btn-bg: #A35D8B;
  --bs-btn-border-color: #A35D8B;
  --bs-btn-hover-bg: #8B4F76;
  --bs-btn-hover-border-color: #8B4F76;
  --bs-btn-active-bg: #824A6F;
  --bs-btn-active-border-color: #824A6F;
  background-color: var(--bs-btn-bg) !important;
  border-color: var(--bs-btn-border-color) !important;
  color: #fff !important;
  border-radius: 12px;
  padding: 10px 20px;
  margin-left: auto;          /* duwt de knop naar rechts */
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
a.phonebutton.btn.btn-primary:hover,
#dc_button:hover {
  background-color: var(--bs-btn-hover-bg) !important;
}
#dc_button svg { height: 30px; fill: #fff; }


#portal-anontools {display: none;}


/**** ADDIIONAL ****/

.post-info {display:none; }

.documentDescription { border-bottom: 1px solid #563D86 !important; color:  #563D86 !important;	padding-bottom: 0.5em;	margin-bottom: 1em;    font-weight: 200 !important; }
.card-title { color: #A35D8B! important; }


.h1, h1 {color: #706CDB!important; }
.h2, .h3, .h4, .h5, .h6, h2, h3, h4, h5, h6  {color: #A35D8B!important; }
.h2, h2 {font-size: 1.80rem !important;}
.h3, h3 {font-size: 1.65rem !important;}

table > tbody > tr > td, table { border: none; background: transparent !important; }
.feature-item i { display: none; }
.table > :not(caption) > * > *, table.invisible-grid > :not(caption) > * > *, table.plain > :not(caption) > * > *, table.listing-compact > :not(caption) > * > *, table.listing > :not(caption) > * > * {
  padding: 0.0rem 0.0rem ! important;}

 .offcanvas { --bs-offcanvas-bg: #4C4A96!important; }

.features2 { background: none !important;} 
.features4 div.feature-items { background: none !Important; }


body a.btn-primary  {
	// --bs-btn-bg: $plone-link-color;
	background: #6f6cdb !important; //WORKS
	border-color : darken( $plone-link-color, 5%);
}

/**** BACIC ****/

.formControls {background: #AEADFD !important; }

body { --bs-body-font-size: 1.1rem;}

#portal-siteactions a,
.colophonWrapper a { color: #0055A0;   text-align: center; }
#portal-siteactions,
#portal-siteactions li { display:  inline-block !important;	padding: 0;	text-align: center; }
#portal-siteactions li a {text-decoration: none !important;margin: 0 0.5rem;text-transform: uppercase;font-weight: 500;font-size: 14px;}
#portal-siteactions {display: block !important; margin: 2em auto; text-align: center; }

#portal-footer-wrapper {display: none !important}
#portal-footer-wrapper h2 { --bs-heading-color: white; color: white !important; }
footer#portal-footer-wrapper {background: #A35D8B !important; color: #FFFFFF }

div.colophonWrapper,
div.colophonWrapper ul, 
div.colophonWrapper li {width: 100%;text-align: center;opacity: 0.8;font-size: 12px;}

#content-header,
.doormat.row,
.doormat.row .col-xs-12,
.doormat h2 {color: white;text-align: left;font-size: 1.2rem; margin-bottom: 1em;}
.doormat.row {margin: auto; width: 100%; }

.mosaic-grid-row  {max-width: 1170px !important}
body .mosaic-grid-row.mosaic-grid-row-fluid { width: calc(100vw + 30px) !important; max-width: calc(100vw + 30px) !important; margin-left: -15px !important; margin-right: -15px !important} 
bod.mosaic-grid-row.mosaic-grid-row-fluid { width: calc(100vw + 30px)   !important; max-width: calc(100vw + 30px) !important; margin-left: -15px; margin-right: -15px}
body .mosaic-grid-row.mosaic-grid-row-fluid .mosaic-grid-row>*  { padding-left: 0; padding-right: 0}
@media (min-width: 1400px) {.mosaic-grid-row  {max-width: 1170px !important}


#content .mosaic-tile-content  h1.documentFirstHeading {font-weight: 400; margin-top: 20px; line-height: 160%; color: #A35D8B; }
#content .mosaic-tile-content  h1 {font-weight: 300; color: #A35D8B; }

#main-container  .btn { padding: 21px 21px; font-size: 16px; margin-top: 20px; margin-bottom: 20px; }
#main-container  .btn-primary { background-color: #6f6cdb; font-weight: 400; }