/* ==========================================================================
   Hervormde Gemeente Waarder - REDESIGN (sandbox)
   Wordt alleen geladen als de redesign-modus aan staat (?redesign=aan).
   De oude style.css wordt dan NIET geladen; bootstrap 3 en font-awesome wel.

   Kleuren:
   navy diep   #0E2A49    navy       #14375E    navy zacht  #3F5F86
   oranje      #DE7A18    oranje don #C4670E
   tekst       #465C74    tekst licht #6B7F95
   achtergrond #F2F7FC    rand       #E4EBF3    cirkel      #EAF1F8
   ========================================================================== */

/* --- 1. Basis ----------------------------------------------------------- */

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	position: relative;
	min-height: 100%;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	padding: 0;
	background: #F1F7FB;
	color: #465C74;
	font-family: 'Figtree', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img {
	max-width: 100%;
	height: auto;
	border: 0;
}

a {
	color: #14375E;
	text-decoration: none;
	-webkit-transition: color .15s ease;
	transition: color .15s ease;
}
a:hover,
a:focus {
	color: #DE7A18;
	text-decoration: none;
}

:focus {
	outline: 0;
}
a:focus-visible,
button:focus-visible,
input:focus-visible {
	outline: 2px solid #DE7A18;
	outline-offset: 2px;
}

h1, h2, h3, h4, h5, h6 {
	color: #14375E;
	font-weight: 600;
	margin: 0 0 .5em;
	line-height: 1.25;
}

hr {
	border: 0;
	border-top: 1px solid #E4EBF3;
	margin: 28px 0;
}

.rd-container {
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 28px;
}

.rd-skip {
	position: absolute;
	left: -9999px;
}
.rd-skip:focus {
	left: 12px;
	top: 12px;
	z-index: 3000;
	background: #14375E;
	color: #fff;
	padding: 10px 16px;
	border-radius: 6px;
}

/* --- 2. Sandbox-balk ---------------------------------------------------- */

.rd-sandbox {
	background: #0E2A49;
	color: #B9CBDF;
	font-size: 12.5px;
	letter-spacing: .02em;
	text-align: center;
	padding: 7px 16px;
}
.rd-sandbox strong {
	color: #fff;
	font-weight: 600;
}
.rd-sandbox a {
	color: #F0A860;
	border-bottom: 1px solid rgba(240,168,96,.4);
	margin-left: 4px;
}
.rd-sandbox a:hover {
	color: #fff;
	border-color: #fff;
}

/* --- 3. Header ---------------------------------------------------------- */

.rd-header {
	background: #fff;
	border-bottom: 1px solid #E7EEF6;
	position: relative;
	z-index: 1000;
}
.rd-header .rd-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.rd-logo {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 16px 0;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}
.rd-logo img {
	width: 62px;
	height: 62px;
	margin-right: 16px;
}
.rd-logo span {
	display: block;
	color: #14375E;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -.01em;
}

/* navigatie (gegenereerd door Inhoud->Menu('GoListed','hoofdmenu')) */

.rd-nav {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	min-width: 0;
	/* geen overflow:hidden - dat knipt de uitklapmenu's af. De breedte wordt
	   met javascript verdeeld over de balk en het "Meer"-menu. De balk is even
	   verborgen zodat je die verdeling niet ziet gebeuren; mocht het script
	   niet draaien, dan zet de animatie hem na 1,2s alsnog zichtbaar. */
	visibility: hidden;
	-webkit-animation: rd-nav-toon 0s linear 1.2s forwards;
	animation: rd-nav-toon 0s linear 1.2s forwards;
}
@-webkit-keyframes rd-nav-toon {
	to { visibility: visible; }
}
@keyframes rd-nav-toon {
	to { visibility: visible; }
}
.rd-nav.rd-klaar {
	visibility: visible;
	-webkit-animation: none;
	animation: none;
}
.rd-nav #navigation {
	display: block;
}
.rd-nav ul#nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
}
.rd-nav ul#nav > li {
	position: relative;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	list-style: none;
}
.rd-nav ul#nav > li > div > a,
.rd-nav ul#nav > li > a {
	display: block;
	padding: 32px 13px;
	color: #35506F;
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap;
	position: relative;
}
.rd-nav ul#nav > li > div > a:after {
	content: '';
	position: absolute;
	left: 13px;
	right: 13px;
	bottom: 24px;
	height: 2px;
	background: #DE7A18;
	opacity: 0;
	-webkit-transform: scaleX(.4);
	transform: scaleX(.4);
	-webkit-transition: opacity .18s ease, transform .18s ease;
	transition: opacity .18s ease, transform .18s ease;
}
.rd-nav ul#nav > li:hover > div > a,
.rd-nav ul#nav > li.selected > div > a {
	color: #DE7A18;
}
.rd-nav ul#nav > li:hover > div > a:after,
.rd-nav ul#nav > li.selected > div > a:after {
	opacity: 1;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

/* uitklapmenu's */
.rd-nav ul.submenu,
.rd-nav ul.sub2menu {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rd-nav ul#nav > li > ul.submenu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 260px;
	max-width: 340px;
	background: #fff;
	border: 1px solid #E7EEF6;
	border-radius: 12px;
	box-shadow: 0 18px 44px rgba(14, 42, 73, .13);
	padding: 10px 0;
	margin-top: -12px;
	z-index: 1200;
}
.rd-nav ul#nav > li:hover > ul.submenu {
	display: block;
}
.rd-nav ul#nav > li:last-child > ul.submenu,
.rd-nav ul#nav > li.rd-meer > ul.submenu {
	left: auto;
	right: 0;
}
.rd-nav ul.submenu > li > a {
	display: block;
	padding: 8px 20px;
	color: #35506F;
	font-size: 14.5px;
	line-height: 1.4;
}
.rd-nav ul.submenu > li > a:hover {
	color: #DE7A18;
	background: #F5F9FD;
}
.rd-nav ul.submenu > li.title > a {
	color: #14375E;
	font-weight: 600;
	padding-top: 12px;
}
/* derde niveau: als eenvoudige lijst onder de titel */
.rd-nav ul.sub2menu {
	max-height: 260px;
	overflow-y: auto;
	padding-bottom: 6px;
}
.rd-nav ul.sub2menu > li > a {
	display: block;
	padding: 5px 20px 5px 32px;
	color: #5B7188;
	font-size: 13.5px;
}
.rd-nav ul.sub2menu > li > a:hover {
	color: #DE7A18;
	background: #F5F9FD;
}

/* "Meer"-knop (wordt door JS gevuld) */
.rd-nav li.rd-meer {
	display: none;
}
.rd-nav li.rd-meer.rd-actief {
	display: block;
}
.rd-nav li.rd-meer > div > a i {
	font-size: 11px;
	margin-left: 5px;
}

/* hamburger */
.rd-nav-knop {
	display: none;
	background: none;
	border: 0;
	color: #14375E;
	font-size: 22px;
	padding: 10px 4px;
	cursor: pointer;
	line-height: 1;
}

/* --- 4. Hero ------------------------------------------------------------ */

.rd-hero {
	position: relative;
	overflow: hidden;
	background-color: #FAFCFD;
}
/* De illustratie zit in een eigen laag die 300px naar rechts is opgeschoven,
   zodat de kerk en de eend rechts van het midden staan. Wat rechts uitsteekt
   wordt door overflow:hidden afgesneden; links blijft de rustige, lichte zone
   voor de tekst over. De lucht en het water mogen bijgesneden worden (positie
   25%), de toren blijft daardoor op elke schermbreedte staan. */
.rd-hero:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 300px;
	right: -300px;
	z-index: 0;
	background: url('files/redesign/hero-waarder.jpg?v=2') no-repeat center 25%;
	background-size: cover;
}
/* sluier over de tekstzijde + zachte overgang naar de paginakleur onderaan */
.rd-hero:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	background:
		-webkit-linear-gradient(left, rgba(252, 253, 254, .97) 0%, rgba(252, 253, 254, .9) 22%, rgba(252, 253, 254, .5) 34%, rgba(252, 253, 254, 0) 52%);
	background:
		linear-gradient(to right, rgba(252, 253, 254, .97) 0%, rgba(252, 253, 254, .9) 22%, rgba(252, 253, 254, .5) 34%, rgba(252, 253, 254, 0) 52%),
		linear-gradient(to bottom, rgba(241, 247, 251, 0) 84%, rgba(241, 247, 251, .7) 94%, #F1F7FB 100%);
}
.rd-hero .rd-container {
	position: relative;
	z-index: 2;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding-top: 58px;
	padding-bottom: 52px;
	min-height: 500px;
	min-height: clamp(500px, 34vw, 720px);
}
.rd-hero-tekst {
	max-width: 560px;
}
.rd-hero .rd-kop {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #DE7A18;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .22em;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.rd-hero .rd-kop:before {
	content: '';
	width: 46px;
	height: 2px;
	background: #DE7A18;
	margin-right: 16px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}
.rd-hero h1 {
	font-family: 'Playfair Display', 'Times New Roman', Georgia, serif;
	font-size: 58px;
	font-weight: 500;
	line-height: 1.08;
	color: #14375E;
	margin: 0 0 26px;
	letter-spacing: -.01em;
}
.rd-hero .rd-streep {
	width: 62px;
	height: 2px;
	background: #DE7A18;
	opacity: .55;
	margin-bottom: 26px;
}
/* bijbeltekst in de hero */
.rd-hero blockquote.rd-vers {
	font-family: 'Playfair Display', 'Times New Roman', Georgia, serif;
	font-size: 24px;
	font-style: italic;
	font-weight: 400;
	line-height: 1.5;
	color: #1C4470;
	max-width: 480px;
	border: 0;
	background: none;
	padding: 0;
	margin: 0 0 12px;
}
.rd-hero .rd-bron {
	color: #DE7A18;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	margin: 0 0 22px;
}

.rd-hero p {
	font-size: 17.5px;
	line-height: 1.75;
	color: #4A6280;
	max-width: 480px;
	margin: 0 0 32px;
}
.rd-hero-knoppen {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

/* --- 5. Knoppen --------------------------------------------------------- */

.rd-knop,
.cmscontent a.btn,
.contentcontainer .btn-primary {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background: #14375E;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	padding: 14px 24px;
	border: 1px solid #14375E;
	border-radius: 9px;
	margin: 0 14px 12px 0;
	-webkit-transition: all .16s ease;
	transition: all .16s ease;
	white-space: nowrap;
}
.rd-knop i {
	margin-left: 12px;
	font-size: 12px;
	opacity: .85;
}
.rd-knop:hover,
.rd-knop:focus {
	background: #0E2A49;
	border-color: #0E2A49;
	color: #fff;
	-webkit-transform: translateY(-1px);
	transform: translateY(-1px);
	box-shadow: 0 8px 20px rgba(14, 42, 73, .18);
}
.rd-knop.rd-knop-open {
	background: #fff;
	border-color: #E8B173;
	color: #DE7A18;
}
.rd-knop.rd-knop-open:hover {
	background: #FFF7EF;
	border-color: #DE7A18;
	color: #C4670E;
	box-shadow: 0 8px 20px rgba(222, 122, 24, .15);
}

/* --- 6. Paginakop op binnenpagina's ------------------------------------- */

.rd-paginakop {
	position: relative;
	overflow: hidden;
	background-color: #FAFCFD;
	border-bottom: 1px solid #E4EBF3;
}
/* de hele plaat, kleiner en rechts uitgelijnd: niets wordt afgesneden. De
   randen zijn in het bestand zelf al ingevaagd naar #FAFCFD, dus er is geen
   zichtbare beeldrand. */
.rd-paginakop:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 0;
	background: url('files/redesign/kop-kerk-2.jpg?v=2') no-repeat right bottom;
	background-size: auto 100%;
}
.rd-paginakop:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	background: -webkit-linear-gradient(left, #FAFCFD 0%, rgba(250,252,253,.85) 30%, rgba(250,252,253,0) 52%);
	background:
		linear-gradient(to right, #FAFCFD 0%, rgba(250,252,253,.85) 30%, rgba(250,252,253,0) 52%);
}
.rd-paginakop .rd-container {
	position: relative;
	z-index: 2;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding-top: 38px;
	padding-bottom: 36px;
	min-height: 205px;
}
.rd-paginakop h4.titel,
.rd-paginakop .rd-kruimel {
	color: #DE7A18;
	font-family: 'Figtree', 'Segoe UI', Arial, sans-serif;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	margin: 0 0 10px;
}
.rd-paginakop .rd-kruimel a {
	color: #DE7A18;
}
.rd-paginakop .rd-kruimel a:hover {
	color: #C4670E;
	text-decoration: underline;
}
.rd-paginakop .rd-kruimel a:not(:last-of-type):after {
	content: "/";
	color: #A9BACC;
	display: inline-block;
	margin: 0 4px 0 8px;
	font-weight: 400;
}
.rd-paginakop h1.titel a {
	color: #14375E;
}
.rd-paginakop h1.titel a:hover {
	color: #14375E;
}
.rd-paginakop h1.titel {
	font-family: 'Playfair Display', 'Times New Roman', Georgia, serif;
	font-size: 42px;
	font-weight: 500;
	color: #14375E;
	margin: 0;
	line-height: 1.15;
}

/* --- 7. Hoofdgedeelte --------------------------------------------------- */

.rd-main {
	padding: 46px 0 66px;
}
.rd-main.rd-main-home {
	padding-top: 34px;
}
.rd-kolommen {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 -14px;
}
.rd-kol-zij {
	-ms-flex: 0 0 280px;
	flex: 0 0 280px;
	max-width: 280px;
	padding: 0 14px;
}
.rd-kol-inhoud {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 0%;
	flex: 1 1 0%;
	min-width: 0;
	padding: 0 14px;
}

/* --- 8. Kaarten --------------------------------------------------------- */

.rd-kaart {
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 10px 34px rgba(20, 55, 94, .07);
	padding: 32px 34px;
	margin-bottom: 28px;
}
.rd-kaart-kop {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-bottom: 22px;
}
.rd-kaart-kop h2 {
	font-size: 22px;
	font-weight: 600;
	color: #14375E;
	margin: 0;
}
.rd-meer-link {
	color: #14375E;
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
}
.rd-meer-link i {
	margin-left: 8px;
	font-size: 11px;
}
.rd-meer-link:hover {
	color: #DE7A18;
}

/* --- 9. Nieuwsblok (homepage) ------------------------------------------- */

.rd-nieuwsrij {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.rd-nieuwsitem {
	-ms-flex: 1 1 0%;
	flex: 1 1 0%;
	min-width: 200px;
	padding: 4px 26px;
	border-left: 1px solid #EDF2F8;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}
.rd-nieuwsitem:first-child {
	border-left: 0;
	padding-left: 4px;
}
.rd-nieuwsitem:last-child {
	padding-right: 4px;
}
.rd-icoon {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #EAF1F8;
	color: #4A6E99;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	font-size: 18px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	margin-bottom: 16px;
	overflow: hidden;
}
.rd-icoon img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.rd-nieuwsitem h3 {
	font-size: 16px;
	font-weight: 600;
	color: #14375E;
	margin: 0 0 6px;
	line-height: 1.35;
}
.rd-nieuwsitem h3 a {
	color: #14375E;
}
.rd-nieuwsitem h3 a:hover {
	color: #DE7A18;
}
.rd-datum {
	color: #DE7A18;
	font-size: 13.5px;
	font-weight: 500;
	margin-bottom: 10px;
}
.rd-nieuwsitem p {
	font-size: 14.5px;
	line-height: 1.6;
	color: #5E7590;
	margin: 0 0 16px;
}
.rd-nieuwsitem .rd-tekst {
	font-size: 14.5px;
	line-height: 1.6;
	color: #5E7590;
	margin: 0 0 16px;
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
}
.rd-nieuwsitem .rd-tekst p {
	margin: 0;
}
.rd-lees {
	color: #DE7A18;
	font-size: 13.5px;
	font-weight: 600;
	margin-top: auto;
}
.rd-lees i {
	margin-left: 7px;
	font-size: 11px;
}
.rd-lees:hover {
	color: #C4670E;
}

/* --- 10. Agendablok (homepage) ------------------------------------------ */

.rd-agenda-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 15px 0;
	border-top: 1px solid #EDF2F8;
	color: #465C74;
}
.rd-agenda-item:first-child {
	border-top: 0;
	padding-top: 4px;
}
.rd-agenda-item:hover {
	color: #465C74;
}
.rd-agenda-item:hover h3 {
	color: #DE7A18;
}
.rd-agenda-datum {
	-ms-flex: 0 0 66px;
	flex: 0 0 66px;
	text-align: center;
	line-height: 1.1;
	border-right: 1px solid #EDF2F8;
	padding-right: 14px;
	margin-right: 16px;
}
.rd-agenda-datum .rd-dag {
	display: block;
	color: #DE7A18;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.rd-agenda-datum .rd-nr {
	display: block;
	color: #14375E;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -.02em;
	margin: 1px 0;
}
.rd-agenda-datum .rd-maand {
	display: block;
	color: #DE7A18;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.rd-agenda-item .rd-icoon {
	margin-bottom: 0;
	margin-right: 16px;
	width: 42px;
	height: 42px;
	font-size: 16px;
}
.rd-agenda-info {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	min-width: 0;
}
.rd-agenda-info h3 {
	font-size: 15.5px;
	font-weight: 600;
	color: #14375E;
	margin: 0 0 2px;
	line-height: 1.3;
}
.rd-agenda-info span {
	display: block;
	font-size: 13.5px;
	color: #6B7F95;
	line-height: 1.45;
}
.rd-agenda-item .rd-pijl {
	color: #B4C4D5;
	font-size: 15px;
	margin-left: 14px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}
.rd-agenda-item:hover .rd-pijl {
	color: #DE7A18;
}
.rd-agenda-item.rd-nu .rd-nr,
.rd-agenda-item.rd-nu h3 {
	color: #C4670E;
}

.rd-leeg {
	color: #6B7F95;
	font-size: 14.5px;
	padding: 8px 0 4px;
}

/* --- 10b. Verdeling van de homepage-blokken ----------------------------- */

.rd-home-rij {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 -14px;
}
.rd-home-nieuws {
	-ms-flex: 1 1 56%;
	flex: 1 1 56%;
	min-width: 0;
	padding: 0 14px;
}
.rd-home-agenda {
	-ms-flex: 1 1 40%;
	flex: 1 1 40%;
	min-width: 0;
	padding: 0 14px;
}
@media (max-width: 991px) {
	.rd-home-nieuws,
	.rd-home-agenda {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
	}
}

/* --- 11. Zijmenu op binnenpagina's -------------------------------------- */

.rd-zijmenu {
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 10px 34px rgba(20, 55, 94, .07);
	padding: 22px 8px 22px;
	margin-bottom: 28px;
}
.rd-zijmenu h3 {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #DE7A18;
	margin: 0 0 12px;
	padding: 0 18px;
}
.rd-zijmenu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rd-zijmenu li a {
	display: block;
	padding: 9px 18px;
	font-size: 14.5px;
	color: #35506F;
	border-left: 3px solid transparent;
	line-height: 1.4;
}
.rd-zijmenu li a:hover {
	background: #F5F9FD;
	color: #DE7A18;
}
.rd-zijmenu li.rd-actief > a {
	color: #14375E;
	font-weight: 600;
	border-left-color: #DE7A18;
	background: #F5F9FD;
}
.rd-zijmenu li ul li a {
	padding-left: 32px;
	font-size: 13.5px;
	color: #5E7590;
}

.rd-zoek {
	position: relative;
	margin-bottom: 28px;
}
.rd-zoek input {
	width: 100%;
	background: #fff;
	border: 1px solid #E4EBF3;
	border-radius: 10px;
	padding: 12px 44px 12px 16px;
	font-size: 14.5px;
	color: #35506F;
	font-family: inherit;
	box-shadow: 0 6px 18px rgba(20, 55, 94, .05);
}
.rd-zoek input::-webkit-input-placeholder { color: #9BADC0; }
.rd-zoek input:-moz-placeholder { color: #9BADC0; }
.rd-zoek input::-moz-placeholder { color: #9BADC0; }
.rd-zoek input:-ms-input-placeholder { color: #9BADC0; }
.rd-zoek input:focus {
	border-color: #C6D9EA;
	outline: 0;
}
.rd-zoek i {
	position: absolute;
	right: 16px;
	top: 50%;
	margin-top: -8px;
	color: #9BADC0;
	font-size: 15px;
	pointer-events: none;
}

/* --- 12. Inhoud in de kaarten (CMS-tekst en modules) -------------------- */

.rd-kaart h1 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 32px;
	font-weight: 500;
	margin: 0 0 18px;
}
.rd-kaart h2 {
	font-size: 24px;
	margin: 32px 0 12px;
}
.rd-kaart h2:first-child,
.rd-kaart h3:first-child {
	margin-top: 0;
}
.rd-kaart h3 {
	font-size: 19px;
	margin: 26px 0 10px;
}
.rd-kaart h4,
.rd-kaart h5,
.rd-kaart h6 {
	font-size: 16.5px;
	margin: 22px 0 8px;
}
.rd-kaart p,
.rd-kaart li {
	font-size: 16px;
	line-height: 1.75;
	color: #465C74;
}
.rd-kaart p {
	margin: 0 0 16px;
}
.rd-kaart ul,
.rd-kaart ol {
	margin: 0 0 18px;
	padding-left: 22px;
}
.rd-kaart li {
	margin-bottom: 6px;
}
.rd-kaart img {
	border-radius: 10px;
	margin: 6px 0 18px;
}
.rd-kaart blockquote {
	border: 0;
	border-left: 3px solid #DE7A18;
	background: #F7FAFD;
	border-radius: 0 10px 10px 0;
	margin: 22px 0;
	padding: 16px 22px;
	font-size: 16.5px;
	color: #35506F;
}
.rd-kaart blockquote p:last-child {
	margin-bottom: 0;
}
.rd-kaart table {
	max-width: 100%;
	margin: 8px 0 22px;
	border-collapse: collapse;
	font-size: 15px;
}
.rd-kaart table td,
.rd-kaart table th {
	border-bottom: 1px solid #EDF2F8;
	padding: 10px 12px;
	vertical-align: top;
	text-align: left;
}
.rd-kaart table th {
	color: #14375E;
	font-weight: 600;
}
.rd-kaart table.add-form td,
.rd-kaart table.admin-table-form td {
	border-bottom: 0;
	padding: 5px 10px 5px 0;
}
.rd-kaart hr {
	margin: 26px 0;
}
.rd-kaart iframe {
	max-width: 100%;
	border-radius: 10px;
}
.rd-kaart > *:last-child {
	margin-bottom: 0;
}

/* alleen lopende tekst krijgt de oranje tekstlink */
.cmscontent p a,
.cmscontent li a,
.cmscontent td a,
.cmscontent blockquote a {
	color: #DE7A18;
	border-bottom: 1px solid rgba(222, 122, 24, .3);
}
.cmscontent p a:hover,
.cmscontent li a:hover,
.cmscontent td a:hover,
.cmscontent blockquote a:hover {
	color: #C4670E;
	border-bottom-color: #C4670E;
}
.cmscontent p a img,
.cmscontent li a img {
	border-bottom: 0;
}

/* --- 13. Modules: lijsten, nieuws, downloads ---------------------------- */

.rd-kol-inhoud .list-group {
	margin-bottom: 22px;
}
.rd-kol-inhoud .list-group-item {
	border: 0;
	border-top: 1px solid #EDF2F8;
	border-radius: 0 !important;
	padding: 16px 4px;
	background: transparent;
	color: #465C74;
	font-size: 15px;
	line-height: 1.55;
}
.rd-kol-inhoud .list-group-item p {
	font-size: 15px;
	line-height: 1.55;
	margin-bottom: 8px;
}
.rd-kol-inhoud .list-group-item:first-child {
	border-top: 0;
}
.rd-kol-inhoud a.list-group-item:hover,
.rd-kol-inhoud a.list-group-item:focus {
	background: #F7FAFD;
	color: #465C74;
}
.rd-kol-inhoud a.list-group-item h3,
.rd-kol-inhoud a.list-group-item strong {
	color: #14375E;
	font-size: 16.5px;
	font-weight: 600;
	display: block;
	margin: 0 0 4px;
}
.rd-kol-inhoud a.list-group-item:hover h3,
.rd-kol-inhoud a.list-group-item:hover strong {
	color: #DE7A18;
}
.rd-kol-inhoud .list-group-item em {
	color: #6B7F95;
	font-size: 13.5px;
	font-style: normal;
}
.rd-kol-inhoud .list-group-item.important {
	background: #FFF8F0;
	border-left: 3px solid #DE7A18;
	padding-left: 16px;
}
.rd-kol-inhoud .list-group-item strong.active {
	color: #C4670E;
}

/* de modules zetten hun eigen bootstrap-kolommen; binnen de kaart is de
   inspringing overbodig */
.rd-kaart .nieuwscontainer,
.rd-kaart .downloadscontainer {
	width: 100%;
	margin-left: 0;
	padding-left: 0;
	padding-right: 0;
}

.nieuws-item {
	padding-bottom: 8px;
}
.nieuws-item h2,
.nieuws-header h2 {
	font-size: 21px;
	margin-bottom: 4px;
}
.nieuws-item .date,
.nieuws-header .nieuws-datum {
	color: #DE7A18;
	font-size: 13.5px;
	font-weight: 500;
	margin-bottom: 8px;
}
.nieuws-item img {
	border-radius: 10px;
}
.nieuws-item .action,
a.action {
	display: inline-block;
	color: #DE7A18;
	font-size: 13.5px;
	font-weight: 600;
	margin-top: 6px;
}

.downloads .list-group-item p {
	margin: 4px 0 0;
	color: #6B7F95;
	font-size: 14px;
}

.profiel {
	background: #F7FAFD;
	border-radius: 12px;
	padding: 16px;
	margin-bottom: 16px;
}
.profiel .foto img {
	border-radius: 8px;
}

/* paginering en bootstrap-elementen in de nieuwe stijl */
.pagination > li > a,
.pagination > li > span {
	color: #35506F;
	border-color: #E4EBF3;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover {
	background: #14375E;
	border-color: #14375E;
}
.btn-primary {
	background: #14375E;
	border-color: #14375E;
	border-radius: 9px;
	padding: 11px 20px;
	font-weight: 500;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
	background: #0E2A49;
	border-color: #0E2A49;
}
.btn-default {
	border-radius: 9px;
	border-color: #E4EBF3;
	color: #35506F;
}
.form-control {
	border-radius: 9px;
	border-color: #E4EBF3;
	box-shadow: none;
	height: auto;
	padding: 10px 14px;
	color: #35506F;
}
.form-control:focus {
	border-color: #C6D9EA;
	box-shadow: none;
}
input.input,
input.titel,
textarea,
select {
	border-radius: 9px;
	border: 1px solid #E4EBF3;
	padding: 10px 14px;
	font-family: inherit;
	font-size: 15px;
	color: #35506F;
	background: #fff;
	max-width: 100%;
}
table.add-form td {
	padding: 5px 8px 5px 0;
	vertical-align: top;
}
#melding {
	background: #FFF8F0;
	border: 1px solid #F3DCC1;
	border-radius: 10px;
	padding: 14px 18px;
	margin-bottom: 20px;
	font-size: 14.5px;
}

/* bewerkknop voor beheerders (icon-edit komt uit de oude iconfont; hier via
   font-awesome, want style.css wordt in de redesign-modus niet geladen) */
a.icon-edit {
	color: #B4C4D5;
	font-size: 15px !important;
	margin-left: 12px;
}
a.icon-edit:before {
	content: "\f040";
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
}
a.icon-edit:hover {
	color: #DE7A18;
}

/* dropdown-overloop in de navigatie ("Meer") */
.rd-nav li.rd-meer > ul.submenu {
	max-height: 72vh;
	overflow-y: auto;
	min-width: 280px;
}
.rd-nav li.rd-meer > ul.submenu > li > div > a {
	display: block;
	padding: 8px 20px;
	color: #35506F;
	font-size: 14.5px;
	line-height: 1.4;
	white-space: normal;
}
.rd-nav li.rd-meer > ul.submenu > li > div > a:after {
	display: none;
}
.rd-nav li.rd-meer > ul.submenu > li > div > a:hover {
	color: #DE7A18;
	background: #F5F9FD;
}
.rd-nav li.rd-meer > ul.submenu > li.selected > div > a {
	color: #DE7A18;
	font-weight: 600;
}
.rd-nav li.rd-meer > ul.submenu > li > ul.submenu {
	display: block;
	position: static;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	margin: 0;
	padding: 0 0 6px;
	min-width: 0;
	max-width: none;
	max-height: none;
}
.rd-nav li.rd-meer > ul.submenu > li > ul.submenu > li > a {
	padding: 5px 20px 5px 34px;
	font-size: 13.5px;
	color: #5E7590;
}

/* --- 13b. Sectiekoppen in modules (weekindeling van de agenda) ---------- */

/* De agenda zet per week een kop neer; die krijgt dezelfde stijl als het
   "Welkom bij" boven de hero en werkt zo als scheiding tussen de weken.
   De module geeft die kop een inline marge mee, vandaar het !important. */
.rd-kaart > h3[style*="15px"] {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	color: #DE7A18;
	font-family: 'Figtree', 'Segoe UI', Arial, sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	line-height: 1.4;
	margin: 46px 0 20px !important;
	padding-top: 32px;
	border-top: 1px solid #EDF2F8;
}
.rd-kaart > h3[style*="15px"]:before {
	content: '';
	width: 46px;
	height: 2px;
	background: #DE7A18;
	margin-right: 16px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}
/* de eerste week sluit aan op de inhoud erboven, zonder extra streep */
.rd-kaart > h3[style*="15px"]:first-child {
	margin-top: 4px !important;
	padding-top: 0;
	border-top: 0;
}
/* de periode rechts blijft rustige, gewone tekst */
.rd-kaart > h3[style*="15px"] span.pull-right {
	float: none !important;
	/* de module zet de periode voor de titel in de html; met order komt hij
	   alsnog rechts te staan */
	-webkit-box-ordinal-group: 3;
	-ms-flex-order: 2;
	order: 2;
	margin-left: auto;
	color: #6B7F95;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}
/* losse regelafbrekingen tussen de blokken: de marges regelen de ruimte */
.rd-kaart > br {
	display: none;
}

/* terugblader-link boven de weken */
.rd-kaart > a > h3,
.rd-kaart > a > h4 {
	color: #35506F;
	font-size: 14.5px;
	font-weight: 500;
	margin: 0 0 6px;
}
.rd-kaart > a:hover > h3,
.rd-kaart > a:hover > h4 {
	color: #DE7A18;
}

@media (max-width: 767px) {
	.rd-kaart > h3[style*="15px"] {
		margin: 34px 0 16px !important;
		padding-top: 24px;
		font-size: 12px;
		letter-spacing: .18em;
	}
	.rd-kaart > h3[style*="15px"]:before {
		width: 26px;
		margin-right: 12px;
	}
	.rd-kaart > h3[style*="15px"] span.pull-right {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		margin: 6px 0 0 42px;
	}
}

/* --- 13c. Wegwijzer onder aan de homepage ------------------------------- */

.rd-wegwijzer {
	margin-top: 4px;
	padding: 34px 34px 30px;
}
.rd-wegwijzer h3 {
	font-size: 17px;
	margin: 0 0 6px;
}
.rd-wegwijzer .row {
	margin-top: 6px;
}
.rd-wegwijzer .row > div {
	padding-top: 10px;
	padding-bottom: 10px;
}
.rd-wegwijzer p {
	font-size: 15.5px;
	line-height: 1.6;
	margin-bottom: 10px;
}
.rd-wegwijzer a {
	color: #DE7A18;
	font-weight: 600;
	font-size: 14.5px;
	border-bottom: 0;
}
.rd-wegwijzer a:hover {
	color: #C4670E;
}
@media (max-width: 767px) {
	.rd-wegwijzer {
		padding: 24px 20px 20px;
	}
}

/* --- 14. Banners (carousel) --------------------------------------------- */

.rd-banners {
	margin-bottom: 28px;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 10px 34px rgba(20, 55, 94, .07);
}
.rd-banners .carousel-caption {
	text-shadow: 0 2px 12px rgba(14, 42, 73, .45);
	bottom: 34px;
}
.rd-banners .carousel-caption h1 {
	font-family: 'Playfair Display', Georgia, serif;
	color: #fff;
	font-size: 34px;
	font-weight: 500;
	margin: 0 0 6px;
}
.rd-banners .carousel-caption p {
	color: #fff;
	font-size: 16px;
}

/* --- 15. Footer --------------------------------------------------------- */

.rd-footer {
	margin-top: 46px;
	position: relative;
}
.rd-footer-golf {
	position: relative;
	line-height: 0;
	margin-bottom: -1px;
}
.rd-footer-golf svg.rd-golf {
	display: block;
	width: 100%;
	height: 46px;
}
/* de eend uit het app-icoon drijft op de golf */
.rd-footer-golf .rd-ornament {
	position: absolute;
	left: 50%;
	top: -20px;
	width: 68px;
	height: 44px;
	margin-left: -34px;
}
.rd-footer-golf .rd-ornament img {
	display: block;
	width: 100%;
	height: auto;
}
.rd-footer-body {
	background: #D8E9F1;
	padding: 6px 0 26px;
}
.rd-footer-body .rd-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.rd-copyright {
	margin: 0;
	color: #5C7C95;
	font-size: 13.5px;
	line-height: 1.6;
}
.rd-copyright a {
	color: #5C7C95;
	border-bottom: 1px solid rgba(92, 124, 149, .35);
}
.rd-copyright a:hover {
	color: #14375E;
	border-color: #14375E;
}
ul.rd-footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
ul.rd-footer-links li {
	margin-left: 42px;
}
ul.rd-footer-links li:first-child {
	margin-left: 0;
}
ul.rd-footer-links li a {
	color: #14375E;
	font-size: 15px;
	font-weight: 500;
}
ul.rd-footer-links li a:hover,
ul.rd-footer-links li.active a {
	color: #DE7A18;
}

/* --- 16. Responsive ----------------------------------------------------- */

@media (max-width: 1180px) {
	.rd-hero:after {
		left: 170px;
		right: -170px;
	}
	.rd-hero h1 {
		font-size: 52px;
	}
	.rd-nav ul#nav > li > div > a {
		padding: 32px 10px;
		font-size: 14.5px;
	}
}

@media (max-width: 991px) {
	.rd-nav-knop {
		display: block;
	}
	.rd-header .rd-container {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.rd-nav {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		display: none;
		border-top: 1px solid #EDF2F8;
		padding: 8px 0 18px;
		max-height: 72vh;
		overflow-y: auto;
	}
	.rd-nav.rd-open {
		display: block;
	}
	.rd-nav ul#nav {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.rd-nav ul#nav > li > div > a {
		padding: 11px 4px;
		font-size: 16px;
	}
	.rd-nav ul#nav > li > div > a:after {
		display: none;
	}
	.rd-nav ul#nav > li > ul.submenu {
		display: block;
		position: static;
		box-shadow: none;
		border: 0;
		border-left: 2px solid #EDF2F8;
		border-radius: 0;
		margin: 0 0 8px 6px;
		padding: 0;
		min-width: 0;
		max-width: none;
	}
	.rd-nav ul.submenu > li > a {
		padding: 7px 14px;
	}
	.rd-nav ul.sub2menu {
		max-height: none;
	}
	.rd-nav li.rd-meer {
		display: none !important;
	}
	.rd-hero .rd-container {
		min-height: 0;
		padding-top: 40px;
		padding-bottom: 56vw;
	}
	.rd-hero {
		background-image: -webkit-linear-gradient(top, #FCFDFE 0%, #FAFCFD 60%, #EFF7FD 100%);
		background-image: linear-gradient(to bottom, #FCFDFE 0%, #FAFCFD 60%, #EFF7FD 100%);
	}
	.rd-hero:after {
		left: 0;
		right: 0;
		top: auto;
		background-image: url('files/redesign/hero-waarder-mobiel.jpg?v=2');
		background-position: center bottom;
		background-size: 100% auto;
		height: 58vw;
	}
	.rd-hero:before {
		background:
			-webkit-linear-gradient(top, rgba(241, 247, 251, 0) 92%, #F1F7FB 100%);
		background:
			linear-gradient(to bottom, rgba(241, 247, 251, 0) 92%, #F1F7FB 100%);
	}
	.rd-hero h1 {
		font-size: 44px;
	}
	.rd-hero p {
		font-size: 16.5px;
	}
	.rd-kolommen {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.rd-kol-zij {
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		max-width: none;
		width: 100%;
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 2;
		order: 2;
	}
	.rd-kol-inhoud {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
	}
	.rd-nieuwsitem {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		border-left: 0;
		border-top: 1px solid #EDF2F8;
		padding: 20px 4px;
	}
	.rd-nieuwsitem:first-child {
		border-top: 0;
		padding-top: 4px;
	}
}

@media (max-width: 767px) {
	body {
		font-size: 15.5px;
	}
	.rd-container {
		padding: 0 18px;
	}
	.rd-logo img {
		width: 50px;
		height: 50px;
		margin-right: 12px;
	}
	.rd-logo span {
		font-size: 17px;
	}
	.rd-hero .rd-container {
		padding-bottom: 60vw;
	}
	.rd-hero h1 {
		font-size: 34px;
	}
	.rd-hero .rd-kop {
		font-size: 12px;
		letter-spacing: .16em;
	}
	.rd-hero .rd-kop:before {
		width: 26px;
		margin-right: 12px;
	}
	.rd-hero blockquote.rd-vers {
		font-size: 19px;
		margin-bottom: 10px;
	}
	.rd-hero .rd-bron {
		font-size: 11px;
		margin-bottom: 16px;
	}
	.rd-hero p {
		font-size: 15.5px;
		margin-bottom: 26px;
	}
	.rd-knop {
		font-size: 14.5px;
		padding: 12px 18px;
		margin-right: 10px;
	}
	.rd-main {
		padding: 28px 0 44px;
	}
	.rd-main.rd-main-home {
		padding-top: 22px;
	}
	.rd-kaart {
		padding: 22px 20px;
		border-radius: 14px;
	}
	.rd-kaart-kop h2 {
		font-size: 19px;
	}
	.rd-paginakop:after {
		background-size: auto 86%;
		background-position: right bottom;
	}
	.rd-paginakop .rd-container {
		min-height: 0;
		padding-top: 30px;
		padding-bottom: 28px;
	}
	.rd-paginakop h1.titel {
		font-size: 29px;
	}
	.rd-paginakop h1.titel {
		font-size: 29px;
	}
	.rd-agenda-datum {
		-ms-flex: 0 0 56px;
		flex: 0 0 56px;
		padding-right: 10px;
		margin-right: 12px;
	}
	.rd-agenda-datum .rd-nr {
		font-size: 22px;
	}
	.rd-agenda-item .rd-icoon {
		display: none;
	}
	.rd-footer {
		margin-top: 32px;
	}
	.rd-footer-golf svg.rd-golf {
		height: 30px;
	}
	.rd-footer-golf .rd-ornament {
		width: 52px;
		height: 34px;
		margin-left: -26px;
		top: -14px;
	}
	.rd-footer-body .rd-container {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
	}
	ul.rd-footer-links {
		margin-top: 16px;
	}
	ul.rd-footer-links li {
		margin: 0 26px 6px 0;
	}
	ul.rd-footer-links li a {
		font-size: 14.5px;
	}
}

/* --- 17. Printen -------------------------------------------------------- */

@media print {
	.rd-sandbox,
	.rd-nav,
	.rd-nav-knop,
	.rd-kol-zij,
	.rd-footer,
	.rd-hero-knoppen,
	.rd-zoek {
		display: none !important;
	}
	body {
		background: #fff;
	}
	.rd-kaart {
		box-shadow: none;
		border: 1px solid #E4EBF3;
	}
	.rd-hero,
	.rd-paginakop {
		background-image: none;
	}
}