*, h1, h2, h3, h4, h5, h6 {
	font-family: 'Roboto', sans-serif;
}
h1 {
	font-weight: 500;
}
.warning-message {
	padding: .3rem;
	font-size: .8rem;
}
header.smallheader {
	padding-top: .4rem;
	padding-bottom: .2rem;
}
header.smallheader a .fa {
	font-size: 2rem;
}
header.smallheader .logo {
	max-width: 200px;
}
.js-drilldown-back > a::before,
.is-drilldown-submenu-parent > a::after {
	font-size: .6em;
	content: "\f054";
	font-family: FontAwesome;
	border: none;
	font-size: 1.5rem;
	margin-top: -.7rem;
	margin-right: .7rem;
}
.js-drilldown-back > a::before {
	content: "\f053";
	margin-left: 0;
	margin-top: -1.5rem;
	margin-right: 1.5rem;
}
header.header {
	padding-top: 1rem;
	padding-bottom: 1rem;
}
header.header .logo {
	max-width: 300px;
}
header.header .menu {
	margin-top: 1.5rem;
	font-size: 1.1rem;
}
header.header .menu .fa {
	font-size: 1.4rem;
	padding-right: .2rem;
}
nav.mainnav ul.dropdown > li > a {
	font-weight: 600;
	font-size: 1.1rem;
}
nav.mainnav .dropdown.menu>li.is-dropdown-submenu-parent>a::after {
	font-size: .6em;
	content: "\f078";
	font-family: FontAwesome;
	border: none;
	right: 1rem;
	margin-top: -5px;
}
.content > .row {
	padding-top: 1.2rem;
	padding-bottom: 2rem;
}
.galery {
	margin-bottom: 2rem;
}
.galery .column a {
	display: block;
	border: 1px solid;
	text-align:  center;
	padding: 1rem .5rem;
}
.galery .column a img {
	display:  block;
	margin: 0 auto .5rem auto;
}
.voorbeeld {
	display: inline-block;
	text-align: center;
	padding: 0 1rem 1rem 0;
	font-size: .8rem;
	max-width: 50%;
}
.voorbeeld img {
	border: 1px solid;
}
.callout.zwartecross img {
	float: left;
	width: 4rem;
	margin-right: 1rem;
}
.callout.fieldset small {
	white-space: nowrap;
}
.example-card,
.colorbox img {
	border: 2px solid;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(153,153,153,1);
	-moz-box-shadow: 0px 0px 20px 0px rgba(153,153,153,1);
	box-shadow: 0px 0px 20px 0px rgba(153,153,153,1);
}
#imageReveal .image {
	text-align: center;
}
#imageReveal .image img {
	border: 2px solid;
}
footer.footer {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}
footer.copyright {
	padding-top: .5rem;
	padding-bottom: 2rem;
}


/* offcanvas */
.offcanvas-full-screen .menu li {
	border-bottom: 1px solid;
}
.offcanvas-full-screen {
	position: fixed;
	z-index: 1;
	transition: -webkit-transform 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
	-webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: translateY(-100%);
	  -ms-transform: translateY(-100%);
		  transform: translateY(-100%);
	overflow-y: auto;
}
.offcanvas-full-screen.is-transition-overlap {
	z-index: 10;
}
.offcanvas-full-screen.is-open {
  -webkit-transform: translate(0, 0);
      -ms-transform: translate(0, 0);
          transform: translate(0, 0);
}
.offcanvas-full-screen.is-open ~ .off-canvas-content {
  -webkit-transform: translateY(+100%);
      -ms-transform: translateY(+100%);
          transform: translateY(+100%);
}


/* colors */
.offcanvas-full-screen,
.offcanvas-full-screen a,
header.smallheader,
header.smallheader a,
nav.mainnav ul.dropdown > li > a,
nav.mainnav ul.dropdown ul li a:hover,
footer.footer a {
	color: #fff;	/* white */
}
header.header .menu .fa {
	color: #bbb;	/* medium grey */
}
h2,
.galery .column a,
.voorbeeld,
.callout.fieldset small,
footer.copyright {
	color: #666;	/* grey */
}
header.header .menu a:hover .fa,
nav.mainnav ul.dropdown > li > a:hover,
.galery .column a:hover,
footer.footer a:hover {
	color: #b32189;	/* purple */
}


/* background colors */
body,
.callout.zwartecross,
.callout.fieldset {
	background-color: #eee;		/* light grey */
}
header.header,
.content > .row {
	background-color:  #fff;	/* white */
}
nav.mainnav ul.dropdown > li > a:hover,
footer.footer a:hover {
	background-color: rgba(255,255,255,.8);
}
.warning-message {
	background-color: #aecc5d;	/* green */
}
.offcanvas-full-screen,
.offcanvas-full-screen .is-drilldown-submenu,
header.smallheader,
nav.mainnav,
nav.mainnav ul.dropdown ul li a:hover,
footer.footer {
	background-color: #b32189;	/* purple */
}
.is-dropdown-submenu {
	z-index: 999;
}


/* border colors */
.galery .column a,
.voorbeeld img,
.colorbox img,
.example-card,
#imageReveal .image img {
	border-color: #eee;		/* light grey */
}
.galery .column a:hover {
	border-color: #b32189;	/* purple */
}
.offcanvas-full-screen .menu li {
	border-color: rgba(255,255,255,.3);		/* semi white */
}


/* small only */
@media screen and (max-width: 40em) {
}
/* medium only */
@media screen and (min-width: 40em) and (max-width: 64em) {
	header.header .menu {
		margin-top: 0;
	}
}
/* medium */
@media screen and (min-width: 40em) {
}
/* large */
@media screen and (min-width: 64em) {
}
/* max-wrapper */
@media screen and (min-width: 80em) {
}