/**
 * Variables
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
/*
   Colors
   ========================================================================== */
/*
   Site definitions
   ========================================================================== */
/*
   Forms
   ========================================================================== */
/*
   Navbar
   ========================================================================== */
/*
   Media
   ========================================================================== */
/*
   Modals
   ========================================================================== */
/**
 * Mixins
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
.w-100 {
  width: 100% !important; }

.m-x-auto {
  margin-right: auto !important;
  margin-left: auto !important; }

.m-a-0 {
  margin: 0 0 !important; }

.m-t-0 {
  margin-top: 0 !important; }

.m-r-0 {
  margin-right: 0 !important; }

.m-b-0 {
  margin-bottom: 0 !important; }

.m-l-0 {
  margin-left: 0 !important; }

.m-x-0 {
  margin-right: 0 !important;
  margin-left: 0 !important; }

.m-y-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important; }

.m-a-1 {
  margin: 1rem 1rem !important; }

.m-t-1 {
  margin-top: 1rem !important; }

.m-r-1 {
  margin-right: 1rem !important; }

.m-b-1 {
  margin-bottom: 1rem !important; }

.m-l-1 {
  margin-left: 1rem !important; }

.m-x-1 {
  margin-right: 1rem !important;
  margin-left: 1rem !important; }

.m-y-1 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important; }

.m-a-2 {
  margin: 1.5rem 1.5rem !important; }

.m-t-2 {
  margin-top: 1.5rem !important; }

.m-r-2 {
  margin-right: 1.5rem !important; }

.m-b-2 {
  margin-bottom: 1.5rem !important; }

.m-l-2 {
  margin-left: 1.5rem !important; }

.m-x-2 {
  margin-right: 1.5rem !important;
  margin-left: 1.5rem !important; }

.m-y-2 {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important; }

.m-a-3 {
  margin: 3rem 3rem !important; }

.m-t-3 {
  margin-top: 3rem !important; }

.m-r-3 {
  margin-right: 3rem !important; }

.m-b-3 {
  margin-bottom: 3rem !important; }

.m-l-3 {
  margin-left: 3rem !important; }

.m-x-3 {
  margin-right: 3rem !important;
  margin-left: 3rem !important; }

.m-y-3 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important; }

.m-a-5 {
  margin: 5rem 5rem !important; }

.m-t-5 {
  margin-top: 5rem !important; }

.m-r-5 {
  margin-right: 5rem !important; }

.m-b-5 {
  margin-bottom: 5rem !important; }

.m-l-5 {
  margin-left: 5rem !important; }

.m-x-5 {
  margin-right: 5rem !important;
  margin-left: 5rem !important; }

.m-y-5 {
  margin-top: 5rem !important;
  margin-bottom: 5rem !important; }

.p-a-0 {
  padding: 0 0 !important; }

.p-t-0 {
  padding-top: 0 !important; }

.p-r-0 {
  padding-right: 0 !important; }

.p-b-0 {
  padding-bottom: 0 !important; }

.p-l-0 {
  padding-left: 0 !important; }

.p-x-0 {
  padding-right: 0 !important;
  padding-left: 0 !important; }

.p-y-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important; }

.p-a-1 {
  padding: 1rem 1rem !important; }

.p-t-1 {
  padding-top: 1rem !important; }

.p-r-1 {
  padding-right: 1rem !important; }

.p-b-1 {
  padding-bottom: 1rem !important; }

.p-l-1 {
  padding-left: 1rem !important; }

.p-x-1 {
  padding-right: 1rem !important;
  padding-left: 1rem !important; }

.p-y-1 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important; }

.p-a-2 {
  padding: 1.5rem 1.5rem !important; }

.p-t-2 {
  padding-top: 1.5rem !important; }

.p-r-2 {
  padding-right: 1.5rem !important; }

.p-b-2 {
  padding-bottom: 1.5rem !important; }

.p-l-2 {
  padding-left: 1.5rem !important; }

.p-x-2 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important; }

.p-y-2 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important; }

.p-a-3 {
  padding: 3rem 3rem !important; }

.p-t-3 {
  padding-top: 3rem !important; }

.p-r-3 {
  padding-right: 3rem !important; }

.p-b-3 {
  padding-bottom: 3rem !important; }

.p-l-3 {
  padding-left: 3rem !important; }

.p-x-3 {
  padding-right: 3rem !important;
  padding-left: 3rem !important; }

.p-y-3 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important; }

.p-a-5 {
  padding: 5rem 5rem !important; }

.p-t-5 {
  padding-top: 5rem !important; }

.p-r-5 {
  padding-right: 5rem !important; }

.p-b-5 {
  padding-bottom: 5rem !important; }

.p-l-5 {
  padding-left: 5rem !important; }

.p-x-5 {
  padding-right: 5rem !important;
  padding-left: 5rem !important; }

.p-y-5 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important; }

.pos-f-t {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030; }

.invisible {
  visibility: hidden !important; }

.hidden-xs-up {
  display: none !important; }

@media (max-width: 543px) {
  .hidden-xs-down {
    display: none !important; } }

@media (min-width: 544px) {
  .hidden-sm-up {
    display: none !important; } }

@media (max-width: 767px) {
  .hidden-sm-down {
    display: none !important; } }

@media (min-width: 768px) {
  .hidden-md-up {
    display: none !important; } }

@media (max-width: 991px) {
  .hidden-md-down {
    display: none !important; } }

@media (min-width: 992px) {
  .hidden-lg-up {
    display: none !important; } }

@media (max-width: 1199px) {
  .hidden-lg-down {
    display: none !important; } }

@media (min-width: 1200px) {
  .hidden-xl-up {
    display: none !important; } }

.hidden-xl-down {
  display: none !important; }

.visible-print-block {
  display: none !important; }
@media print {
  .visible-print-block {
    display: block !important; } }

.visible-print-inline {
  display: none !important; }
@media print {
  .visible-print-inline {
    display: inline !important; } }

.visible-print-inline-block {
  display: none !important; }
@media print {
  .visible-print-inline-block {
    display: inline-block !important; } }

@media print {
  .hidden-print {
    display: none !important; } }

.img-fluid {
  display: block;
  max-width: 100%;
  height: auto; }

.img-rounded {
  border-radius: 0.4rem; }

.img-thumbnail {
  padding: 0.25rem;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 0.25rem;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto; }

.img-circle {
  border-radius: 50%; }

.figure {
  display: inline-block; }

.figure-img {
  margin-bottom: 0.5rem;
  line-height: 1; }

.figure-caption {
  font-size: 90%;
  color: #818a91; }

/**
 * Fonts
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
/* BerninoSans-Web-CondensedExtrabold */
@font-face {
  font-family: 'BerninoSans Web Condensed';
  font-style: normal;
  font-weight: 800;
  src: url("../font/BerninoSans-Web-CondensedExtrabold.eot");
  /* IE9 Compat Modes */
  src: local("BerninoSans Web CondensedExtrabold"), local("BerninoSans-Web-CondensedExtrabold"), url("../font/BerninoSans-Web-CondensedExtrabold.eot?#iefix") format("embedded-opentype"), url("../font/BerninoSans-Web-CondensedExtrabold.woff2") format("woff2"), url("../font/BerninoSans-Web-CondensedExtrabold.woff") format("woff"), url("../font/BerninoSans-Web-CondensedExtrabold.ttf") format("truetype"), url("../font/BerninoSans-Web-CondensedExtrabold.svg#BerninoSans") format("svg");
  /* Legacy iOS */ }

/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url("../font/lato-v11-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Lato Regular"), local("Lato-Regular"), url("../font/lato-v11-latin-regular.eot?#iefix") format("embedded-opentype"), url("../font/lato-v11-latin-regular.woff2") format("woff2"), url("../font/lato-v11-latin-regular.woff") format("woff"), url("../font/lato-v11-latin-regular.ttf") format("truetype"), url("../font/lato-v11-latin-regular.svg#Lato") format("svg");
  /* Legacy iOS */ }

/* lato-italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: url("../font/lato-v11-latin-italic.eot");
  /* IE9 Compat Modes */
  src: local("Lato Italic"), local("Lato-Italic"), url("../font/lato-v11-latin-italic.eot?#iefix") format("embedded-opentype"), url("../font/lato-v11-latin-italic.woff2") format("woff2"), url("../font/lato-v11-latin-italic.woff") format("woff"), url("../font/lato-v11-latin-italic.ttf") format("truetype"), url("../font/lato-v11-latin-italic.svg#Lato") format("svg");
  /* Legacy iOS */ }

/* lato-700 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url("../font/lato-v11-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Lato Bold"), local("Lato-Bold"), url("../font/lato-v11-latin-700.eot?#iefix") format("embedded-opentype"), url("../font/lato-v11-latin-700.woff2") format("woff2"), url("../font/lato-v11-latin-700.woff") format("woff"), url("../font/lato-v11-latin-700.ttf") format("truetype"), url("../font/lato-v11-latin-700.svg#Lato") format("svg");
  /* Legacy iOS */ }

/* lato-900 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url("../font/lato-v11-latin-900.eot");
  /* IE9 Compat Modes */
  src: local("Lato Black"), local("Lato-Black"), url("../font/lato-v11-latin-900.eot?#iefix") format("embedded-opentype"), url("../font/lato-v11-latin-900.woff2") format("woff2"), url("../font/lato-v11-latin-900.woff") format("woff"), url("../font/lato-v11-latin-900.ttf") format("truetype"), url("../font/lato-v11-latin-900.svg#Lato") format("svg");
  /* Legacy iOS */ }

/**
 * Type
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
/**
 * Base
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
html {
  box-sizing: border-box; }

*,
*::before,
*::after {
  box-sizing: inherit; }

html {
  font-size: 62.5%;
  min-height: 100%;
  position: relative; }

html, body {
  height: 100%; }

html, button, input, select, textarea {
  color: #373545; }

body {
  font-weight: 400;
  font-family: 'Lato', Helvetica, Arial, sans-serif;
  background-color: #f1f3f6;
  color: #373545;
  font-size: 16px;
  line-height: 1.6875; }

a {
  color: #909cb1;
  text-decoration: none; }
a:hover {
  color: #72819c;
  text-decoration: underline; }
a:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  font-family: 'BerninoSans Web Condensed', 'Lato', Helvetica, Arial, sans-serif; }

figure {
  margin: 0; }

img {
  vertical-align: middle; }

fieldset {
  border: 0;
  margin: 0;
  padding: 0; }

textarea {
  resize: vertical; }

::-moz-selection {
  background-color: #cec8b9; }

::selection {
  background-color: #cec8b9; }

/**
 * Helpers
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0; }

.text--right {
  text-align: right; }

.text--center {
  text-align: center; }
.text--center .img-fluid {
  display: block;
  max-width: 100%;
  height: auto;
  display: inline-block; }

.text--left {
  text-align: left; }

.help-elkaar .article__title:after, .help-elkaar
.modal-header, .help-elkaar
.btn--add {
  background-color: #9eb01e; }

.vragenkast .article__title:after, .vragenkast
.modal-header, .vragenkast
.btn--add {
  background-color: #ff9900; }

.droomkussen .article__title:after, .droomkussen
.modal-header, .droomkussen
.btn--add {
  background-color: #e9436b; }

.gedichten .article__title:after, .gedichten
.modal-header, .gedichten
.btn--add {
  background-color: #00a0e4; }

.klaagmuur .article__title:after, .klaagmuur
.modal-header, .klaagmuur
.btn--add {
  background-color: #faca42; }

.shout-out .article__title:after, .shout-out
.modal-header, .shout-out
.btn--add {
  background-color: #faca42; }

.chat .article__title:after, .chat
.modal-header, .chat
.btn--add {
  background-color: #909cb1; }

.adult .article__title:after, .adult
.modal-header, .adult
.btn--add {
  background-color: #faca42; }

.help-elkaar .article__topic {
  color: #9eb01e; }

.vragenkast .article__topic {
  color: #ff9900; }

.droomkussen .article__topic {
  color: #e9436b; }

.gedichten .article__topic {
  color: #00a0e4; }

.klaagmuur .article__topic {
  color: #faca42; }

.shout-out .article__topic {
  color: #faca42; }

.chat .article__topic {
  color: #909cb1; }

.adult .article__topic {
  color: #faca42; }

.help-elkaar .emoji {
  border-color: #9eb01e; }

.vragenkast .emoji {
  border-color: #ff9900; }

.droomkussen .emoji {
  border-color: #e9436b; }

.gedichten .emoji {
  border-color: #00a0e4; }

.klaagmuur .emoji {
  border-color: #faca42; }

.shout-out .emoji {
  border-color: #faca42; }

.chat .emoji {
  border-color: #909cb1; }

.adult .emoji {
  border-color: #faca42; }

.help-elkaar .btn--theme {
  color: #fff;
  background-color: #9eb01e;
  border-color: #9eb01e; }
.help-elkaar .btn--theme:hover {
  color: #fff;
  background-color: #778417;
  border-color: #6f7c15; }
.help-elkaar .btn--theme:focus, .help-elkaar .btn--theme.focus {
  color: #fff;
  background-color: #778417;
  border-color: #6f7c15; }
.help-elkaar .btn--theme:active, .help-elkaar .btn--theme.active,
.open > .help-elkaar .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #778417;
  border-color: #6f7c15;
  background-image: none; }
.help-elkaar .btn--theme:active:hover, .help-elkaar .btn--theme:active:focus, .help-elkaar .btn--theme:active.focus, .help-elkaar .btn--theme.active:hover, .help-elkaar .btn--theme.active:focus, .help-elkaar .btn--theme.active.focus,
.open > .help-elkaar .btn--theme.dropdown-toggle:hover,
.open > .help-elkaar .btn--theme.dropdown-toggle:focus,
.open > .help-elkaar .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #5c6611;
  border-color: #3c430b; }
.help-elkaar .btn--theme.disabled:focus, .help-elkaar .btn--theme.disabled.focus, .help-elkaar .btn--theme:disabled:focus, .help-elkaar .btn--theme:disabled.focus {
  background-color: #9eb01e;
  border-color: #9eb01e; }
.help-elkaar .btn--theme.disabled:hover, .help-elkaar .btn--theme:disabled:hover {
  background-color: #9eb01e;
  border-color: #9eb01e; }

.vragenkast .btn--theme {
  color: #fff;
  background-color: #ff9900;
  border-color: #ff9900; }
.vragenkast .btn--theme:hover {
  color: #fff;
  background-color: #cc7a00;
  border-color: #c27400; }
.vragenkast .btn--theme:focus, .vragenkast .btn--theme.focus {
  color: #fff;
  background-color: #cc7a00;
  border-color: #c27400; }
.vragenkast .btn--theme:active, .vragenkast .btn--theme.active,
.open > .vragenkast .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #cc7a00;
  border-color: #c27400;
  background-image: none; }
.vragenkast .btn--theme:active:hover, .vragenkast .btn--theme:active:focus, .vragenkast .btn--theme:active.focus, .vragenkast .btn--theme.active:hover, .vragenkast .btn--theme.active:focus, .vragenkast .btn--theme.active.focus,
.open > .vragenkast .btn--theme.dropdown-toggle:hover,
.open > .vragenkast .btn--theme.dropdown-toggle:focus,
.open > .vragenkast .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #a86500;
  border-color: #804d00; }
.vragenkast .btn--theme.disabled:focus, .vragenkast .btn--theme.disabled.focus, .vragenkast .btn--theme:disabled:focus, .vragenkast .btn--theme:disabled.focus {
  background-color: #ff9900;
  border-color: #ff9900; }
.vragenkast .btn--theme.disabled:hover, .vragenkast .btn--theme:disabled:hover {
  background-color: #ff9900;
  border-color: #ff9900; }

.droomkussen .btn--theme {
  color: #fff;
  background-color: #e9436b;
  border-color: #e9436b; }
.droomkussen .btn--theme:hover {
  color: #fff;
  background-color: #df1a4a;
  border-color: #d61947; }
.droomkussen .btn--theme:focus, .droomkussen .btn--theme.focus {
  color: #fff;
  background-color: #df1a4a;
  border-color: #d61947; }
.droomkussen .btn--theme:active, .droomkussen .btn--theme.active,
.open > .droomkussen .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #df1a4a;
  border-color: #d61947;
  background-image: none; }
.droomkussen .btn--theme:active:hover, .droomkussen .btn--theme:active:focus, .droomkussen .btn--theme:active.focus, .droomkussen .btn--theme.active:hover, .droomkussen .btn--theme.active:focus, .droomkussen .btn--theme.active.focus,
.open > .droomkussen .btn--theme.dropdown-toggle:hover,
.open > .droomkussen .btn--theme.dropdown-toggle:focus,
.open > .droomkussen .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #bf163f;
  border-color: #9a1233; }
.droomkussen .btn--theme.disabled:focus, .droomkussen .btn--theme.disabled.focus, .droomkussen .btn--theme:disabled:focus, .droomkussen .btn--theme:disabled.focus {
  background-color: #e9436b;
  border-color: #e9436b; }
.droomkussen .btn--theme.disabled:hover, .droomkussen .btn--theme:disabled:hover {
  background-color: #e9436b;
  border-color: #e9436b; }

.gedichten .btn--theme {
  color: #fff;
  background-color: #00a0e4;
  border-color: #00a0e4; }
.gedichten .btn--theme:hover {
  color: #fff;
  background-color: #007cb1;
  border-color: #0075a7; }
.gedichten .btn--theme:focus, .gedichten .btn--theme.focus {
  color: #fff;
  background-color: #007cb1;
  border-color: #0075a7; }
.gedichten .btn--theme:active, .gedichten .btn--theme.active,
.open > .gedichten .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #007cb1;
  border-color: #0075a7;
  background-image: none; }
.gedichten .btn--theme:active:hover, .gedichten .btn--theme:active:focus, .gedichten .btn--theme:active.focus, .gedichten .btn--theme.active:hover, .gedichten .btn--theme.active:focus, .gedichten .btn--theme.active.focus,
.open > .gedichten .btn--theme.dropdown-toggle:hover,
.open > .gedichten .btn--theme.dropdown-toggle:focus,
.open > .gedichten .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #00638d;
  border-color: #004765; }
.gedichten .btn--theme.disabled:focus, .gedichten .btn--theme.disabled.focus, .gedichten .btn--theme:disabled:focus, .gedichten .btn--theme:disabled.focus {
  background-color: #00a0e4;
  border-color: #00a0e4; }
.gedichten .btn--theme.disabled:hover, .gedichten .btn--theme:disabled:hover {
  background-color: #00a0e4;
  border-color: #00a0e4; }

.klaagmuur .btn--theme {
  color: #fff;
  background-color: #faca42;
  border-color: #faca42; }
.klaagmuur .btn--theme:hover {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907; }
.klaagmuur .btn--theme:focus, .klaagmuur .btn--theme.focus {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907; }
.klaagmuur .btn--theme:active, .klaagmuur .btn--theme.active,
.open > .klaagmuur .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907;
  background-image: none; }
.klaagmuur .btn--theme:active:hover, .klaagmuur .btn--theme:active:focus, .klaagmuur .btn--theme:active.focus, .klaagmuur .btn--theme.active:hover, .klaagmuur .btn--theme.active:focus, .klaagmuur .btn--theme.active.focus,
.open > .klaagmuur .btn--theme.dropdown-toggle:hover,
.open > .klaagmuur .btn--theme.dropdown-toggle:focus,
.open > .klaagmuur .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #dfa706;
  border-color: #b88905; }
.klaagmuur .btn--theme.disabled:focus, .klaagmuur .btn--theme.disabled.focus, .klaagmuur .btn--theme:disabled:focus, .klaagmuur .btn--theme:disabled.focus {
  background-color: #faca42;
  border-color: #faca42; }
.klaagmuur .btn--theme.disabled:hover, .klaagmuur .btn--theme:disabled:hover {
  background-color: #faca42;
  border-color: #faca42; }

.shout-out .btn--theme {
  color: #fff;
  background-color: #faca42;
  border-color: #faca42; }
.shout-out .btn--theme:hover {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907; }
.shout-out .btn--theme:focus, .shout-out .btn--theme.focus {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907; }
.shout-out .btn--theme:active, .shout-out .btn--theme.active,
.open > .shout-out .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907;
  background-image: none; }
.shout-out .btn--theme:active:hover, .shout-out .btn--theme:active:focus, .shout-out .btn--theme:active.focus, .shout-out .btn--theme.active:hover, .shout-out .btn--theme.active:focus, .shout-out .btn--theme.active.focus,
.open > .shout-out .btn--theme.dropdown-toggle:hover,
.open > .shout-out .btn--theme.dropdown-toggle:focus,
.open > .shout-out .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #dfa706;
  border-color: #b88905; }
.shout-out .btn--theme.disabled:focus, .shout-out .btn--theme.disabled.focus, .shout-out .btn--theme:disabled:focus, .shout-out .btn--theme:disabled.focus {
  background-color: #faca42;
  border-color: #faca42; }
.shout-out .btn--theme.disabled:hover, .shout-out .btn--theme:disabled:hover {
  background-color: #faca42;
  border-color: #faca42; }

.chat .btn--theme {
  color: #fff;
  background-color: #909cb1;
  border-color: #909cb1; }
.chat .btn--theme:hover {
  color: #fff;
  background-color: #72819c;
  border-color: #6c7c98; }
.chat .btn--theme:focus, .chat .btn--theme.focus {
  color: #fff;
  background-color: #72819c;
  border-color: #6c7c98; }
.chat .btn--theme:active, .chat .btn--theme.active,
.open > .chat .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #72819c;
  border-color: #6c7c98;
  background-image: none; }
.chat .btn--theme:active:hover, .chat .btn--theme:active:focus, .chat .btn--theme:active.focus, .chat .btn--theme.active:hover, .chat .btn--theme.active:focus, .chat .btn--theme.active.focus,
.open > .chat .btn--theme.dropdown-toggle:hover,
.open > .chat .btn--theme.dropdown-toggle:focus,
.open > .chat .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #61708a;
  border-color: #505c72; }
.chat .btn--theme.disabled:focus, .chat .btn--theme.disabled.focus, .chat .btn--theme:disabled:focus, .chat .btn--theme:disabled.focus {
  background-color: #909cb1;
  border-color: #909cb1; }
.chat .btn--theme.disabled:hover, .chat .btn--theme:disabled:hover {
  background-color: #909cb1;
  border-color: #909cb1; }

.adult .btn--theme {
  color: #fff;
  background-color: #faca42;
  border-color: #faca42; }
.adult .btn--theme:hover {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907; }
.adult .btn--theme:focus, .adult .btn--theme.focus {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907; }
.adult .btn--theme:active, .adult .btn--theme.active,
.open > .adult .btn--theme.dropdown-toggle {
  color: #fff;
  background-color: #f9bc10;
  border-color: #f8b907;
  background-image: none; }
.adult .btn--theme:active:hover, .adult .btn--theme:active:focus, .adult .btn--theme:active.focus, .adult .btn--theme.active:hover, .adult .btn--theme.active:focus, .adult .btn--theme.active.focus,
.open > .adult .btn--theme.dropdown-toggle:hover,
.open > .adult .btn--theme.dropdown-toggle:focus,
.open > .adult .btn--theme.dropdown-toggle.focus {
  color: #fff;
  background-color: #dfa706;
  border-color: #b88905; }
.adult .btn--theme.disabled:focus, .adult .btn--theme.disabled.focus, .adult .btn--theme:disabled:focus, .adult .btn--theme:disabled.focus {
  background-color: #faca42;
  border-color: #faca42; }
.adult .btn--theme.disabled:hover, .adult .btn--theme:disabled:hover {
  background-color: #faca42;
  border-color: #faca42; }

.help-elkaar .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#9eb01e' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.vragenkast .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#ff9900' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.droomkussen .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#e9436b' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.gedichten .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#00a0e4' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.klaagmuur .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#faca42' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.shout-out .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#faca42' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.chat .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#909cb1' fill-rule='evenodd'/%3E%3C/svg%3E"); }

.adult .nav--block li {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#faca42' fill-rule='evenodd'/%3E%3C/svg%3E"); }

/**
 * Variables
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
/*
   Colors
   ========================================================================== */
/*
   Site definitions
   ========================================================================== */
/*
   Forms
   ========================================================================== */
/*
   Navbar
   ========================================================================== */
/*
   Media
   ========================================================================== */
/*
   Modals
   ========================================================================== */
/**
 * Adolescent styles
 */
/**
 * Variables
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
/*
   Colors
   ========================================================================== */
/*
   Site definitions
   ========================================================================== */
/*
   Forms
   ========================================================================== */
/*
   Navbar
   ========================================================================== */
/*
   Media
   ========================================================================== */
/*
   Modals
   ========================================================================== */
/**
 * Mixins
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
body.adolescent,
.style-adolescent {
  /* Custom form controls
     ========================================================================== */
  /*
     Topic bar
     ========================================================================== */
  /*
  .custom-checkbox {
    .custom-control-input:checked ~ .custom-control-indicator {
      background-image: $custom-checkbox-checked-icon;
    }

    .custom-control-input:indeterminate ~ .custom-control-indicator {
      background-color: $custom-checkbox-indeterminate-bg;
      background-image: $custom-checkbox-indeterminate-icon;
      @include box-shadow($custom-checkbox-indeterminate-box-shadow);
    }
  }
*/ }
body.adolescent a:hover.tile,
.style-adolescent a:hover.tile {
  color: #9473b2; }
body.adolescent .topbar,
body.adolescent .bl--poem,
body.adolescent .bl--theme .bl__label:after,
body.adolescent .bl--poll .bl__label:after,
body.adolescent .about,
body.adolescent .btn--more:after,
body.adolescent .btn--more:before,
body.adolescent .bl__image__btn__inner,
.style-adolescent .topbar,
.style-adolescent .bl--poem,
.style-adolescent .bl--theme .bl__label:after,
.style-adolescent .bl--poll .bl__label:after,
.style-adolescent .about,
.style-adolescent .btn--more:after,
.style-adolescent .btn--more:before,
.style-adolescent .bl__image__btn__inner {
  background-color: #9473b2; }
body.adolescent .btn-primary,
.style-adolescent .btn-primary {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .btn-primary:hover,
.style-adolescent .btn-primary:hover {
  color: #fff;
  background-color: #7b569c;
  border-color: #765296; }
body.adolescent .btn-primary:focus, body.adolescent .btn-primary.focus,
.style-adolescent .btn-primary:focus,
.style-adolescent .btn-primary.focus {
  color: #fff;
  background-color: #7b569c;
  border-color: #765296; }
body.adolescent .btn-primary:active, body.adolescent .btn-primary.active,
.open > body.adolescent .btn-primary.dropdown-toggle,
.style-adolescent .btn-primary:active,
.style-adolescent .btn-primary.active,
.open >
.style-adolescent .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #7b569c;
  border-color: #765296;
  background-image: none; }
body.adolescent .btn-primary:active:hover, body.adolescent .btn-primary:active:focus, body.adolescent .btn-primary:active.focus, body.adolescent .btn-primary.active:hover, body.adolescent .btn-primary.active:focus, body.adolescent .btn-primary.active.focus,
.open > body.adolescent .btn-primary.dropdown-toggle:hover,
.open > body.adolescent .btn-primary.dropdown-toggle:focus,
.open > body.adolescent .btn-primary.dropdown-toggle.focus,
.style-adolescent .btn-primary:active:hover,
.style-adolescent .btn-primary:active:focus,
.style-adolescent .btn-primary:active.focus,
.style-adolescent .btn-primary.active:hover,
.style-adolescent .btn-primary.active:focus,
.style-adolescent .btn-primary.active.focus,
.open >
.style-adolescent .btn-primary.dropdown-toggle:hover,
.open >
.style-adolescent .btn-primary.dropdown-toggle:focus,
.open >
.style-adolescent .btn-primary.dropdown-toggle.focus {
  color: #fff;
  background-color: #694985;
  border-color: #543b6b; }
body.adolescent .btn-primary.disabled:focus, body.adolescent .btn-primary.disabled.focus, body.adolescent .btn-primary:disabled:focus, body.adolescent .btn-primary:disabled.focus,
.style-adolescent .btn-primary.disabled:focus,
.style-adolescent .btn-primary.disabled.focus,
.style-adolescent .btn-primary:disabled:focus,
.style-adolescent .btn-primary:disabled.focus {
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .btn-primary.disabled:hover, body.adolescent .btn-primary:disabled:hover,
.style-adolescent .btn-primary.disabled:hover,
.style-adolescent .btn-primary:disabled:hover {
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .btn-outline-primary,
.style-adolescent .btn-outline-primary {
  color: #9473b2;
  background-image: none;
  background-color: transparent;
  border-color: #9473b2; }
body.adolescent .btn-outline-primary:hover,
.style-adolescent .btn-outline-primary:hover {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .btn-outline-primary:focus, body.adolescent .btn-outline-primary.focus,
.style-adolescent .btn-outline-primary:focus,
.style-adolescent .btn-outline-primary.focus {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .btn-outline-primary:active, body.adolescent .btn-outline-primary.active,
.open > body.adolescent .btn-outline-primary.dropdown-toggle,
.style-adolescent .btn-outline-primary:active,
.style-adolescent .btn-outline-primary.active,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .btn-outline-primary:active:hover, body.adolescent .btn-outline-primary:active:focus, body.adolescent .btn-outline-primary:active.focus, body.adolescent .btn-outline-primary.active:hover, body.adolescent .btn-outline-primary.active:focus, body.adolescent .btn-outline-primary.active.focus,
.open > body.adolescent .btn-outline-primary.dropdown-toggle:hover,
.open > body.adolescent .btn-outline-primary.dropdown-toggle:focus,
.open > body.adolescent .btn-outline-primary.dropdown-toggle.focus,
.style-adolescent .btn-outline-primary:active:hover,
.style-adolescent .btn-outline-primary:active:focus,
.style-adolescent .btn-outline-primary:active.focus,
.style-adolescent .btn-outline-primary.active:hover,
.style-adolescent .btn-outline-primary.active:focus,
.style-adolescent .btn-outline-primary.active.focus,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle:hover,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle:focus,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle.focus {
  color: #fff;
  background-color: #694985;
  border-color: #543b6b; }
body.adolescent .btn-outline-primary.disabled:focus, body.adolescent .btn-outline-primary.disabled.focus, body.adolescent .btn-outline-primary:disabled:focus, body.adolescent .btn-outline-primary:disabled.focus,
.style-adolescent .btn-outline-primary.disabled:focus,
.style-adolescent .btn-outline-primary.disabled.focus,
.style-adolescent .btn-outline-primary:disabled:focus,
.style-adolescent .btn-outline-primary:disabled.focus {
  border-color: #c6b5d6; }
body.adolescent .btn-outline-primary.disabled:hover, body.adolescent .btn-outline-primary:disabled:hover,
.style-adolescent .btn-outline-primary.disabled:hover,
.style-adolescent .btn-outline-primary:disabled:hover {
  border-color: #c6b5d6; }
body.adolescent .btn--meldknop,
.style-adolescent .btn--meldknop {
  background-color: #7b569c; }
body.adolescent .topbar__toggle-site,
.style-adolescent .topbar__toggle-site {
  border-left-color: #7b569c; }
body.adolescent .custom-control-input:checked ~ .custom-control-indicator,
.style-adolescent .custom-control-input:checked ~ .custom-control-indicator {
  background-color: #9473b2;
  border-color: #9473b2; }
body.adolescent .custom-control-input:active ~ .custom-control-indicator,
.style-adolescent .custom-control-input:active ~ .custom-control-indicator {
  color: #9473b2;
  background-color: #9473b2; }
body.adolescent .custom-radio .custom-control-input:checked ~ .custom-control-indicator,
.style-adolescent .custom-radio .custom-control-input:checked ~ .custom-control-indicator {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 8 8' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle stroke='#FFFFFF' stroke-width='2' fill='#9473b2' fill-rule='evenodd' cx='4' cy='4' r='3'%3E%3C/circle%3E%3C/svg%3E"); }
body.adolescent .topic-bar .slick-arrow,
.style-adolescent .topic-bar .slick-arrow {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#9473b2' fill-rule='evenodd'/%3E%3C/svg%3E"); }
body.adolescent .modal-backdrop,
.style-adolescent .modal-backdrop {
  background-color: #9473b2; }
body.adolescent .section--subfooter,
.style-adolescent .section--subfooter {
  background-color: #00a3a6; }

.branding {
  background-color: transparent;
  border: 0;
  color: transparent;
  font: 0/0 a;
  text-shadow: none;
  margin: 0;
  padding: 0;
  background-image: url(../img/logo.svg);
  background-repeat: no-repeat;
  background-size: cover;
  height: 142px;
  display: inline-block;
  width: 204px;
  z-index: 40; }
@media (max-width: 991px) {
  .branding {
    height: 82px;
    width: 118px; } }

.branding--splash {
  position: absolute;
  left: 50%;
  z-index: 20;
  margin-left: -130px;
  height: 181px;
  width: 260px;
  margin-top: 5vh; }
@media (max-width: 767px) {
  .branding--splash {
    margin-left: -59px;
    height: 82px;
    margin-top: 199px;
    width: 118px; } }

.branding--footer {
  height: 112px;
  width: 160px; }
@media (min-width: 768px) {
  .branding--footer {
    margin-top: -40px;
    margin-bottom: -40px; } }

.navbar {
  position: relative;
  padding: 0 0; }
.navbar::after {
  content: "";
  display: table;
  clear: both; }
@media (min-width: 544px) {
  .navbar {
    border-radius: 0.25rem; } }

.navbar-full {
  z-index: 1000; }
@media (min-width: 544px) {
  .navbar-full {
    border-radius: 0; } }

.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030; }
@media (min-width: 544px) {
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    border-radius: 0; } }

.navbar-fixed-top {
  top: 0; }

.navbar-fixed-bottom {
  bottom: 0; }

.navbar-sticky-top {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1030;
  width: 100%; }
@media (min-width: 544px) {
  .navbar-sticky-top {
    border-radius: 0; } }

.navbar-brand {
  float: left;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  margin-right: 1rem;
  font-size: 1.25rem; }
.navbar-brand:focus, .navbar-brand:hover {
  text-decoration: none; }
.navbar-brand > img {
  display: block; }

.navbar-divider {
  float: left;
  width: 1px;
  padding-top: .425rem;
  padding-bottom: .425rem;
  margin-right: 0;
  margin-left: 0;
  overflow: hidden; }
.navbar-divider::before {
  content: "\00a0"; }

.navbar-toggler {
  padding: .5rem .75rem;
  font-size: 1.25rem;
  line-height: 1;
  background: none;
  border: 1px solid transparent;
  border-radius: 0.4rem; }
.navbar-toggler:focus, .navbar-toggler:hover {
  text-decoration: none; }

.navbar-nav .nav-item {
  float: left; }

.navbar-nav .nav-link {
  display: block;
  padding-top: .425rem;
  padding-bottom: .425rem; }
.navbar-nav .nav-link + .nav-link {
  margin-left: 1rem; }

.navbar-nav .nav-item + .nav-item {
  margin-left: 1rem; }

.navbar-light .navbar-brand {
  color: rgba(0, 0, 0, 0.8); }
.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
  color: rgba(0, 0, 0, 0.8); }

.navbar-light .navbar-nav .nav-link {
  color: rgba(0, 0, 0, 0.3); }
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
  color: rgba(0, 0, 0, 0.6); }

.navbar-light .navbar-nav .open > .nav-link, .navbar-light .navbar-nav .open > .nav-link:focus, .navbar-light .navbar-nav .open > .nav-link:hover,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .active > .nav-link:focus,
.navbar-light .navbar-nav .active > .nav-link:hover,
.navbar-light .navbar-nav .nav-link.open,
.navbar-light .navbar-nav .nav-link.open:focus,
.navbar-light .navbar-nav .nav-link.open:hover,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.active:focus,
.navbar-light .navbar-nav .nav-link.active:hover {
  color: rgba(0, 0, 0, 0.8); }

.navbar-light .navbar-divider {
  background-color: rgba(0, 0, 0, 0.075); }

.navbar-dark .navbar-brand {
  color: white; }
.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover {
  color: white; }

.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.5); }
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
  color: rgba(255, 255, 255, 0.75); }

.navbar-dark .navbar-nav .open > .nav-link, .navbar-dark .navbar-nav .open > .nav-link:focus, .navbar-dark .navbar-nav .open > .nav-link:hover,
.navbar-dark .navbar-nav .active > .nav-link,
.navbar-dark .navbar-nav .active > .nav-link:focus,
.navbar-dark .navbar-nav .active > .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.open,
.navbar-dark .navbar-nav .nav-link.open:focus,
.navbar-dark .navbar-nav .nav-link.open:hover,
.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link.active:focus,
.navbar-dark .navbar-nav .nav-link.active:hover {
  color: white; }

.navbar-dark .navbar-divider {
  background-color: rgba(255, 255, 255, 0.075); }

.navbar-toggleable-xs::after {
  content: "";
  display: table;
  clear: both; }

@media (max-width: 543px) {
  .navbar-toggleable-xs .navbar-nav .nav-item {
    float: none;
    margin-left: 0; } }

@media (min-width: 544px) {
  .navbar-toggleable-xs {
    display: block !important; } }

.navbar-toggleable-sm::after {
  content: "";
  display: table;
  clear: both; }

@media (max-width: 767px) {
  .navbar-toggleable-sm .navbar-nav .nav-item {
    float: none;
    margin-left: 0; } }

@media (min-width: 768px) {
  .navbar-toggleable-sm {
    display: block !important; } }

.navbar-toggleable-md::after {
  content: "";
  display: table;
  clear: both; }

@media (max-width: 991px) {
  .navbar-toggleable-md .navbar-nav .nav-item {
    float: none;
    margin-left: 0; } }

@media (min-width: 992px) {
  .navbar-toggleable-md {
    display: block !important; } }

.navbar {
  background-color: #fff;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
  margin-top: 47px;
  min-height: 70px; }
@media (min-width: 992px) {
  .navbar {
    height: 90px; } }
.navbar .navbar-toggler {
  float: right;
  margin-top: 18px; }

.navbar__brand {
  position: absolute;
  top: -30px;
  bottom: -20px;
  z-index: 20;
  float: left; }

@media (min-width: 992px) {
  .navbar__nav {
    line-height: 90px;
    float: right; } }

@media (max-width: 991px) {
  .navbar__nav {
    padding-top: 70px;
    padding-bottom: 2rem; } }

/**
 * Module: Nav
 *
 * @author: Rutger Laurman - lekkerduidelijk.nl
 */
.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  transition: opacity .15s linear; }
.fade.in {
  opacity: 1; }

.collapse {
  display: none; }
.collapse.in {
  display: block; }

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-duration: .35s;
  transition-duration: .35s;
  -webkit-transition-property: height;
  transition-property: height; }

.nav {
  margin: 0;
  padding: 0;
  list-style: none; }
.nav ul {
  margin: 0;
  padding: 0;
  list-style: none; }
.nav li {
  margin: 0;
  padding: 0; }

.nav--main {
  background-color: #fff; }
.nav--main li {
  display: block;
  margin: 0 10px; }
@media (min-width: 992px) {
  .nav--main li {
    display: inline-block; } }
.nav--main li.nav__vragenkast a:after {
  background-color: #ff9900; }
.nav--main li.nav__help-elkaar a:after {
  background-color: #9eb01e; }
.nav--main li.nav__droomkussen a:after {
  background-color: #e9436b; }
.nav--main li.nav__gedichten a:after {
  background-color: #00a0e4; }
.nav--main li.nav__klaagmuur a:after {
  background-color: #faca42; }
.nav--main li.nav__shout-out a:after {
  background-color: #faca42; }
.nav--main li.nav__forum a:after {
  background-color: #9eb01e; }
.nav--main li.nav__topics a:after {
  background-color: #ff9900; }
.nav--main li.nav__adult a:after {
  background-color: #909cb1; }
.nav--main li.is-active a:after {
  background-color: #0b1213; }
.nav--main a {
  font-weight: 900;
  color: #373545;
  padding: 10px;
  position: relative; }
@media (max-width: 991px) {
  .nav--main a {
    display: inline-block; } }
.nav--main a:hover {
  text-decoration: none; }
.nav--main a:after {
  border-radius: 100px;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 3px;
  background-color: #9473b2; }
.nav--main .nav__search {
  display: none; }
@media (min-width: 992px) {
  .nav--main .nav__search {
    display: inline-block; } }
.nav--main .nav__search a {
  position: relative;
  top: 5px; }
.nav--main .nav__search a:after {
  display: none; }

.nav--footer {
  display: inline-block; }
.nav--footer a {
  margin: 0 0 0 30px;
  text-decoration: none; }
.nav--footer a:hover {
  text-decoration: underline; }

.nav--subfooter {
  text-align: center; }
@media (min-width: 768px) {
  .nav--subfooter {
    text-align: right; } }
.nav--subfooter li {
  display: inline-block;
  margin: 0 20px; }
.nav--subfooter a {
  color: #fff; }

.nav--block {
  margin-top: 1rem; }
.nav--block ul {
  list-style: none;
  margin: 0;
  padding: 0; }
.nav--block li {
  background-repeat: no-repeat;
  background-position: 0% .5em;
  padding-left: 20px;
  background-size: 12px; }

.topbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: #9eb01e;
  color: #fff;
  font-weight: 900;
  font-size: 16px;
  letter-spacing: 0.03125em; }
.topbar a, .topbar strong, .topbar span {
  margin: 0 .15em; }
.topbar .btn--meldknop {
  margin-right: .8em; }
.topbar a, .topbar strong {
  color: #faca42; }
.topbar__inner {
  text-align: right;
  height: 47px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
.topbar__toggle-site {
  margin-left: .9em;
  padding-left: .3em;
  border-left: 1px solid #fff; }
.topbar__toggle-site a {
  margin: 0; }
.topbar__toggle-site .dropdown-toggle:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI3IiB2aWV3Qm94PSIwIDAgMTIgNyI+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS4wNTgwNjEwOCwyLjQ1MTYyMjEzIEM5LjMxMzc0MjksMi43MDU2ODMxIDkuNDQxNTgzODEsMy4wNTE3MzE2NCA5LjQ0MTU4MzgxLDMuNDMyODIzMDggQzkuNDQxNTgzODEsMy44MTM5MTQ1MiA5LjMxMzc0MjksNC4xNTU1ODI3MSA5LjA1ODA2MTA4LDQuNDE0MDI0MDMgTDQuNzgzOTEzMzUsOS4wMzA5MjQ5MyBDNC4yNzY4MTEwOCw5LjU3ODQ3MDEgMy40NTAxMDY1Myw5LjU3ODQ3MDEgMi45NDMwMDQyNiw5LjAzMDkyNDkzIEMyLjQzNTkwMTk5LDguNDgzMzc5NzUgMi40MzU5MDE5OSw3LjU5ODU0Njc2IDIuOTQzMDA0MjYsNy4wNTEwMDE1OCBMNi4wMDAwMDAwNywzLjQzMjgyMjg4IEwyLjkzODc0MjksLTAuMTY3ODMzOTcgQzIuNDMxNjQwNjIsLTAuNzE1Mzc5MTQzIDIuNDMxNjQwNjIsLTEuNjAwMjEyMTQgMi45Mzg3NDI5LC0yLjE0Nzc1NzMxIEMzLjQ1MDEwNjUzLC0yLjY5NTMwMjQ5IDQuMjcyNTQ5NzIsLTIuNjk1MzAyNDkgNC43ODM5MTMzNSwtMi4xNDc3NTczMSBMOS4wNTgwNjEwOCwyLjQ1MTYyMjEzIFoiIHRyYW5zZm9ybT0icm90YXRlKDkwIDYgMy40NDIpIi8+PC9zdmc+);
  background-repeat: no-repeat;
  border: 0;
  content: "";
  height: 8px;
  width: 12px;
  margin-right: 3px; }
.topbar__toggle-site .dropdown-menu {
  background: #fff;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  border: 0;
  padding: 0;
  margin-top: 7px; }
.topbar__toggle-site .dropdown-menu:after, .topbar__toggle-site .dropdown-menu:before {
  content: "";
  display: block;
  position: absolute;
  top: -6px;
  right: 9px;
  border-bottom: 6px solid #fff;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  z-index: 3; }
.topbar__toggle-site .dropdown-item {
  border-bottom: 1px solid #d5d9df;
  padding: 5px 12px;
  font-size: 14px;
  font-weight: bold;
  color: #373545; }
.topbar__toggle-site .dropdown-item:first-child {
  border-radius: 3px 3px 0 0; }
.topbar__toggle-site .dropdown-item:last-child {
  border-radius: 0 0 3px 3px;
  border-bottom: 0; }

.dropup,
.dropdown {
  position: relative; }

.dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.3em;
  vertical-align: middle;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-left: 0.3em solid transparent; }

.dropdown-toggle:focus {
  outline: 0; }

.dropup .dropdown-toggle::after {
  border-top: 0;
  border-bottom: 0.3em solid; }

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 16px;
  color: #373a3c;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.4rem; }

.dropdown-divider {
  height: 1px;
  margin: 0.5rem 0;
  overflow: hidden;
  background-color: #e5e5e5; }

.dropdown-item {
  display: block;
  width: 100%;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  color: #373a3c;
  text-align: inherit;
  white-space: nowrap;
  background: none;
  border: 0; }
.dropdown-item:focus, .dropdown-item:hover {
  color: #2b2d2f;
  text-decoration: none;
  background-color: #f5f5f5; }
.dropdown-item.active, .dropdown-item.active:focus, .dropdown-item.active:hover {
  color: #fff;
  text-decoration: none;
  background-color: #0275d8;
  outline: 0; }
.dropdown-item.disabled, .dropdown-item.disabled:focus, .dropdown-item.disabled:hover {
  color: #818a91; }
.dropdown-item.disabled:focus, .dropdown-item.disabled:hover {
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
  background-image: none;
  filter: "progid:DXImageTransform.Microsoft.gradient(enabled = false)"; }

.open > .dropdown-menu {
  display: block; }

.open > a {
  outline: 0; }

.dropdown-menu-right {
  right: 0;
  left: auto; }

.dropdown-menu-left {
  right: auto;
  left: 0; }

.dropdown-header {
  display: block;
  padding: 5px 20px;
  font-size: 0.875rem;
  color: #818a91;
  white-space: nowrap; }

.dropdown-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 990; }

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  content: "";
  border-top: 0;
  border-bottom: 0.3em solid; }

.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 2px; }

.footer {
  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;
  min-height: 112px; }
@media (max-width: 991px) {
  .footer {
    padding: 2rem 0;
    text-align: center; } }
@media (min-width: 992px) {
  .footer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    height: 112px; } }

@media (max-width: 767px) {
  .footer__right {
    margin-top: 1rem; } }

@media (min-width: 768px) {
  .footer__right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; } }

header .container, .section--subfooter .container, footer .container {
  margin-left: auto;
  margin-right: auto; }

@media (min-width: 544px) {
  header .container, .section--subfooter .container, footer .container {
    max-width: 576px; } }

@media (min-width: 768px) {
  header .container, .section--subfooter .container, footer .container {
    max-width: 720px; } }

@media (min-width: 992px) {
  header .container, .section--subfooter .container, footer .container {
    max-width: 980px; } }

header .container, .section--subfooter .container, footer .container {
  background: transparent;
  margin: auto;
  padding-right: 10px;
  padding-left: 10px;
  padding-top: 0px;
  padding-bottom: 0px; }

.section--subfooter .container {
  margin-top: 40px; }

header .topbar {
  top: -47px; }

body {
  background-image: none !important;
  background-color: #f1f3f6; }

body,
.style-adolescent {
  /* Custom form controls
     ========================================================================== */
  /*
     Topic bar
     ========================================================================== */
  /*
    .custom-checkbox {
      .custom-control-input:checked ~ .custom-control-indicator {
        background-image: $custom-checkbox-checked-icon;
      }

      .custom-control-input:indeterminate ~ .custom-control-indicator {
        background-color: $custom-checkbox-indeterminate-bg;
        background-image: $custom-checkbox-indeterminate-icon;
        @include box-shadow($custom-checkbox-indeterminate-box-shadow);
      }
    }
  */ }
body a:hover.tile,
.style-adolescent a:hover.tile {
  color: #9473b2; }
body .topbar,
body .bl--poem,
body .bl--theme .bl__label:after,
body .bl--poll .bl__label:after,
body .about,
body .btn--more:after,
body .btn--more:before,
body .bl__image__btn__inner,
.style-adolescent .topbar,
.style-adolescent .bl--poem,
.style-adolescent .bl--theme .bl__label:after,
.style-adolescent .bl--poll .bl__label:after,
.style-adolescent .about,
.style-adolescent .btn--more:after,
.style-adolescent .btn--more:before,
.style-adolescent .bl__image__btn__inner {
  background-color: #9473b2; }
body .btn-primary,
.style-adolescent .btn-primary {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body .btn-primary:hover,
.style-adolescent .btn-primary:hover {
  color: #fff;
  background-color: #7b569c;
  border-color: #765296; }
body .btn-primary:focus, body .btn-primary.focus,
.style-adolescent .btn-primary:focus,
.style-adolescent .btn-primary.focus {
  color: #fff;
  background-color: #7b569c;
  border-color: #765296; }
body .btn-primary:active, body .btn-primary.active,
.open > body .btn-primary.dropdown-toggle,
.style-adolescent .btn-primary:active,
.style-adolescent .btn-primary.active,
.open >
.style-adolescent .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #7b569c;
  border-color: #765296;
  background-image: none; }
body .btn-primary:active:hover, body .btn-primary:active:focus, body .btn-primary:active.focus, body .btn-primary.active:hover, body .btn-primary.active:focus, body .btn-primary.active.focus,
.open > body .btn-primary.dropdown-toggle:hover,
.open > body .btn-primary.dropdown-toggle:focus,
.open > body .btn-primary.dropdown-toggle.focus,
.style-adolescent .btn-primary:active:hover,
.style-adolescent .btn-primary:active:focus,
.style-adolescent .btn-primary:active.focus,
.style-adolescent .btn-primary.active:hover,
.style-adolescent .btn-primary.active:focus,
.style-adolescent .btn-primary.active.focus,
.open >
.style-adolescent .btn-primary.dropdown-toggle:hover,
.open >
.style-adolescent .btn-primary.dropdown-toggle:focus,
.open >
.style-adolescent .btn-primary.dropdown-toggle.focus {
  color: #fff;
  background-color: #694985;
  border-color: #543b6b; }
body .btn-primary.disabled:focus, body .btn-primary.disabled.focus, body .btn-primary:disabled:focus, body .btn-primary:disabled.focus,
.style-adolescent .btn-primary.disabled:focus,
.style-adolescent .btn-primary.disabled.focus,
.style-adolescent .btn-primary:disabled:focus,
.style-adolescent .btn-primary:disabled.focus {
  background-color: #9473b2;
  border-color: #9473b2; }
body .btn-primary.disabled:hover, body .btn-primary:disabled:hover,
.style-adolescent .btn-primary.disabled:hover,
.style-adolescent .btn-primary:disabled:hover {
  background-color: #9473b2;
  border-color: #9473b2; }
body .btn-outline-primary,
.style-adolescent .btn-outline-primary {
  color: #9473b2;
  background-image: none;
  background-color: transparent;
  border-color: #9473b2; }
body .btn-outline-primary:hover,
.style-adolescent .btn-outline-primary:hover {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body .btn-outline-primary:focus, body .btn-outline-primary.focus,
.style-adolescent .btn-outline-primary:focus,
.style-adolescent .btn-outline-primary.focus {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body .btn-outline-primary:active, body .btn-outline-primary.active,
.open > body .btn-outline-primary.dropdown-toggle,
.style-adolescent .btn-outline-primary:active,
.style-adolescent .btn-outline-primary.active,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle {
  color: #fff;
  background-color: #9473b2;
  border-color: #9473b2; }
body .btn-outline-primary:active:hover, body .btn-outline-primary:active:focus, body .btn-outline-primary:active.focus, body .btn-outline-primary.active:hover, body .btn-outline-primary.active:focus, body .btn-outline-primary.active.focus,
.open > body .btn-outline-primary.dropdown-toggle:hover,
.open > body .btn-outline-primary.dropdown-toggle:focus,
.open > body .btn-outline-primary.dropdown-toggle.focus,
.style-adolescent .btn-outline-primary:active:hover,
.style-adolescent .btn-outline-primary:active:focus,
.style-adolescent .btn-outline-primary:active.focus,
.style-adolescent .btn-outline-primary.active:hover,
.style-adolescent .btn-outline-primary.active:focus,
.style-adolescent .btn-outline-primary.active.focus,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle:hover,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle:focus,
.open >
.style-adolescent .btn-outline-primary.dropdown-toggle.focus {
  color: #fff;
  background-color: #694985;
  border-color: #543b6b; }
body .btn-outline-primary.disabled:focus, body .btn-outline-primary.disabled.focus, body .btn-outline-primary:disabled:focus, body .btn-outline-primary:disabled.focus,
.style-adolescent .btn-outline-primary.disabled:focus,
.style-adolescent .btn-outline-primary.disabled.focus,
.style-adolescent .btn-outline-primary:disabled:focus,
.style-adolescent .btn-outline-primary:disabled.focus {
  border-color: #c6b5d6; }
body .btn-outline-primary.disabled:hover, body .btn-outline-primary:disabled:hover,
.style-adolescent .btn-outline-primary.disabled:hover,
.style-adolescent .btn-outline-primary:disabled:hover {
  border-color: #c6b5d6; }
body .btn--meldknop,
.style-adolescent .btn--meldknop {
  background-color: #7b569c; }
body .topbar__toggle-site,
.style-adolescent .topbar__toggle-site {
  border-left-color: #7b569c; }
body .custom-control-input:checked ~ .custom-control-indicator,
.style-adolescent .custom-control-input:checked ~ .custom-control-indicator {
  background-color: #9473b2;
  border-color: #9473b2; }
body .custom-control-input:active ~ .custom-control-indicator,
.style-adolescent .custom-control-input:active ~ .custom-control-indicator {
  color: #9473b2;
  background-color: #9473b2; }
body .custom-radio .custom-control-input:checked ~ .custom-control-indicator,
.style-adolescent .custom-radio .custom-control-input:checked ~ .custom-control-indicator {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 8 8' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle stroke='#FFFFFF' stroke-width='2' fill='#9473b2' fill-rule='evenodd' cx='4' cy='4' r='3'%3E%3C/circle%3E%3C/svg%3E"); }
body .topic-bar .slick-arrow,
.style-adolescent .topic-bar .slick-arrow {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.5 5.01c.255.254.383.6.383.98 0 .382-.128.724-.383.982L5.225 11.59c-.507.547-1.333.547-1.84 0-.508-.548-.508-1.433 0-1.98l3.057-3.62-3.062-3.6c-.507-.547-.507-1.432 0-1.98.512-.547 1.334-.547 1.845 0L9.5 5.01z' fill='#9473b2' fill-rule='evenodd'/%3E%3C/svg%3E"); }
body .modal-backdrop,
.style-adolescent .modal-backdrop {
  background-color: #9473b2; }
body .section--subfooter,
.style-adolescent .section--subfooter {
  background-color: #00a3a6; }

.btn {
  display: inline-block;
  font-weight: 400;
  line-height: 1.25;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 1rem 2rem;
  font-size: 16px;
  border-radius: .4rem;
  transition: all .2s ease-in-out;
}

.btn {
  font-weight: 900;
  font-family: Lato,Helvetica,Arial,sans-serif;
  font-size: 13px;
  line-height: 1.38462;
  text-transform: uppercase;
  letter-spacing: 1px;
}

body.adolescent .btn--meldknop {
  background-color: #7b569c;
}


header .btn {
  display: inline-block;
  font-weight: 400;
  line-height: 1.25;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 1rem 2rem;
  font-size: 16px;
  border-radius: .4rem;
  transition: all .2s ease-in-out;
}

header .btn--meldknop {
  font-weight: 400;
  background-image: url(../img/meldknop.png);
  background-repeat: no-repeat;
  background-position: 8px 50%;
  color: #fff!important;
  font-size: 12px;
  padding: 6px 8px;
  padding-left: 32px;
  text-transform: none;
}



header .btn--meer-hulp {
  background-color: #faca42;
  color: #0b1213!important;
  font-weight: 900;
  font-size: 12px;
  padding: 6px 8px;
  box-shadow: 0 1px 1px 0 rgba(0,0,0,.2);
}

.topbar a, .topbar span, .topbar strong {
  margin: 0 .15em;
}

header .btn+.btn {
  margin-left: 1rem;
}