/* Bolt 2016 */
/* update 3/6/2019 */
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: inherit;
  font-size: 100%;
  vertical-align: baseline; }

html {
  line-height: 1; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

q, blockquote {
  quotes: none; }
  q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none; }

a img {
  border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block; }

body {
  font-family: "source-sans-pro", "franklin-gothic-urw", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 155%; }
  @media (min-width: 500px) {
    body {
      font-size: 1.4em; } }
  @media (min-width: 600px) and (max-width: 960px) {
    body {
      font-size: 1.4em; } }
  @media (min-width: 961px) {
    body {
      font-size: 1.4em; } }

h1, h2, h3, h4, h5, h6 {
  font-family: "franklin-gothic-urw", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
  font-weight: 600; }

h1 {
  margin-top: 0;
  font-size: 1.2em;
  margin-bottom: .5%; }
  @media (min-width: 600px) and (max-width: 960px) {
    h1 {
      font-size: 1.6em;
      line-height: 140%; } }
  @media (min-width: 961px) {
    h1 {
      font-size: 2em;
      line-height: 160%; } }

h2 {
  margin-top: 0;
  font-size: 1.4em;
  margin-bottom: .5%; }
  @media (min-width: 600px) and (max-width: 960px) {
    h2 {
      font-size: 1.2em;
      line-height: 140%; } }
  @media (min-width: 961px) {
    h2 {
      font-size: 1.6em;
      line-height: 160%; } }

h3 {
  font-size: 1em;
  margin-top: 5%;
  margin-bottom: .5%; }
  @media (min-width: 600px) and (max-width: 960px) {
    h3 {
      font-size: 1em;
      line-height: 140%; } }
  @media (min-width: 961px) {
    h3 {
      font-size: 1.2em;
      line-height: 160%; } }

p {
  margin-bottom: 1em; }
  @media (min-width: 500px) {
    p {
      margin: 0; } }

@media (min-width: 500px) {
  .intro {
    font-size: 110%; } }
@media (min-width: 961px) {
  .intro {
    max-width: 36em;
    font-size: 120%; } }

.bodytxt,
.nieuwsinhoud p {
  font-size: .9em; }
  @media (min-width: 500px) {
    .bodytxt,
    .nieuwsinhoud p {
      font-size: .75em;
      line-height: 150%; } }
  @media (min-width: 600px) and (max-width: 960px) {
    .bodytxt,
    .nieuwsinhoud p {
      font-size: .80em;
      line-height: 155%; } }
  @media (min-width: 961px) {
    .bodytxt,
    .nieuwsinhoud p {
      font-size: .85em;
      line-height: 155%; } }

ul, ol {
  margin-top: 2%; }

li {
  margin-left: 1.2em;
  list-style: square; }

body {
  background: #3C2a1f;
  color: #ffffff;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }

a,
a:link,
a:hover,
a:visited,
a:active {
  color: #e30552; }

a:hover {
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

a#logo {
  display: block;
  position: absolute;
  right: 0;
  top: 2em; }
  @media (min-width: 500px) {
    a#logo {
      top: 4rem; } }
  @media (min-width: 961px) {
    a#logo {
      top: 8rem; } }

.ctnr {
  position: relative;
  color: #3C2a1f;
  background-color: #ffffff; }

.fotoCtnr {
  border: 2px soild green;
  width: 100%;
  min-height: 220px;
  background: #3C2a1f url("../img/bg_prima.jpg") center top no-repeat; }
  @media (min-width: 500px) {
    .fotoCtnr {
      height: 300px; } }
  @media (min-width: 961px) {
    .fotoCtnr {
      height: 400px; } }

.titelCtnr {
  padding: 2rem 2rem 0; }
  @media (min-width: 500px) {
    .titelCtnr {
      padding: 3rem  3rem 0; } }
  @media (min-width: 961px) {
    .titelCtnr {
      padding: 4rem 4rem 0; } }

.tekstCtnr {
  padding: 2rem; }
  @media (min-width: 500px) {
    .tekstCtnr {
      padding: 3rem; } }
  @media (min-width: 961px) {
    .tekstCtnr {
      padding: 4rem; } }

.titelCtnr + .tekstCtnr {
  padding-top: 1em; }

#content {
  width: auto;
  max-width: 80rem; }
  @media (min-width: 961px) {
    #content {
      margin: 0 auto; } }

.centered {
  text-align: center; }

.noJShidden {
  display: none; }

.bodytxt p {
  margin-bottom: 1em; }

body.home .tekstCtnr,
body.tempera .tekstCtnr,
body.arbeid .tekstCtnr,
body.gedrag .tekstCtnr,
body.sociaal .tekstCtnr,
body.opdrachtgevers .tekstCtnr,
body.vacatures .tekstCtnr {
  max-width: 34em; }

body.home .bodytxt {
  margin-bottom: 4em; }

.uk, .fr {
  display: none; }

nav ul {
  font-size: .94rem;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }
  nav ul li {
    display: block;
    padding: 1px 4px; }
    nav ul li:last-child {
      border: none; }
    nav ul li.vertaling a, nav ul li.vertaling a:link {
      display: inline-block;
      color: #e30552; }
    nav ul li a,
    nav ul li a:link {
      display: block;
      padding: .6em 1.6em;
      text-decoration: none;
      color: #ffffff; }
      nav ul li a:visited,
      nav ul li a:link:visited {
        color: #ffffff; }
      nav ul li a:hover,
      nav ul li a:link:hover {
        color: #e30552;
        background: #573d2d; }

/* funky close-button --> found here: http://codepen.io/raphaelgoetter/pen/ZQvYKV */
.responsive-bttn {
  position: absolute;
  top: 1rem;
  left: 1rem;
  height: 1.6rem;
  width: 1.6rem;
  background-color: transparent;
  background-image: linear-gradient(to right, currentColor, currentColor);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 16%;
  padding: 0;
  outline: 0;
  border: 0;
  color: #ffffff;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: .25s;
  will-change: transform, background-image; }
  .responsive-bttn strong {
    display: none; }
  @media (min-width: 961px) {
    .responsive-bttn {
      display: none; } }

.responsive-bttn::before,
.responsive-bttn::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  display: block;
  height: 16%;
  background: currentColor;
  transition: .25s; }

.responsive-bttn::before {
  top: 0; }

.responsive-bttn::after {
  bottom: 0; }

/*	Removing Firefox's dotted outline on button */
.responsive-bttn::-moz-focus-inner {
  border: 0; }

/* Theming opened nav button */
.responsive-bttn:hover,
.responsive-bttn.open {
  background-image: none; }

.responsive-bttn:hover::before,
.responsive-bttn.open::before {
  transform: rotate(45deg) translate(30%, 180%) translateZ(0); }

.responsive-bttn:hover::after,
.responsive-bttn.open::after {
  transform: rotate(-45deg) translate(30%, -180%) translateZ(0); }

@media (min-width: 961px) {
  #off-canvas {
    display: block;
    width: auto !important;
    backface-visibility: visible !important;
    position: static !important; }
    #off-canvas nav {
      max-width: 80rem;
      margin: 0 auto;
      left: 0;
      z-index: 9999;
      background-color: rgba(60, 42, 31, 0.8);
      display: block;
      position: fixed;
      right: 0; }
    #off-canvas ul {
      font-size: 0em;
      display: block;
      padding: 0 2.4rem;
      margin: 0; }
    #off-canvas li {
      display: inline;
      padding: 0;
      margin: 0;
      border: 0; }
      #off-canvas li.vertaling a, #off-canvas li.vertaling a:link {
        display: inline-block;
        color: #e30552; }
      #off-canvas li a,
      #off-canvas li a:link {
        font-size: 16px;
        display: inline-block;
        padding: .6rem 1.2rem;
        margin: 0;
        text-decoration: none;
        color: #ffffff; }
        #off-canvas li a.active, #off-canvas li a:hover,
        #off-canvas li a:link.active,
        #off-canvas li a:link:hover {
          color: #e30552;
          background: none !important; } }

@media (min-width: 961px) {
  .scotch-panel-canvas {
    -o-transform: translate3d(0px, 0px, 0px) !important;
    -ms-transform: translate3d(0px, 0px, 0px) !important;
    -moz-transform: translate3d(0px, 0px, 0px) !important;
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
    transform: translate3d(0px, 0px, 0px) !important; } }

footer {
  font-size: small;
  padding: 1rem  2rem; }
  @media (min-width: 500px) {
    footer {
      padding: 1rem  3rem; } }
  @media (min-width: 961px) {
    footer {
      padding: 1rem 4rem; } }

body.arbeid .fotoCtnr {
  background: #3C2a1f url("../img/bg_arbeid.jpg") center top no-repeat; }

body.tempera .fotoCtnr {
  background: #3C2a1f url("../img/bg_tempera.jpg") center top no-repeat; }

body.sociaal .fotoCtnr {
  background: #3C2a1f url("../img/bg_sociaal.jpg") center top no-repeat; }

body.gedrag .fotoCtnr {
  background: #3C2a1f url("../img/bg_gedrag.jpg") center top no-repeat; }

body.opdrachtgevers .fotoCtnr {
  background: #3C2a1f url("../img/bg_opdrachtgevers.jpg") center top no-repeat; }

body.vacatures .fotoCtnr {
  background: #3C2a1f url("../img/bg_vacatures.jpg") center top no-repeat; }

body.contact .fotoCtnr {
  background: #3C2a1f url("../img/bg_contact.jpg") center top no-repeat; }

body.nieuws h3 {
  margin-top: 0; }

#TEMhome02 h1 {
  border-top: 1px solid #b68b71;
  padding-top: 1em; }

.terug {
  font-size: .77em; }
  .TEMnewsArchive > .terug {
    margin-top: 1.2em; }

.nieuwstitel {
  margin-top: 0; }

.nieuwstitel a {
  color: #3C2a1f;
  text-decoration: none; }

.nieuwsitem {
  border-bottom: 1px solid #b68b71;
  padding: 1em 0; }

.nieuwsdatum {
  color: #e30552;
  font-size: .7em;
  text-transform: uppercase;
  letter-spacing: 1px; }

@media (min-width: 961px) {
  .terug {
    display: block; }

  .nieuwsitem {
    max-width: 34em; } }
.archive {
  margin-top: 1em; }

body.contact .gegevens {
  width: 100%;
  overflow: auto;
  margin-bottom: 2em; }
@media (min-width: 500px) {
  body.contact .coordinaten {
    width: 50%;
    float: left;
    padding-left: 4%; } }
body.contact .personeel {
  margin-top: 1.6em; }
  body.contact .personeel a {
    display: block; }
body.contact p.meerinfo a {
  display: inline-block;
  background-color: #e30552;
  color: #ffffff;
  padding: 1em 2em;
  text-decoration: none;
  margin-top: 1em; }
  body.contact p.meerinfo a:hover {
    background: #b10440; }

.arbeid #content .tekstCtnr,
.sociaal #content .tekstCtnr {
  max-width: 100%;
  overflow: auto; }

.subsubnav {
  border-bottom: 1px solid #b68b71;
  border-top: 1px solid #b68b71;
  padding: 1em 0;
  margin: 1em 0;
  font-size: 1.2rem;
  display: none; }

.TEMcases {
  margin-top: 2em; }
  .TEMcases h2 {
    padding-top: .4em;
    border-top: 1px solid #b68b71; }

.voorbeeldenvan {
  margin-top: 2em; }

.TEMcase {
  border-top: 1px solid #d9c2b4;
  padding: 1em 0; }
  .TEMcase a {
    text-decoration: none; }

.contactpersoon {
  margin: 1em 0; }
  @media (min-width: 500px) {
    .contactpersoon {
      display: table-cell;
      width: 35%;
      max-width: 400px;
      float: right;
      margin: 0; } }
  @media (min-width: 500px) {
    .contactpersoon {
      margin-top: 2.2em; } }
  .contactpersoon ul li {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: .9em; }
    @media (min-width: 500px) {
      .contactpersoon ul li {
        font-size: .75em;
        line-height: 150%; } }
    @media (min-width: 600px) and (max-width: 960px) {
      .contactpersoon ul li {
        font-size: .80em;
        line-height: 155%; } }
    @media (min-width: 961px) {
      .contactpersoon ul li {
        font-size: .85em;
        line-height: 155%; } }
    .contactpersoon ul li.naam {
      font-weight: bold; }

.label {
  font-size: .8em; }

@media (min-width: 500px) {
  .voorbeelden {
    display: table-cell;
    width: 60%;
    max-width: 600px;
    float: left; } }
#TEMVBarbeid0,
#TEMVBarbeid1,
#TEMVBarbeid2,
.TEMcaseCntr {
  display: block;
  margin-bottom: 1em;
  width: 100%;
  overflow: auto; }

//.vacatures h1 { color: #e30552; }
.vacatures p {
  margin-bottom: 1em; }
.vacatures ul {
  margin-bottom: 2em; }
  
.gegevens div.coordinaten {
padding-left: 0;
margin-left: 0;
margin-bottom: 6em;}

.gegevens div.personeel{
padding-top: 0;}

.gegevens div.personeel h3:first-child {
margin-top: 0;

}