	/* 
		Website: Marleen Jansen / Stichting Kinderboerderij Westerweide
	*/

	@import url("fontawesome-all.min.css"); @import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,300italic,400italic&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Londrina+Solid:wght@100;300;400;900&display=swap");

/* 	Reset / Normalize */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline }  
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }  
	body { line-height: 1; background: #f5f5f5; -webkit-text-size-adjust: none; -ms-overflow-style: scrollbar }  
	ol, ul { list-style: none }  
	blockquote, q { quotes: none }  
	blockquote:before, blockquote:after, q:before, q:after { content: none }  
	table { border-collapse: collapse; border-spacing: 0 }  
	mark { background-color: transparent; color: inherit }  
	input::-moz-focus-inner { border: 0; padding: 0 }  
	input, select, textarea { -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none }  
	@-ms-viewport { width: device-width }  
	@media screen and (max-width: 480px) { html, body { min-width: 320px } }  
	html { box-sizing: border-box }  
	*, *:before, *:after { box-sizing: inherit }  

/* 	Typography */
	body, input, select, textarea { color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 15pt; font-weight: 400; line-height: 1.65em }  
	a { text-decoration: none; transition: all .3s ease; border-bottom: 1px dotted; color: #e89980 } a:hover { border-bottom-color: transparent } a[class^="link-"]:not(.link-logo) { padding-bottom: 3px; font-weight: 600; border-bottom-style: dotted } a[class^="link-"]:not(.link-logo):hover { padding-bottom: 10px; color: #333333 } .link-purple { color: #97205e; border-bottom-color: #97205e } .link-orange { color: #bd7028; border-bottom-color: #bd7028 } .link-yellow { color: #cb9d2d; border-bottom-color: #cb9d2d } .link-blue { color: #418ec2; border-bottom-color: #418ec2 } .link-pink { color: #c03b50; border-bottom-color: #c03b50 } .link-green { color: #2c9a97; border-bottom-color: #2c9a97 } .link-white { color: #fff; border-bottom-color: #fff } .link-facebook { color: #1877f2; border-bottom-color: #1877f2 } .link-logo { color: #f8f0e9 } .link-logo:hover { color: #deb793 !important }  
	strong, b { color: #333333; font-weight: 600 }  
	em, i { font-style: italic }  
	p { margin: 0 0 2em 0 } p.small { font-size: 0.8em } .red, .dark-red { font-family: "Londrina Solid", serif; font-size: 1em; font-weight: 500 } .red { color: red } .dark-red { color: #be0000 } .white { color: #fff }  

/* Headings */
	h1, h2, h3, h4, h5, h6 { font-family: "Londrina Solid", serif; color: #333333; line-height: 1em; margin: 0 0 0.5em 0; font-weight: 300 }  
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; text-decoration: none }  
	h2 { font-weight: 400; font-style: normal; letter-spacing: 1px; font-size: 2.25em; line-height: 1.5em }  
	h3 { font-weight: 400; font-style: normal; letter-spacing: 1px; font-size: 1.75em; line-height: 1.5em }  
	h4 { font-weight: 400; font-style: normal; letter-spacing: 1px; font-size: 1.3em; line-height: 1.5em }  
	h5 { font-weight: 400; font-style: normal; letter-spacing: 1px; font-size: 1.1em; line-height: 1.5em }  
	h6 { font-weight: 400; font-style: normal; letter-spacing: 1px; font-size: 0.9em; line-height: 1.5em }  
	sub { font-size: 0.8em; position: relative; top: 0.5em }  
	sup { font-size: 0.8em; position: relative; top: -0.5em }  
	hr { border: 0; border-bottom: solid 2px #e5e5e5; margin: 2em 0 }  
	hr.major { margin: 3em 0 }  
	blockquote { border-left: solid 4px #e5e5e5; font-style: italic; margin: 0 0 2em 0; padding: 0.5em 0 0.5em 2em }  

/* 	Section/Article */
	section.special, article.special { text-align: center }
	header p { color: #999; position: relative; margin: 0 0 1.5em 0; font-style: italic }
	header h2 + p { font-size: 1.25em; margin-top: -1em; line-height: 1.5em }
	header h3 + p { font-size: 1.1em; margin-top: -0.85em; line-height: 1.5em }
	header h4 + p, header h5 + p, header h6 + p { font-size: 0.8em; margin-top: -0.5em; line-height: 1.5em }
	header.major { padding: 1em 0; text-align: center } header.major h2 { margin: 0 } header.major p { display: inline-block; border-top: solid 2px #e5e5e5; color: #333333; margin: 1.5em 0 0 0; padding: 1.5em 0 0 0; font-style: normal }

/* 	Form */
	form { margin: 0 0 2em 0 }
	label { color: #333333; display: block; font-size: 0.9em; font-weight: 300; margin: 0 0 1em 0 }
	input[type="text"], input[type="email"], input[type="tel"], input[type="date"], select, textarea { -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; background-color: #f8f8f8; border-radius: 6px; border: solid 1px #e5e5e5; color: inherit; display: block; outline: 0; margin-bottom: 1em; padding: 0 1em; text-decoration: none; height: 3em; width: 100% } input[type="text"]:invalid, input[type="email"]:invalid, input[type="tel"]:invalid, input[type="date"]:invalid, select:invalid, textarea:invalid { box-shadow: none } input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="date"]:focus, select:focus, textarea:focus { border-color: #ccc; box-shadow: 0 0 0 2px #ccc }
	input[type="checkbox"], input[type="radio"] { -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; display: block; float: left; margin-right: -2em; opacity: 0; width: 1em; z-index: -1 } input[type="checkbox"] + label, input[type="radio"] + label { text-decoration: none; color: #333; cursor: pointer; display: inline-block; font-size: 1em; font-weight: 300; padding-left: 2.55em; padding-right: 2em; position: relative } input[type="checkbox"] + label:before, input[type="radio"] + label:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; text-transform: none !important; font-family: 'Font Awesome 5 Free'; font-weight: 900; background: #f8f8f8; border-radius: 6px; border: solid 1px #e5e5e5; content: ''; display: inline-block; font-size: 0.8em; height: 2.25em; left: 0; line-height: 2.25em; position: absolute; text-align: center; top: 0; width: 2.25em } input[type="checkbox"]:checked + label:before, input[type="radio"]:checked + label:before { background: #666; border-color: #666; color: #fff; content: '\f00c' } input[type="checkbox"]:focus + label:before, input[type="radio"]:focus + label:before { border-color: #e89980; box-shadow: 0 0 0 1px #e89980 } input[type="radio"] + label:before { border-radius: 100% }
	select { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='%23e5e5e5' /%3E%3C/svg%3E"); background-size: 1.25em; background-repeat: no-repeat; background-position: calc(100% - 1em) center; height: 3em; padding-right: 3em; text-overflow: ellipsis } select option { color: #333333; background-color: #f5f5f5 }	select:focus::-ms-value { background-color: transparent } select::-ms-expand { display: none }
	textarea { padding: 0.75em 1em }
	::-webkit-input-placeholder { color: #999 !important; opacity: 1.0 } :-moz-placeholder { color: #999 !important; opacity: 1.0 } ::-moz-placeholder { color: #999 !important; opacity: 1.0 }	:-ms-input-placeholder { color: #999 !important; opacity: 1.0 }

/* 	Icon */
	.icon { text-decoration: none; border-bottom: none; position: relative } .icon:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; text-transform: none !important; font-family: 'Font Awesome 5 Free'; font-weight: 400 } .icon > .label { display: none } .icon:before { line-height: inherit } .icon.solid:before { font-weight: 900 }	.icon.brands:before { font-family: 'Font Awesome 5 Brands' } .icon.major { background: #666; border-radius: 100%; color: #fff; cursor: default; display: inline-block; height: 5.5em; line-height: 5.5em; margin: 0 0 2em 0; width: 5.5em } .icon.major:before { font-size: 2.5em } .icon.major.accent1 { background: #666; color: #fff } .icon.major.accent2 { background: #418ec2; color: #fff } .icon.major.accent3 { background: #c03b50; color: #fff } .icon.major.accent4 { background: #cb9d2d; color: #fff } .icon.major.accent5 { background: #2c9a97; color: #fff }

/* 	Image header*/
	.image.header { border-radius: 0; border: 0; display: inline-block; position: relative } .image.header img { border-radius: 0; display: block } .image.header.fit { display: block; margin-top: 4em; margin: 0 0 2em 0; width: 100%; --mask: conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%; -webkit-mask: var(--mask); mask: var(--mask); }	.image.header.fit img { display: block; width: 100%; margin-top: 1em } 
	
/* 	Image */ 
	.image { border-radius: 6px; border: 0; display: inline-block; position: relative }	.image img { border-radius: 6px; display: block }
	.image.left { float: left; padding: 0 1.5em 1em 0; top: 0.25em } .image.right { float: right; padding: 0 0 1em 1.5em; top: 0.25em }
	.image.fit { display: block; margin: 0; width: 100% } .image.fit img { display: block; width: 100% }
	.image.fit2 { display: block; margin-top: 6em; width: 100% } .image.fit2 img { display: block; width: 100%; border-radius: 0 }
	.image.fit3 { display: flex; justify-content: center } .image.fit3 img { display: block; width: 80% }
	.image.fit4 { display: flex; justify-content: center } .image.fit4 img { display: block; width: 30% }  
	.image.logo { display: inline-block; vertical-align: top; width: 150px; height: 150px; margin-right: 20px; margin-top: 20px } 	

/* 	List */
	ol { list-style: decimal; margin: 0 0 2em 0; padding-left: 1.25em }	ol li { padding-left: 0.25em }
	ul { list-style: disc; margin: 0 0 2em 0; padding-left: 1em } ul li { padding-left: 0.5em }	ul.alt { list-style: none; padding-left: 0 } ul.alt li { border-top: solid 1px #e5e5e5; padding: 0.5em 0 } ul.alt li:first-child { border-top: 0; padding-top: 0 } ul.icons { cursor: default; list-style: none; padding-left: 0 }	ul.icons li { display: inline-block; padding: 0 1.25em 0 0 } ul.icons li:last-child { padding-right: 0 }	ul.icons li .icon { color: inherit } ul.icons li .icon:before { font-size: 1.75em }
	dl { margin: 0 0 2em 0 }

/* 	Actions */
	ul.actions { display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; cursor: default; list-style: none; margin-left: -1em; margin-bottom: 0; padding-left: 0 }	ul.actions li { padding: 0 0 0 1em; vertical-align: middle } ul.actions.special { -moz-justify-content: center; -webkit-justify-content: center; -ms-justify-content: center; justify-content: center; width: 100%; margin-left: 0 }	ul.actions.special li:first-child { padding-left: 0 } ul.actions.stacked { -moz-flex-direction: column; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; margin-left: 0 } ul.actions.stacked li { padding: 1.3em 0 0 0 } ul.actions.stacked li:first-child { padding-top: 0 } ul.actions.fit { width: calc(100% + 1em) } ul.actions.fit li { -moz-flex-grow: 1; -webkit-flex-grow: 1; -ms-flex-grow: 1; flex-grow: 1; -moz-flex-shrink: 1; -webkit-flex-shrink: 1; -ms-flex-shrink: 1; flex-shrink: 1; width: 100% }	ul.actions.fit li > * { width: 100% } ul.actions.fit.stacked { width: 100% }
	
/* 	Table */
	.table-wrapper { -webkit-overflow-scrolling: touch; overflow-x: hidden }
	table { margin: 0 0 2em 0; width: 100% }
	table tbody tr { border: solid 1px #e5e5e5; border-left: 0; border-right: 0 } table tbody tr:nth-child(2n + 1) { background-color: #f8f8f8 }
	table td { padding: 0.75em 0.75em }
	table th { color: #333333; font-size: 0.9em; font-weight: 300; padding: 0 0.75em 0.75em 0.75em; text-align: left }
	table thead { border-bottom: solid 2px #e5e5e5 }
	table tfoot { border-top: solid 2px #e5e5e5 }
	table.alt { border-collapse: separate }	table.alt tbody tr td { border: solid 1px #e5e5e5; border-left-width: 0; border-top-width: 0 } table.alt tbody tr td:first-child { border-left-width: 1px } table.alt tbody tr:first-child td { border-top-width: 1px }	table.alt thead { border-bottom: 0 } table.alt tfoot { border-top: 0 }

/*	Buttons */
	.button { appearance: none; transition: background-color .2s ease-in-out, color .2s ease-in-out; border: 0; border-radius: 6px; cursor: pointer; display: inline-block; font-family: "Londrina Solid", serif; font-weight: 400; font-size: 1.2em; line-height: 3em; padding: 0 2em; text-align: center; text-decoration: none; white-space: nowrap; letter-spacing: 1px; background-color: #666; color: #fff } .button:hover { background-color: #737373 } .button:active { background-color: #595959 }
	.button.icon::before { margin-right: .5em }
	.button.fit { width: 100% } .button.alt, .button.wis-gegevens { background-color: transparent; box-shadow: inset 0 0 0 2px #e5e5e5; color: #333 } .button.alt.icon::before { color: #999 } .button.alt:hover, .button.wis-gegevens:hover { background-color: #f8f8f8 } .button.alt:active, .button.wis-gegevens:active { background-color: #f0f0f0 }
	.button.primary { background-color: #e89980; color: #fff; font-weight: 400 } .button.primary:hover { background-color: #ecaa96 }	.button.primary:active { background-color: #e4886a }
	.button.disabled, .button:disabled { background-color: #333 !important; box-shadow: inset 0 -0.15em 0 0 rgba(0,0,0,.15); color: #f5f5f5 !important; cursor: default; opacity: .25 }
	.button.lees-meer { background-color: transparent; box-shadow: inset 0 0 0 2px #bb7226; color: #bb7226; font-weight: 400 } .button.lees-meer:hover { background-color: #f8f0e9 } .button.lees-meer:active { background-color: #f8f0e9 }
	.button.word-donateur { background-color: transparent; box-shadow: inset 0 0 0 2px #cb9d2a; color: #cb9d2a; font-weight: 700 } .button.word-donateur:hover { background-color: #f9f5e9 } .button.word-donateur:active { background-color: #f9f5e9 }
	.button.word-adoptiebaasje { background-color: transparent; box-shadow: inset 0 0 0 2px #408ec2; color: #408ec2; font-weight: 400 } .button.word-adoptiebaasje:hover { background-color: #ebf3f8 } .button.word-adoptiebaasje:active { background-color: #ebf3f8 }
	.button.word-sponsor { background-color: transparent; box-shadow: inset 0 0 0 2px #bd3a4e; color: #bd3a4e; font-weight: 700 } .button.word-sponsor:hover { background-color: #f8ebed } .button.word-sponsor:active { background-color: #f8ebed }
	.button.word-vrijwilliger { background-color: transparent; box-shadow: inset 0 0 0 2px #2c9b96; color: #2c9b96; font-weight: 700 } .button.word-vrijwilliger:hover { background-color: #e9f5f4 } .button.word-vrijwilliger:active { background-color: #e9f5f4 }
	.button.verzend-purple { background-color: #97205e; color: #fff; font-weight: 400 }	.button.verzend-purple:hover { background-color: #a1366e } .button.verzend-purple:active { background-color: #a1366e }	.button.verzend-orange { background-color: #bb7226; color: #fff; font-weight: 400 }	.button.verzend-orange:hover { background-color: #c1803b } .button.verzend-orange:active { background-color: #c1803b }	.button.verzend-yellow { background-color: #cb9d2d; color: #fff; font-weight: 400 }	.button.verzend-yellow:hover { background-color: #d0a642 } .button.verzend-yellow:active { background-color: #d0a642 }	.button.verzend-blue { background-color: #408ec2; color: #fff; font-weight: 400 } .button.verzend-blue:hover { background-color: #5399c8 } .button.verzend-blue:active { background-color: #5399c8 }

/* 	Afbeeldingen carousel */
	.slideshow-container { max-width: 860px; position: relative; margin: auto }
	.mySlides { display: none }
	.prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; background-color: #000; color: white; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; border-bottom: none }
	.next { right: 0; border-radius: 3px 0 0 3px }
	.prev:hover, .next:hover { background-color: rgba(0,0,0,0.8) }
	.text { color: #f2f2f2; font-family: "Source Sans Pro", sans-serif; font-size: 20px; font-weight: 600; padding: 8px 12px; position: absolute; bottom: 20px; width: 100%; text-align: center }
	.numbertext { color: #f2f2f2; font-family: "Source Sans Pro", sans-serif; font-size: 12px; font-weight: 600; padding: 8px 20px; position: absolute; top: 0 }
	.dot { cursor: pointer; height: 15px; width: 15px; margin: 0 2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease }
	.active2, .dot:hover { background-color: #bd7028 }
	.fade { animation-name: fade; animation-duration: 1.5s }
	@keyframes fade { from {opacity: .4} to {opacity: 1} }

/* 	Header */
	#page-wrapper { padding-top: 3em }
	body.landing #page-wrapper { padding-top: 0 }
	@keyframes reveal-header { 0% { top: -5em; } 100% { top: 0; } }
	.home { display: none !important; }
	#header { background: #975920; color: #bbb; cursor: default; height: 4em; left: 0; line-height: 3.8em; position: fixed; top: 0; width: 100%; z-index: 10000 }
	#header h1 { color: inherit; height: inherit; left: 5.5em; line-height: inherit; letter-spacing: 1px; margin: 0; padding: 0; position: absolute; top: 0 }
	#header h1 a { color: #fff; font-weight: 400; border: 0 }
	#header nav { height: inherit; line-height: inherit; position: absolute; right: 5.5em; top: 0 }
	#header nav > ul { list-style: none; margin: 0; padding-left: 0 }
	#header nav > ul > li { display: inline-block; padding-left: 0 }
	#header nav > ul > li > ul { display: none }
	#header nav > ul > li a { display: inline-block; height: 2em; line-height: 1.95em; padding: 0 1em; border-radius: 6px }
	#header nav > ul > li a:not(.button) { color: #fff; text-decoration: none; border: 0 }
	#header nav > ul > li a:not(.button).icon:before { color: #fff; margin-right: 0.5em }
	#header nav > ul > li:first-child { margin-left: 0 }
	#header nav > ul > li.active a:not(.button) { background-color: #bd7028 }
	#header nav > ul > li .button { margin-left: 0.5em; position: relative }
	#header input[type="submit"], #header input[type="reset"], #header input[type="button"], #header .button { background-color: #bd7028; font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: #fff }
	#header input[type="submit"]:hover, #header input[type="reset"]:hover, #header input[type="button"]:hover, #header .button:hover { background-color: #aa6424 }
	#header input[type="submit"]:active, #header input[type="reset"]:active, #header input[type="button"]:active, #header .button:active { background-color: #aa6424 }
	#header .container { position: relative }
	#header .container h1 { left: 0 }
	#header .container nav { right: 0 }
	#header.reveal { animation: reveal-header 0.5s }
	#header.alt { animation: none; background: none; color: rgba(255,255,255,0.75); position: absolute }
	#header.alt nav > ul > li a:not(.button).icon:before { color: rgba(255,255,255,0.75) }
	#header.alt nav > ul > li.active a:not(.button) { background-color: rgba(255,255,255,0.2) }
	#header.alt input[type="submit"], #header.alt input[type="reset"], #header.alt input[type="button"], #header.alt .button { box-shadow: inset 0 0 0 2px rgba(255,255,255,0.5) }
	#header.alt input[type="submit"]:hover, #header.alt input[type="reset"]:hover, #header.alt input[type="button"]:hover, #header.alt .button:hover { background-color: rgba(255,255,255,0.1) }
	#header.alt input[type="submit"]:active, #header.alt input[type="reset"]:active, #header.alt input[type="button"]:active, #header.alt .button:active { background-color: rgba(255,255,255,0.2) }
	.dropotron { background: #fff; border-radius: 6px; box-shadow: 0 2px 0 rgba(0,0,0,0.065), inset 0 -1px 0 #fff, inset 0 0 0 1px rgba(229,229,229,0.5); list-style: none; margin: calc(-0.5em + 1px) 0 0 1px; padding: 0.5em 0; width: 11em }
	.dropotron li { padding: 0; }
	.dropotron li a, .dropotron li span { transition: none; border: 0; border-top: solid 1px #f2f2f2; color: #333; display: block; padding: 0.15em 1em }
	.dropotron li:first-child > a, .dropotron li:first-child > span { border-top: 0 }
	.dropotron li.active > a, .dropotron li.active > span, .dropotron li:hover > a, .dropotron li:hover > span { background: #aa6424; color: #fff }
	.dropotron.level-0 { font-size: 0.9em; margin: 1em 0 0 0 }
	.dropotron.level-0:before { transform: rotate(45deg); background: #fff; border: solid 1px rgba(229,229,229,0.5); border-bottom: 0; border-right: 0; box-shadow: -0.25em -0.125em 0.125em rgba(0,0,0,0.015); content: ''; display: block; height: 0.75em; position: absolute; right: 1.25em; top: -0.375em; width: 0.75em; z-index: 0 }
	#page-wrapper { backface-visibility: hidden; transition: transform 0.5s ease; padding-bottom: 1px }
	#navButton, #navPanel { backface-visibility: hidden; transition: transform 0.5s ease }
	#navButton { display: block; height: 44px; left: 0; position: fixed; top: 0; width: 100%; z-index: 10001 }
	#navButton .toggle { text-decoration: none; height: 100%; left: 0; position: absolute; top: 0; width: 100%; border: 0; outline: 0 }
	#navButton .toggle:before { font-family: 'Font Awesome 5 Free'; font-weight: 900; display: block; font-size: 16px; line-height: 2.25em; text-align: center; height: 2.25em; width: 3.5em; left: 0.5em; top: 0.5em; content: '\f0c9'; color: #fff; background: rgba(192,192,192,0.75); border-radius: 6px }
	#navPanel { display: block; height: 100%; left: 0; overflow-y: auto; position: fixed; top: 0; width: 275px; z-index: 10002; background: #2b2b2b; color: #bbb; transform: translateX(-275px) }
	#navPanel .link { border-bottom: 0; border-top: solid 1px rgba(255,255,255,0.05); color: #bbb; display: block; height: 44px; line-height: 44px; padding: 0 1em; text-decoration: none }
	#navPanel .link:first-child { border-top: 0; }
	#navPanel .link.depth-0 { color: #fff; }
	#navPanel .link .indent-1 { width: 1em; display: inline-block; }
	#navPanel .link .indent-2 { width: 2em; display: inline-block; }
	#navPanel .link .indent-3 { width: 3em; display: inline-block; }
	#navPanel .link .indent-4 { width: 4em; display: inline-block; }
	#navPanel .link .indent-5 { width: 5em; display: inline-block; }
	body.navPanel-visible #page-wrapper,
	body.navPanel-visible #navButton { transform: translateX(275px); }
	body.navPanel-visible #navPanel { transform: translateX(0); }

/* 	Container */
	.container { margin: 0 auto; max-width: 1200px; padding: 0 2em; width: 100% }
	.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1em 1em; margin-top: 0 } .grid img, .grid-4 img { width: 100%; height: auto; display: block }
	.grid .box { margin: 0 !important }
	.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1em }
	.grid-4 .image.fit { margin: 0 }

/* 	Banner */
	#banner { background-attachment: scroll, fixed; background-color: #666; background-image: url("../../images/banner.jpg"); background-position: top left, center center; background-repeat: repeat, no-repeat; background-size: auto, cover; color: #fff; padding: 12em 0 20em 0; text-align: center } #banner:last-child { margin-bottom: 0 }
	#banner h2, #banner h3, #banner h4, #banner h5, #banner h6 { color: #f8f0e9 } #banner h2 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; font-size: 3.5em; line-height: 0.6em; margin: 0 0 0.5em 0; padding: 0 }
	#banner p { font-size: 1.25em; margin-bottom: 1.75em }
	#banner input[type="submit"], #banner input[type="reset"], #banner input[type="button"], #banner .button { background-color: transparent; font-family: "Londrina Solid", serif; font-size: 1.2em; font-weight: 400; font-style: normal; letter-spacing: 1px; font-weight: bold; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.5); color: #f8f0e9; min-width: 8em } #banner input[type="submit"]:hover, #banner input[type="reset"]:hover, #banner input[type="button"]:hover, #banner .button:hover { background-color: rgba(255, 255, 255, 0.1) } #banner input[type="submit"]:active, #banner input[type="reset"]:active, #banner input[type="button"]:active, #banner .button:active { background-color: rgba(255, 255, 255, 0.2) } #banner input[type="submit"].volg-ons-op-facebook, #banner input[type="reset"].volg-ons-op-facebook, #banner input[type="button"].volg-ons-op-facebook, #banner .button.volg-ons-op-facebook { background: #f8f0e9; font-family: "Londrina Solid", serif; font-size: 1.2em; font-weight: 400; box-shadow: none; font-style: normal; letter-spacing: 1px; font-weight: bold; color: #bb7226 !important }	#banner input[type="submit"].volg-ons-op-facebook:hover, #banner input[type="reset"].volg-ons-op-facebook:hover, #banner input[type="button"].volg-ons-op-facebook:hover, #banner .button.volg-ons-op-facebook:hover { background: #ebd4bd; color: #bb7226 !important } #banner input[type="submit"].volg-ons-op-facebook:active, #banner input[type="reset"].volg-ons-op-facebook:active, #banner input[type="button"].volg-ons-op-facebook:active, #banner .button.volg-ons-op-facebook:active { background: #ebd4bd; color: #bb7226 !important }

/* 	Main */
	#main { padding: 4em 0 }
	#main > header { text-align: center; margin: 0 0 3em 0 }
	#main > header h2 { font-size: 2.75em; margin: 0 }
	#main > header p { border-top: solid 2px #e5e5e5; color: #333333; display: inline-block; font-style: normal; margin: 1em 0 0 0; padding: 1em 0 1.25em 0 }
	body.landing #main { margin-top: -14em }

/* 	Footer */
	#footer { background: #f0f0f0; padding: 4em 0 6em 0; text-align: center }
	#footer .icons a { -moz-transition: opacity 0.2s ease-in-out; -webkit-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; opacity: 0.35 } #footer .icons a:hover { opacity: 0.75 }
	#footer .copyright { color: #333333; font-size: 0.9em; line-height: 1em; margin: 2em 0 0 0; padding: 0; text-align: center } #footer .copyright a { color: inherit }	#footer .copyright li { border-left: solid 1px #dddddd; display: inline-block; list-style: none; margin-left: 1em; padding-left: 1em } #footer .copyright li:first-child { border-left: 0; margin-left: 0; padding-left: 0 }

/* 	Box */
	.box { background: #fff; border-radius: 6px; box-shadow: 0 2px 0 0 #e5e5e5; margin: 0 0 4em 0; padding: 3em } .box > :last-child { margin-bottom: 0 }
	.box.alt { background: none !important; border-radius: 0 !important; box-shadow: none !important; margin: 0 0 2em 0; padding: 0 !important }
	.box.features .features-row { border-top: solid 2px #e5e5e5; position: relative } .box.features .features-row:after { clear: both; content: ''; display: block } .box.features .features-row section { float: left; padding: 3em; width: 50% } .box.features .features-row section :last-child { margin-bottom: 0 } .box.features .features-row section:nth-child(2n) { padding-right: 0 } .box.features .features-row section:nth-child(2n):before { background: #e5e5e5; content: ''; display: block; height: 100%; margin-left: -3em; position: absolute; top: 0; width: 2px } .box.features .features-row section:nth-child(2n-1) { padding-left: 0 }	.box.features .features-row:first-child { border-top: 0 } .box.features .features-row:first-child section { padding-top: 0 } .box.features .features-row:last-child { padding-bottom: 0 } .box.features .features-row:last-child section { padding-bottom: 0 }
	.box.special { text-align: center }  
	.box .image.featured { border-radius: 0; display: block; margin: 3em 0 3em -3em; position: relative; width: calc(100% + 6em) } .box .image.featured img { border-radius: 0; display: block; width: 100% } .box .image.featured:first-child { border-radius: 6px 6px 0 0; margin-bottom: 3em; margin-top: -3em } .box .image.featured:first-child img { border-radius: 6px 6px 0 0 }	.box .image.featured:last-child { border-radius: 0 0 6px 6px; margin-bottom: -3em; margin-top: 3em } .box .image.featured:last-child img { border-radius: 0 0 6px 6px }
	#box-doe-een-gift { background: #aa6424; color: #fff; padding: 3em 0 4em 0; text-align: center } #box-doe-een-gift h2 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit } #box-doe-een-gift a { color: inherit }		
	#box-openingstijden { background: #aa6424; color: #fff; border-radius: 6px; padding: 4em 0 4em 0; text-align: center } #box-openingstijden h2, #box-openingstijden h3 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }
	#box-aanvraagformulier { background: #97205e; color: #fff; border-radius: 6px 6px 0 0; padding: 2em 0 1.5em 0; text-align: center } #box-aanvraagformulier h2, #box-aanvraagformulier h3, #box-aanvraagformulier h4, #box-aanvraagformulier h5, #box-aanvraagformulier h6 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }
	#box-donatieformulier { background: #cb9d2d; color: #fff; border-radius: 6px 6px 0 0; padding: 2em 0 1.5em 0; text-align: center } #box-donatieformulier h2, #box-donatieformulier h3, #box-donatieformulier h4, #box-donatieformulier h5, #box-donatieformulier h6 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }
	#box-dier-adoptieformulier { background: #408ec2; color: #fff; border-radius: 6px 6px 0 0; padding: 2em 0 1.5em 0; text-align: center }	#box-dier-adoptieformulier h2 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }		
	#box-dieren-voorwaarden { background: #d2cdbe; color: #333333; border-radius: 6px 6px 0 0; padding: 2em 0 1.5em 0; text-align: center }	#box-dieren-voorwaarden h2, #box-dieren-voorwaarden h4 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }
	#box-contact { background: #aa6424; color: #fff; border-radius: 6px; padding: 4em 0 4em 0; text-align: center } #box-contact h2, #box-contact h4 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }			
	#box-contactformulier { background: #aa6424; color: #fff; border-radius: 6px 6px 0 0; padding: 2em 0 1.5em 0; text-align: center } #box-contactformulier h2, #box-contactformulier h3, #box-contactformulier h4, #box-contactformulier h5, #box-contactformulier h6 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; letter-spacing: 1px; color: inherit }
		
/* 	Footer*/
	#box-footer1 { background: #f2e2d3; background-image: url('../../images/footer.svg'); background-repeat: no-repeat; background-size: 100%; background-position: bottom center; color: #aa6424; border-radius: 0; padding: 4em 10em 0 10em; text-align: center; height: 500px; width: 100%; display: block; --mask: conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%; -webkit-mask: var(--mask); mask: var(--mask) } #box-footer1 h3 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; font-size: 1.4em; letter-spacing: 1px; color: inherit }
	#box-footer2 { background: #aa6424; color: #fff; border-radius: 0; padding: 2em 10em 0 10em; text-align: center; margin-top: -2px; height: 320px; --mask: conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%; -webkit-mask: var(--mask); mask: var(--mask) } #box-footer2 h3 { font-family: "Londrina Solid", serif; font-weight: 400; font-style: normal; font-size: 1.4em; letter-spacing: 1px; color: inherit }
	#box-footer1 a, #box-footer2 a, #box-footer1 strong, #box-footer2 strong { color: inherit }	#box-footer1 ul, #box-footer2 ul { list-style: none; padding-left: 0; margin: 0; cursor: default } #box-footer1 li, #box-footer2 li { list-style: none; text-align: center; font-size: 0.9em; padding-left: 0; margin-bottom: 0 }
	.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1em; text-align: center }

	/* 	Normal */
		@media screen and (max-width: 1280px) {
			/* 	Basic */
				body, input, select, textarea { font-size: 11pt }
			/* 	Header */
				.dropotron.level-0 { font-size: 1em }
			/* 	Banner */
				#banner { background-attachment: scroll } #banner h2 { font-size: 3.5em }			
				#box-footer1 { padding: 3em 6em 2em 6em; border-radius: 0; height: 360px } 	 			
				#box-footer2 { padding: 3em 6em 2em 6em; border-radius: 0; height: 260px } }	 

		/* 	Narrow */
			@media screen and (max-width: 980px) {
				/* 	Basic */
					body, input, select, textarea { font-size: 11pt } 
					#box-footer1 { padding: 3em 6em 2em 6em; border-radius: 0; height: 360px } 	 			
					#box-footer2 { padding: 3em 6em 2em 6em; border-radius: 0; height: 260px } 			
					.image.logo { display: none !important }
					.grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr) } }

			/* 	Narrower */
				#navPanel, #navButton { display: none }
				@media screen and (max-width: 840px) {
					/* 	Basic */
						html, body { overflow-x: hidden }
						body, input, select, textarea { font-size: 11pt }
						h2 br, h3 br, h4 br, h5 br, h6 br { display: none }
					/* 	Section/Article */
						header br { display: none } header.major { padding: 0 4em }
					/* 	Box */
						.box { padding: 3em 2em }
						.box.features > section { padding: 3em 2em }
						.box .image.featured { margin-left: -2em; width: calc(100% + 4em) }	.box .image.featured:first-child { margin-bottom: 3em; margin-top: -3em } .box .image.featured:last-child { margin-bottom: -3em; margin-top: 3em }
						#box-footer1 { padding: 3em 9.5em 2em 9.5em; border-radius: 0; height: 580px } 	 			
						#box-footer2 { padding: 3em 9.5em 2em 9.5em; border-radius: 0; height: 520px } 	
					/* 	Images */
						.image.header.fit img { margin-top: 0 } 
						.image.logo { display: none !important }
					/* 	Header */
						#page-wrapper { padding-top: 0 }
						#header { display: none }
					/* 	Nav */
						#page-wrapper { -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -moz-transition: -moz-transform 0.5s ease; -webkit-transition: -webkit-transform 0.5s ease; -ms-transition: -ms-transform 0.5s ease; transition: transform 0.5s ease; padding-bottom: 1px }
						#navButton { -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -moz-transition: -moz-transform 0.5s ease; -webkit-transition: -webkit-transform 0.5s ease; -ms-transition: -ms-transform 0.5s ease; transition: transform 0.5s ease; display: block; height: 44px; left: 0; position: fixed; top: 0; width: 100%; z-index: 10001 }
						#navButton .toggle { text-decoration: none; height: 100%; left: 0; position: absolute; top: 0; width: 100%; border: 0; outline: 0 }
						#navButton .toggle:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; text-transform: none !important; font-family: 'Font Awesome 5 Free'; font-weight: 900 }
						#navButton .toggle:before { background: rgba(192, 192, 192, 0.75); border-radius: 6px; color: #fff; content: '\f0c9'; display: block; font-size: 16px; height: 2.25em; left: 0.5em; line-height: 2.25em; position: absolute; text-align: center; top: 0.5em; width: 3.5em }
						#navPanel { -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -moz-transform: translateX(-275px); -webkit-transform: translateX(-275px); -ms-transform: translateX(-275px); transform: translateX(-275px); -moz-transition: -moz-transform 0.5s ease; -webkit-transition: -webkit-transform 0.5s ease; -ms-transition: -ms-transform 0.5s ease; transition: transform 0.5s ease; display: block; height: 100%; left: 0; overflow-y: auto; position: fixed; top: 0; width: 275px; z-index: 10002; background: #2b2b2b; color: #bbb }
						#navPanel .link { border-bottom: 0; border-top: solid 1px rgba(255, 255, 255, 0.05); color: #bbb; display: block; height: 44px; line-height: 44px; padding: 0 1em 0 1em; text-decoration: none }
						#navPanel .link:first-child { border-top: 0 }
						#navPanel .link.depth-0 { color: #fff }
						#navPanel .link .indent-1 { display: inline-block; width: 1em }
						#navPanel .link .indent-2 { display: inline-block; width: 2em }
						#navPanel .link .indent-3 { display: inline-block; width: 3em }
						#navPanel .link .indent-4 { display: inline-block; width: 4em }
						#navPanel .link .indent-5 { display: inline-block; width: 5em } 
						body.navPanel-visible #page-wrapper { -moz-transform: translateX(275px); -webkit-transform: translateX(275px); -ms-transform: translateX(275px); transform: translateX(275px) }
						body.navPanel-visible #navButton { -moz-transform: translateX(275px); -webkit-transform: translateX(275px); -ms-transform: translateX(275px); transform: translateX(275px) }
						body.navPanel-visible #navPanel { -moz-transform: translateX(0); -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } }

				/* 	Mobile */
					@media screen and (max-width: 736px) {
						/* 	Basic */
							body, input, select, textarea { font-size: 14pt }
							h2 { font-size: 2em; line-height: 1.35em } h3 { font-size: 1.8em }	h4 { font-size: 1.4em }	h5 { font-size: 1.2em } h6 { font-size: 1em }
						/* 	Section/Article */
							header.major { padding: 1em } header.major h2 { padding-left: 0.5em; padding-right: 0.5em } header.major p { padding-left: 0.5em; padding-right: 0.5em; font-weight: 600 }
						/* 	Box */
							.box { margin: 1em; overflow-x: hidden; padding: 2em 2em !important } 
							.box.features .features-row { border-top: 0; padding: 0 } .box.features .features-row section { border: 0; border-top: solid 1px #e5e5e5 !important; float: none; margin: 2em 0 0 0 !important; padding: 2em 0 0 0 !important; width: 100% } .box.features .features-row:first-child section:first-child { border-top: 0 !important; margin-top: 0 !important; padding-top: 0 !important }
							.box .image.featured { margin-left: -2em; width: calc(100% + 4em) }	.box .image.featured:first-child { margin-bottom: 2em; margin-top: -2em } .box .image.featured:last-child { margin-bottom: -2em; margin-top: 2em }
							#box-contact { padding-bottom: 2em !important } 	
							#box-footer1 { padding: 3.5em 10em 2em 10em; border-radius: 0; height: 640px } 
							#box-footer2 { padding: 3.5em 10em 2em 10em; border-radius: 0; height: 520px } 			
							.grid, .grid-3, .grid-4 { grid-template-columns: 1fr }   		
						/* 	Images */
							.image.header.fit { height: 300px }	.image.header.fit img { -o-object-fit: cover; object-fit: cover; overflow: hidden; height: 300px; width: 150%; margin-top: 0; margin-left: -25% } 					
							.image.fit { margin: 0 } .image.fit img { display: block; width: 100% }			
							.image.fit2 { margin-top: 4em }
							.image.fit3 { display: flex; justify-content: center; margin-bottom: 2.2em } .image.fit3 img { display: block; width: 75% }			
							.image.fit4 img { display: block; width: 90% } 
							.image.logo { display: inline-block; vertical-align: top; width: 80px; height: 80px; margin-right: 10px; margin-top: 10px } 
						/* 	Banner */
							#banner { padding: 4em 0 } #banner h2 { font-size: 2.25em; margin: 0 0 0.5em 0; padding: 0 } #banner p { font-size: 1.25em; padding: 1em }
						/* 	Main */
							#main { padding: 1em 0 0 0 } #main > header { margin: 0 2em 1.5em 2em } #main > header h2 { font-size: 2.2em } #main > header p { font-size: 1.3em; font-weight: 600; padding-bottom: 1em }
							body.landing #main { padding: 0; margin-top: 0 }
						/* 	iFrame */		
							.responsiveCal { position: relative; padding-bottom: 75%; height: 0; overflow: hidden } .responsiveCal iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% }
						/* 	Footer */
							#footer { padding: 4em 0 } #footer .copyright li { border-left: 0; display: block; line-height: 2em; margin-left: 0; padding-left: 0 } }

					/* 	Mobile (Portrait) */
						@media screen and (max-width: 480px) {
							/* 	Basic */
								html, body { min-width: 320px }
							/* 	Section/Article */
								header.major { padding: 0 } 
							/* 	List */
								ul.actions { margin: 0 0 2em 0 } ul.actions li { display: block; padding: 1em 0 0 0; text-align: center; width: 100% } ul.actions li:first-child { padding-top: 0 } ul.actions li > * { width: 100%; margin: 0 !important }	ul.actions li > *.icon:before { margin-left: -2em }	ul.actions.small li { padding: 0.5em 0 0 0 } ul.actions.small li:first-child { padding-top: 0 } ul.actions:not(.fixed) { -moz-flex-direction: column; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; margin-left: 0; width: 100% !important } ul.actions:not(.fixed) li { -moz-flex-grow: 1; -webkit-flex-grow: 1; -ms-flex-grow: 1; flex-grow: 1; -moz-flex-shrink: 1; -webkit-flex-shrink: 1; -ms-flex-shrink: 1; flex-shrink: 1; padding: 1em 0 0 0; text-align: center; width: 100% } ul.actions:not(.fixed) li > * { width: 100% } ul.actions:not(.fixed) li:first-child { padding-top: 0 } ul.actions:not(.fixed) li input[type="submit"], ul.actions:not(.fixed) li input[type="reset"], ul.actions:not(.fixed) li input[type="button"], ul.actions:not(.fixed) li button, ul.actions:not(.fixed) li .button { width: 100% } ul.actions:not(.fixed) li input[type="submit"].icon:before, ul.actions:not(.fixed) li input[type="reset"].icon:before, ul.actions:not(.fixed) li input[type="button"].icon:before, ul.actions:not(.fixed) li button.icon:before, ul.actions:not(.fixed) li .button.icon:before { margin-left: -0.5em }
							/* 	Box */
								.box { border-radius: 0; box-shadow: none; margin: 1em 0 0 0; padding: 3em 1em !important }			
								.box.features .features-row section { margin: 3em 0 0 0 !important; padding: 3em 0 0 0 !important }
								.box .image.featured { border-radius: 0; margin-left: -1em; width: calc(100% + 2em) } .box .image.featured img { border-radius: 0 !important } .box .image.featured:first-child { margin-bottom: 3em; margin-top: -3em } .box .image.featured:last-child { margin-bottom: -3em; margin-top: 3em }
								#box-doe-een-gift { padding: 4em 2.5em 4em 2.5em; border-radius: 0 }		
								#box-openingstijden, #box-aanvraagformulier, #box-dier-adoptieformulier, #box-dieren-voorwaarden, #box-donatieformulier, #box-contactformulier { padding: 2em 3em 1.3em 3em; margin-top: 1em; border-radius: 0 }
								#box-contact { padding: 2em 0 1.3em 0 } 
								#box-footer1 { margin-top: 1em; padding: 3.5em 2em 2em 2em; border-radius: 0; height: 700px } #box-footer1 h3 { font-size: 1.4em }			
								#box-footer2 { padding: 3em 1em 2em 1em; border-radius: 0; height: 560px } #box-footer2 h3 { font-size: 1.4em } 
								#box-footer1 ul, #box-footer2 ul { cursor: default; list-style: none; padding-left: 0 } #box-footer1 li, #box-footer2 li { list-style: none; font-size: 0.9em; text-align: center; padding-left: 0 }				
								#footer .copyright { font-size: 0.9em; line-height: 3em; margin: 0; padding-left: 0; padding-right: 0; text-align: center } #footer .copyright ul { cursor: default; list-style: none; padding-left: 0 } #footer .copyright li { list-style: none; text-align: center; padding-left: 0 }		
							/* 	Banner */
								#banner { padding: 5em 2em 4em 2em } #banner h2 { font-size: 2.6em; margin: 0 0 0.5em 0; padding: 0 } #banner p { font-size: 1.5em; padding: 1em; line-height: 1.5em }
							/* 	Main */
								#main > .box:first-child { margin-top: 0 } }