/*
Theme Name: Veilig Thuis
Theme URI: http://www.020veiligthuis.nl/
Description: The wordpress theme for Veilig Thuis.
Version: 1.5
Author: GGD Amsterdam
Author URI: http://www.ggd.amsterdam.nl/
*/


/*******************************************/
/***              PRE-STUFF              ***/
/*******************************************/


P { margin: 0 0 10px 0; }

@font-face {
  font-family: Gotham;
  src: url(css/gotham-book.otf);
}

@font-face {
  font-family: Gotham;
  src: url(css/gotham-bold.otf);
  font-weight: bold;
}

/*******************************************/
/***             CONTAINERS              ***/
/*******************************************/


HTML, BODY {
  color: #000000;
  font-family: Gotham, Century Gothic, Sans-Serif;
  font-size: 13px;
  line-height: 1.4;
}

BODY {
  padding: 0px;
  margin: 0px;
  background: #FFFFFF;
}


/*******************************************/
/***             CONTAINERS              ***/
/*******************************************/


.wrapper {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 980px;
  min-width: 310px;
  padding: 0 10px;
  position: relative;
  width: 100%;
  /* width: 980px; /* Omdat de website nog niet responsive is, even vastzetten. */
}

.hide-on-mobile {}


/*******************************************/
/***               HEADER                ***/
/*******************************************/


#header {
  display: block;
  overflow: hidden;
  clear: both;
  background: #FFFFFF;
}

#header-top,
#header-top-front {
  background-color: #FFFFFF;
}
#header-top { height: 60px; }
#header-top-front { min-height: 113px; text-align: right; }

#logo {
  position: absolute;
  width: 90px;
  height: 143px;
  top: 15px;
  left: 10px;
  z-index: 100;
}
#logo IMG {
  width: 100%;
  border: 0;
}

#home-category {
  display: block;
  position: absolute;
  color: #057EB2;
  text-decoration: none;
  background-image: url(images/huisje-home.svg);
  background-repeat: no-repeat;
  background-size: 50px auto;
  background-position: -13px center;
  font-size: 12px;
  font-weight: bold;
  top: 15px;
  left: 120px;
  padding: 7px 0 4px 25px;
}
#home-category:hover,
#home-category:focus {
  color: #000000;
  background-image: url(images/huisje-home-zwart.svg);
}

.header-text {
  padding: 15px 0px 0px 0px;
  color: #E22D37;
  font-size: 13px;
  font-weight: bold;
  text-align: right;
}
.header-text-column {
  display: inline-block;
  padding: 0px 0px 0px 22px;
}
.header-text SPAN {
  font-size: 24px;
}

.header-icons {
  display: none;
  height: 75px;
  overflow: hidden;
  box-sizing: border-box;
  padding-top: 15px;
}

#header-icon-menu {
  display: block;
  background-image: url(images/menu-icon-rond.png);
  background-repeat: no-repeat;
  /*background-size: 40px auto;*/
  background-position: center center;
  width: 50px;
  height: 50px;
  float: right;
  cursor: pointer;
}
#header-icon-menu:hover,
#header-icon-menu:focus {
  background-image: url(images/menu-icon-rond-blauw.png);
}
#header-icon-menu.menu-show {
  background-image: url(images/menu-icon-rond-blauw.png);
}

#header-icon-search {
  display: block;
  background-image: url(images/vergrootglas.png);
  background-repeat: no-repeat;
  /*background-size: 34px auto;*/
  background-position: center center;
  width: 50px;
  height: 50px;
  float: right;
  margin-right: 30px;
  cursor: pointer;
}
#header-icon-search:hover,
#header-icon-search:focus {
  background-image: url(images/vergrootglas-blauw.png);
}
#header-icon-search.search-show {
  background-image: url(images/vergrootglas-blauw.png);
}

#search {
  position: relative;
  float: right;
  margin: 5px 0px 0px 20px;
}

#search .screen-reader-text { display: none; }

#search INPUT.search-field {
  border: 1px solid #BBBBBB;
  color: #444444;
  width: 150px;
  font-size: 12px;
  padding: 2px 4px;
}

#search INPUT.search-submit {
  display: none;
  background-color: #057EB2;
  border: 0px;
  color: #FFFFFF;
  font-size: 12px;
  padding: 2px 4px;
}


#header-image { height: 325px; }
#header-image-front { height: 478px; position: relative; }

.header-image {
  background-position: center top;
  background-size: cover;
}

.header-image-01 { background-image: url(images/headers/header-image-01.jpg); }
.header-image-02 { background-image: url(images/headers/header-image-02.jpg); }
.header-image-03 { background-image: url(images/headers/header-image-03.jpg); }
.header-image-04 { background-image: url(images/headers/header-image-04.jpg); }
.header-image-05 { background-image: url(images/headers/header-image-05.jpg); }
.header-image-06 { background-image: url(images/headers/header-image-06.jpg); }
.header-image-07 { background-image: url(images/headers/header-image-07.jpg); background-position: center center; }
.header-image-neutraal { background-image: url(images/headers/header-image-neutraal.jpg); }
.header-professionals-home { background-image: url(images/headers/header-professionals-home.jpg); background-position: center center; }
.header-professionals-01 { background-image: url(images/headers/header-professionals-01.jpg); }
.header-professionals-02 { background-image: url(images/headers/header-professionals-02.jpg); }
.header-professionals-03 { background-image: url(images/headers/header-professionals-03.jpg); }
.header-professionals-04 { background-image: url(images/headers/header-professionals-04.jpg); }
.header-professionals-05 { background-image: url(images/headers/header-professionals-05.jpg); }
.header-professionals-06 { background-image: url(images/headers/header-professionals-06.jpg); }
.header-professionals-07 { background-image: url(images/headers/header-professionals-07.jpg); }
.header-professionals-08 { background-image: url(images/headers/header-professionals-08.jpg); }
.header-professionals-09 { background-image: url(images/headers/header-professionals-09.jpg); }
.header-professionals-10 { background-image: url(images/headers/header-professionals-10.jpg); }
.header-jongeren-home { background-image: url(images/headers/header-jongeren-home.jpg); }
.header-jongeren-01 { background-image: url(images/headers/header-jongeren-01.jpg); }
.header-jongeren-02 { background-image: url(images/headers/header-jongeren-02.jpg); }
.header-jongeren-03 { background-image: url(images/headers/header-jongeren-03.jpg); }
.header-jongeren-04 { background-image: url(images/headers/header-jongeren-04.jpg); }
.header-jongeren-05 { background-image: url(images/headers/header-jongeren-05.jpg); }
.header-jongeren-06 { background-image: url(images/headers/header-jongeren-06.jpg); }
.header-jongeren-07 { background-image: url(images/headers/header-jongeren-07.jpg); }
.header-volwassenen-home { background-image: url(images/headers/header-volwassenen-home.jpg); }
.header-volwassenen-01 { background-image: url(images/headers/header-volwassenen-01.jpg); }
.header-volwassenen-02 { background-image: url(images/headers/header-volwassenen-02.jpg); }
.header-volwassenen-03 { background-image: url(images/headers/header-volwassenen-03.jpg); }
.header-volwassenen-04 { background-image: url(images/headers/header-volwassenen-04.jpg); background-position: center center; }
.header-volwassenen-05 { background-image: url(images/headers/header-volwassenen-05.jpg); }
.header-volwassenen-06 { background-image: url(images/headers/header-volwassenen-06.jpg); }
.header-volwassenen-07 { background-image: url(images/headers/header-volwassenen-07.jpg); }
.header-volwassenen-08 { background-image: url(images/headers/header-volwassenen-08.jpg); }
.header-volwassenen-09 { background-image: url(images/headers/header-volwassenen-09.jpg); }


#header-flags {
  display: block;
  margin-top: 20px;
}

.header-flag-text {
  padding: 10px 20px 10px 0px;
  text-align: right;
  cursor: pointer;
  background-color: #FFFFFF;
  background-image: url(images/arrow.svg);
  background-position: right center;
  background-repeat: no-repeat;
  background-size: 15px auto;
  color: #000000;
}

.header-flags-icons {
  display: none;
  background-color: #FFFFFF;
  padding: 5px 15px 5px 0px;
}
.flags-show .header-flags-icons { display: block; }

.header-flag {
  display: inline-block;
  width: 30px;
  height: 19px;
  margin-left: 15px;
  background-repeat: no-repeat;
  background-size: 30px 19px;
  background-position: center center;
  border: 1px solid #DDDDDD;
}

.header-flag.duitsland { background-image: url(images/vlag-duitsland.png); }
.header-flag.frankrijk { background-image: url(images/vlag-frankrijk.png); }
.header-flag.grootbrittanie { background-image: url(images/vlag-grootbrittanie.png); }
.header-flag.marokko { background-image: url(images/vlag-marokko.png); }
.header-flag.polen { background-image: url(images/vlag-polen.png); }
.header-flag.italie { background-image: url(images/vlag-italie.png); }
.header-flag.spanje { background-image: url(images/vlag-spanje.png); }
.header-flag.turkije { background-image: url(images/vlag-turkije.png); }
.header-flag.roemenie { background-image: url(images/vlag-roemenie.png); }
.header-flag.rusland { background-image: url(images/vlag-rusland.png); }
.header-flag.bulgarije { background-image: url(images/vlag-bulgarije.png); }


#button-weg-van-deze-website {
  display: block;
  float: right;
  background-color: #E22D37;
  color: #FFFFFF;
  margin: 240px 20px 0 0;
  padding: 15px;
  font-size: 17px;
}
#button-weg-van-deze-website:hover,
#button-weg-van-deze-website:focus { background-color: #057EB2; }

.home #button-weg-van-deze-website,
.page-hoofdpagina #button-weg-van-deze-website {
  position: absolute;
  margin: 0;
  top: 27px;
  right: 20px;
}

/*******************************************/
/***               FOOTER                ***/
/*******************************************/


#footer {
  display: block;
  overflow: hidden;
  clear: both;
  background: #000000;
  color: #FFFFFF;
  padding: 10px 10px 60px 10px;
  text-align: center;
  font-size: 12px;
}

#footer UL {
  list-style: none outside none;
  margin: 0;
  padding: 0;
}

#footer UL LI {
  display: inline;
}

#footer A {
  display: inline-block;
  padding: 7px 10px;
  text-decoration: none;
  color: #FFFFFF;
  font-weight: normal;
}
#footer A:hover,
#footer A:focus { color: #057EB2; }


/*******************************************/
/***             NAVIGATION              ***/
/*******************************************/

#nav,
#nav-front {
  position: relative;
  clear: both;
  background-color: #057EB2;
}

#nav { height: 80px; }
#nav-front {
  height: 122px;
  margin-top: -308px;
  margin-bottom: 183px;
}

#nav UL,
#nav-front UL {
  list-style: none outside none;
  margin: 0;
  padding: 0;
}

#nav-main-front  {
  text-align: center;
}

#nav-main-front UL {}

#nav-main-front UL LI.menu-item {
  display: inline;
}
#nav-main-front UL LI.menu-item  A {
  display: inline-block;
  height: 85px;
  margin: 18px 0px;
  padding: 10px 35px;
  border-left: 2px solid #FFFFFF;
  text-align: center;
  font-size: 40px;
  text-decoration: none;
  color: #FFFFFF;
  font-weight: bold;
  box-sizing: border-box;
}
#nav-main-front UL LI.menu-item:first-child A { border-left: 0px; }
#nav-main-front UL LI.menu-item A:hover,
#nav-main-front UL LI.menu-item A:focus { color: #000000; }

#nav-main UL {}

#nav-main UL LI.menu-item {
  display: block;
  float: left;
  max-width: 205px;
}

#nav-main UL LI.menu-item A {
  display: inline-block;
  text-decoration: none;
  color: #FFFFFF;
  font-weight: bold;
  box-sizing: border-box;
  height: 80px;
  padding: 9px 40px 9px 0px;
}
#nav-main UL LI.menu-item A:hover,
#nav-main UL LI.menu-item A:focus { color: #000000; }

#nav-main UL LI.menu-item.current_page_item A { color: #000000; }
#nav-main UL LI.menu-item.current_page_parent A { color: #000000; }
#nav-main UL LI.menu-item.current_page_ancestor A { color: #000000; }

#nav-main UL LI.menu-item UL.sub-menu {
  display: none;
  position: absolute;
  font-size: 13px;
  max-width: 210px;
  background: #057EB2;
  padding: 0px 15px 5px 15px;
  margin-left: -10px;
  z-index: 100;
  text-align: center;
  box-sizing: border-box;
}
#nav-main UL LI.menu-item UL.sub-menu  LI.menu-item {
  border-top: 1px solid #FFFFFF;
  float: none;
}

#nav-main UL LI.menu-item UL.sub-menu  LI.menu-item A {
  display: inline-block;
  color: #FFFFFF;
  padding: 5px 0px;
  text-decoration: none;
  height: auto;
}
#nav-main UL LI.menu-item UL.sub-menu  LI.menu-item A:hover,
#nav-main UL LI.menu-item UL.sub-menu  LI.menu-item A:focus { color: #000000; }


/** Mobile **/

#nav-mobile {
  display: none;
  padding: 0 0 10px 0;
}

#nav-main-mobile UL {
  margin: 0px;
  padding: 0px;
}

#nav-main-mobile UL LI.menu-item {
  display: block;
}

#nav-main-mobile UL LI.menu-item A {
  display: block;
  background-color: #057EB2;
  background-image: url(images/hoofdmenu-pijl.png);
  background-repeat: no-repeat;
  background-position: right center;
  text-decoration: none;
  color: #FFFFFF;
  font-weight: bold;
  box-sizing: border-box;
  padding: 9px 40px 9px 10px;
  border-right: 10px solid #057EB2;
}
#nav-main-mobile UL LI.menu-item A:hover,
#nav-main-mobile UL LI.menu-item A:focus { color: #000000; }

#nav-main-mobile UL LI.menu-item.current_page_item A,
#nav-main-mobile UL LI.menu-item.current_page_parent A,
#nav-main-mobile UL LI.menu-item.current_page_ancestor A { background-color: #000000; border-right: 10px solid #000000; }
#nav-main-mobile UL LI.menu-item.current_page_item A:hover,
#nav-main-mobile UL LI.menu-item.current_page_item A:focus,
#nav-main-mobile UL LI.menu-item.current_page_parent A:hover,
#nav-main-mobile UL LI.menu-item.current_page_parent A:focus,
#nav-main-mobile UL LI.menu-item.current_page_ancestor A:hover,
#nav-main-mobile UL LI.menu-item.current_page_ancestor A:focus { color: #057EB2; }

#nav-main-mobile UL LI.menu-item UL.sub-menu {
  display: block;
  font-size: 13px;
  box-sizing: border-box;
}
#nav-main-mobile UL LI.menu-item UL.sub-menu  LI.menu-item {
  border-top: 1px solid #FFFFFF;
}

#nav-main-mobile UL LI.menu-item UL.sub-menu  LI.menu-item A {
  background-color: #057EB2;
  border-right: 10px solid #057EB2;
  padding-left: 25px;
}
#nav-main-mobile UL LI.menu-item UL.sub-menu  LI.menu-item A:hover,
#nav-main-mobile UL LI.menu-item UL.sub-menu  LI.menu-item A:focus { color: #000000; }

#nav-main-mobile UL LI.menu-item UL.sub-menu LI.menu-item.current_page_item A { color: #000000; }
#nav-main-mobile UL LI.menu-item UL.sub-menu LI.menu-item.current_page_item A:hover,
#nav-main-mobile UL LI.menu-item UL.sub-menu LI.menu-item.current_page_item A:focus { color: #000000; }


/*******************************************/
/***              SECTION                ***/
/*******************************************/


.main {
  display: block;
  overflow: hidden;
  clear: both;
  background: #FFFFFF;
  padding: 30px 0px;
}

.section {
  display: block;
  overflow: hidden;
  clear: both;
  background: #FFFFFF;
  padding: 30px 0px;
}


/*******************************************/
/***            TEKST STIJLEN            ***/
/*******************************************/


H1 {
  color: #E22D37;
  margin: 0 0 30px 0;
  padding: 0px;
  font-size: 22px;
  font-weight: bold;
}
H1.blue { color: #057EB2; }

H2 {
  color: #057EB2;
  margin: 0 0 10px 0;
  padding: 0px;
  font-size: 22px;
  font-weight: bold;
}

H3 {
  color: #057EB2;
  margin: 0 0 10px 0;
  padding: 0px;
  font-size: 18px;
  font-weight: bold;
}
.nieuwsbrief H3 { color: #FFFFFF; }

H4 {
  color: #E22D37;
  margin: 15px 0 0 0;
  padding: 0px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
}
H4.agenda-datum { color: #E22D37; }
H4.nieuws-datum { color: #000000; }

H5 {
  color: #057EB2;
  margin: 0px;
  padding: 0px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
}

H6 {
  color: #E22D37;
  margin: 0px;
  padding: 0px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
}


A {
  color: #057EB2;
  font-weight: bold;
  text-decoration: none;
}

.section A:hover,
.section A:focus { color: #000000; }


/*******************************************/
/***           FORM ELEMENTEN            ***/
/*******************************************/


INPUT, TEXTAREA, BUTTON {
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
}

INPUT.input,
TEXTAREA {
  font-family: inherit;
  font-size: inherit;
}

INPUT.input,
TEXTAREA {
  border: 1px solid #7F9DB9;
  padding: 2px 4px;
}

.volgende INPUT.button { float: right; }
.vorige INPUT.button { float: left; }


/*******************************************/
/***                TEXT                 ***/
/*******************************************/


.grid-padding-right {
  padding-right: 40px;
}

.home-fontsize {
  font-size: 16px;
  line-height: 24px;
}

.tekst-meldpunt{
  background-image: url(images/tekst-meldpunt.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  height: 65px;
}

A.link-more {
  display: inline-block;
  background-color: #057EB2;
  text-decoration: none;
  padding: 5px 10px;
  margin: 10px 0px 5px 0px;
  color: #FFFFFF;
}
A.link-more:hover,
A.link-more:focus { color: #000000; }

.nav-links {}
.nav-previous {}
.nav-next {}

.nav-previous A,
.nav-next A {
  color: #FFFFFF;
  font-weight: bold;
  font-size: 13px;
  background-color: #057EB2;
  padding: 5px 15px 7px 15px;
  border: none;
  text-decoration: none;
}
.nav-previous A:hover,
.nav-previous A:focus,
.nav-next A:hover,
.nav-next A:focus {
  color: #000000;
}

.nav-previous A {
  float: left;
  background-image: url(images/chevron-left_ffffff_14.png);
  background-repeat: no-repeat;
  background-position: 10px center;
  padding-left: 32px;
}

.nav-next A {
  float: right;
  background-image: url(images/chevron-right_ffffff_14.png);
  background-repeat: no-repeat;
  background-position: right center; /* We can't position a number of pixels from the right, so we'll position it all the way to the right and add a border */
  padding-right: 17px;
  border-right: 10px solid #057EB2;
}

.iframe-youtube {
  width: 100%;
  height: auto;
}

/*******************************************/
/***               AGENDA                ***/
/*******************************************/


.hentry {
  margin-bottom: 20px;
}

.news_item {
  margin-bottom: 20px;
}

.news_item h2 {
  margin-bottom: 0px;
}

.news_item_datum {
  display: block;
  font-weight: normal;
  font-size: 11px;
  color: #444444;
  margin-bottom: 10px;
}



/*******************************************/
/***               AGENDA                ***/
/*******************************************/


UL.agenda {
  list-style: none outside none;
  margin: 0;
  padding: 0;
  border-top: 1px solid #CCCCCC;
}

UL.agenda LI {
  border-bottom: 1px solid #CCCCCC;
  padding: 7px 0px;
}

UL.agenda LI A {
  font-weight: bold;
  color: #057EB2;
  text-decoration: none;
}
UL.agenda LI A:hover,
UL.agenda LI A:focus { color: #000000; }

UL.agenda LI A .agenda-datum {
  display: block;
  font-weight: normal;
  font-size: 11px;
  color: #000000;
}


.agenda-tile {
  display: block;
  border: 2px solid #057EB2; 
  width: 300px;
  height: 200px;
  box-sizing: border-box;
  margin: 0px 20px 20px 0px;
  padding: 10px;
  float: left;
  overflow: hidden;
  background-color: #FFFFFF;
}
.agenda-tile:hover,
.agenda-tile:focus { background-color: #057EB2; }

.agenda-tile-datum {
  color: #000000;
  font-size: 20px;
}

.agenda-tile-title {
  color: #057EB2;
  font-size: 16px;
  margin: 5px 0px;
}
.agenda-tile:hover .agenda-tile-title,
.agenda-tile:focus .agenda-tile-title { color: #FFFFFF; }

.agenda-tile-summary {
  color: #000000;
  font-weight: normal;
}


.agenda-content {
  margin: 10px 0px 20px 0px;
  min-height: 100px
}


/*******************************************/
/***            PUBLICATIES              ***/
/*******************************************/


.document-tiles {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: flex-start;
  align-items: flex-start;
}

.document-tile {
  flex: 0 1 31%;
  position: relative;
  border: 2px solid #057EB2; 
  aspect-ratio: 5 / 7;
  box-sizing: border-box;
  overflow: hidden;
  background-color: #FFFFFF;
}
.document-tile:hover,
.document-tile:focus { background-color: #057EB2; }

.document-tile-thumb {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #057EB2;
}
.document-tile-thumb IMG {
  min-width: 100%;
  min-height: 100%;
}
.document-tile:hover .document-tile-thumb IMG,
.document-tile:focus .document-tile-thumb IMG { opacity: 0.8; }

.document-tile-overlay {
  position: absolute;
  background-color: #057EB2;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px;
  min-height: 20%;
}
.document-tile:hover .document-tile-overlay,
.document-tile:focus .document-tile-overlay { background-color: #FFFFFF; }

.document-tile-title {
  color: #FFFFFF;
  font-size: 16px;
  font-weight: bold;
}
.document-tile:hover .document-tile-title,
.document-tile:focus .document-tile-title { color: #057EB2; }

.document-tile-summary {
  color: #000000;
  font-weight: normal;
  overflow-y: hidden;
  height: 90px;
}

.document-content {
  display: inline;
  position: relative;
  float: left; 
  width: 340px; 
  left: 240px;
}

.document-download {
  display: inline;
  position: relative;
  float: left; 
  width: 220px; 
  left: -340px;
}

.document-download IMG {
  box-sizing: border-box;
  width: 100%; /* Same as width of thumbnail in Wordpress. */ 
  height: auto;
  border: 1px solid #444444;
  margin-bottom: 15px;
}

.document-download-button {
  display: block; 
  box-sizing: border-box;
  background-color: #00AEEF;
  text-align: center;
  color: #FFFFFF;
  padding: 5px;
  font-size: 13px;
}
.document-download-button:hover,
.document-download-button:focus { color: #000000; }

.document-download-button-title {
  display: block;
  box-sizing: border-box;
  text-align: center;
}

.document-download-button-image {
  display: block; 
  box-sizing: border-box;
  height: 50px; 
  background-image: url(images/download-pijl.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.document-download-button:hover .document-download-button-image,
.document-download-button:focus .document-download-button-image { background-image: url(images/download-pijl-zwart.svg); }



/*******************************************/
/***              NIEUWS                 ***/
/*******************************************/


.news-tile {
  display: block;
  border: 2px solid #057EB2; 
  width: 300px;
  height: 200px;
  box-sizing: border-box;
  margin: 0px 20px 20px 0px;
  padding: 10px;
  float: left;
  overflow: hidden;
  background-color: #FFFFFF;
}
.news-tile:hover,
.news-tile:focus { background-color: #057EB2; }

.news-tile-datum {
  color: #000000;
  font-size: 12px;
}

.news-tile-title {
  color: #057EB2;
  font-size: 16px;
  margin: 5px 0px;
}
.news-tile:hover .news-tile-title,
.news-tile:focus .news-tile-title { color: #FFFFFF; }

.news-tile-summary {
  color: #000000;
  font-weight: normal;
}


.nieuws-content {
  margin: 10px 0px 20px 0px;
  min-height: 100px
}



/*******************************************/
/***            NIEUWSBRIEF              ***/
/*******************************************/


.nieuwsbrief {
  background-color: #057EB2;
  color: #FFFFFF;
  padding: 10px;
  font-size: 12px;
  margin-top: 40px;
}

.nieuwsbrief-box {
  padding: 10px 0 0 0;
}

.nieuwsbrief-unsubscribe {
  width: 400px;
}

.nieuwsbrief-subscribe table, .nieuwsbrief-unsubscribe table {
  width: 100%;
}

.nieuwsbrief-subscribe th, .nieuwsbrief-unsubscribe th {
  text-align: right;
  width: 85px;
  vertical-align: top;
  padding-right: 4px;
}

.nieuwsbrief-subscribe input {
  background-color: #FFFFFF;
  border: 0px;
}

.nieuwsbrief-subscribe input,
.nieuwsbrief-unsubscribe input {
  width: 100%;
  padding: 2px 4px;
}

.nieuwsbrief-subscribe input.button {
  background-color: #057EB2;
  border: 0px;
  color: #000000;
  font-weight: bold;
}

.nieuwsbrief-subscribe input.button,
.nieuwsbrief-unsubscribe input.button {
  text-align: right;
  width: 70px;
  display: block;
  font-size: 12px;
  margin: 0 0 0 auto;
  cursor: pointer;
}
.nieuwsbrief-subscribe input.button:hover,
.nieuwsbrief-unsubscribe input.button:hover,
.nieuwsbrief-subscribe input.button:focus,
.nieuwsbrief-unsubscribe input.button:focus {
  color: #FFFFFF;
}

.nieuwsbrief-subscribe ul.error, .nieuwsbrief-unsubscribe ul.error{
  padding: 2px 4px;
  border: 1px solid #fff;
  list-style-type: none;
}

.nieuwsbrief-subscribe ul.error {
  font-weight: bold;
  color: #faa;
}

.nieuwsbrief-unsubscribe ul.error {
  color: #f00;
}

.nieuwsbrief-subscribe span.error, .nieuwsbrief-unsubscribe span.error {
  padding: 2px 4px;
}

.nieuwsbrief-subscribe span.error {
  font-weight: bold;
  color: #faa;
}

.nieuwsbrief-unsubscribe span.error {
  color: #f00;
}


.nieuwsbrief-success {
  font-weight: bold;
}

.nieuwsbrief-unsubscribe input.button {
  display: block;
  margin: 20px 0 20px auto;
  width: inherit;
  color: #ffffff;
  font-weight: bold;
  font-size: 15px;
  letter-spacing: 1px;
  background-color: #057EB2;
  padding: 5px 15px 5px 15px;
  border: none;
}

#nieuwsbrief-confirm {
  position: absolute;
  z-index: 100;
  height: 160px;
  top: 50%;
  margin-top: -100px;
  width: 360px;
  left: 50%;
  margin-left: -200px;
  border: 1px solid black;
  background-color: #fff;
  padding: 20px;
}

#nieuwsbrief-confirm p.back {
  position: absolute;
  bottom: 20px;
}

/*******************************************/
/***               PAGINA                ***/
/*******************************************/

UL.blue {
  list-style: none;
  padding:0;
  margin:0;
}

UL.blue LI {
  padding-left: 10px; 
  text-indent: -10px;
  margin: 0 0 5px 0;
}

UL.blue LI:before {
  content: "• ";
  color: #057EB2;
}


UL.snelnaar {
  padding-left: 13px;
  margin: 0 0 20px 0;
  color: #057EB2;
}

UL.snelnaar LI {
  margin: 0 0 3px 0;
}

UL.snelnaar LI A {}


UL.page-menu-sub {
  list-style: none outside none;
  margin: 0 30px 0 0;
  padding: 0;
}

UL.page-menu-sub LI { border-bottom: 1px solid #BBBBBB; }
UL.page-menu-sub LI:first-child { border-top: 1px solid #BBBBBB; }

UL.page-menu-sub LI A {
  display: block;
  color: #057EB2;
  font-weight: bold;
  text-decoration: none;
  padding: 5px 5px 5px 10px;
}
UL.page-menu-sub LI.current-page A { color: #000000; }

.page-menu-sub-mobile { display: none; margin-bottom: 20px;  }
.page-menu-sub-desktop {}


/*******************************************/
/***               BUTTONS               ***/
/*******************************************/


.buttons-doorlink {
  text-align: center;
  padding: 20px;
}

.button-doorlink {
  display: inline-block;
  position: relative;
  width: 290px;
  background-color: #E22D37;
  box-sizing: border-box;
  padding-top: 19px;
  padding-bottom: 19px;
  color: #FFFFFF;
  text-decoration: none;
  text-align: center;
  margin-left: 20px;
  margin-bottom: 20px;
}
.button-doorlink:hover,
.button-doorlink:focus { background-color: #057EB2; }

.button-nietgoed { margin-left: 0;}
.button-zorgen {}

.button-image {
  display: block;
  height: 60px;
  margin-bottom: 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

.button-nietgoed .button-image { background-image: url(images/button-gezicht-nietgoed.svg); }
.button-zorgen .button-image { background-image: url(images/button-gezicht-zorgen.svg); }

.button-text {
  display: block;
  font-size: 17px;
  line-height: 24px;
  font-weight: bold;
  padding: 0px 50px;
}

.button-popup {
  display: none;
  position: absolute;
  width: 250px;
  top: -43px;
  left: 25px;
  z-index: 100;
}

.button-popup-text {
  display: block;
  background-color: #E22D37;
  color: #FFFFFF;
  padding: 10px 20px;
  box-sizing: border-box;
}

.button-popup-arrow {
  display: block;
  position: relative;
  width: 0px;
  height: 0px;
  left: 50%;
  margin-left: -15px;
  border-width: 15px;
  border-style: solid;
  border-color: #E22D37 transparent transparent transparent;
}


/*******************************************/
/***          CONTACTFORMULIER           ***/
/*******************************************/


FORM.wpcf7-form {
  width: 560px;
}

form.wpcf7-form .input_description {
  font-weight: bold;
  color: #000;
  padding-left: 5px;
}

form.wpcf7-form .radio_description {
  font-weight: bold;
  color: #000;
  padding-left: 5px;
}

form.wpcf7-form .wpcf7-not-valid-tip {
  padding-left: 5px;
}

form.wpcf7-form ::-webkit-input-placeholder {
  font-weight: bold;
  color: #000;
}
form.wpcf7-form ::-moz-placeholder {
  font-weight: bold;
  color: #000;
}
form.wpcf7-form :-moz-placeholder {
  font-weight: bold;
  color: #000;
}
form.wpcf7-form :-ms-input-placeholder {
  font-weight: bold;
  color: #000;
}

form.wpcf7-form .row {
  margin: 7px 0 7px 0;
}

input.wpcf7-text,
textarea.wpcf7-textarea {
  width: 100%;
  padding: 6px 4px 4px 4px;
}

input.wpcf7-submit {
  display: block;
  margin: 20px 0 20px auto;
  color: #ffffff;
  font-weight: bold;
  font-size: 15px;
  letter-spacing: 1px;
  background-color: #057EB2;
  padding: 5px 15px 5px 15px;
  border: none;
  float: right;
  cursor: pointer;
}

.home UL.agenda LI A{
	font-size:12px;
}

/* Desktops and laptops ----------- */
@media only screen 
	and (min-width : 1024px) {
	/* Styles */
	.widget-box{
		padding-right: 40px;
	}
}


.section.widgets{
	background-color:#057EB2;
}

.section.widgets a, .section.widgets h2{
	color:#FFF !important;
}


.section.widgets A.link-more{
	background-color:#FFF;
	color: #057EB2 !important;
}

 

.page-template-page-meldingsformulier h1{
  color:#057EB2;
  font-size: 36px;
}

.form-logo img {
  max-width: 100%;
}

.form-header p {
  font-weight: bold;
  font-size: 15px;
  line-height: 25px;
}

.section_header h3 {
  background: #057EB2;
  color:#FFF;
  padding:5px;
}

.pure-form label{
  color:#057EB2;
  font-weight: bold;
  position: relative;
  top: 25%;
  transform: translateY(-50%);
}

div[class^="pure-u"] {
  padding: 5px 0 ;
}

.pure-button-primary{
  float: right;
  background-color: #E22D37 !important;
}

.zelfde_adres button{
   float: left !important; 
}

.pure-radio{
  display: inline-block !important;
}

label.right{
  position: relative;
  left:1em;
}

.hide{
  display: none ;
}

.show{
  display: block;
  color:green;
}

.invalid{
  border: 1px salmon solid !important;
}

.pure-g [class*=pure-u] {
    /* padding: 6px; */
    /* padding: 6px 0; */
    margin: 1px 0px;
}

.meldbtn.link-more{
  
  background-color: #E22D37 !important;
  color: #FFFFFF;
  position: relative;
  top: -3px;
  margin: 0px 0px -1px 10px;
}

.page-meldingsformulier .meldbtn, 
.page-aanmelden-betrokkenen .meldbtn, 
.page-aanmelden-situatie .meldbtn{
  display: none;
}


.chat-plugin-container {
  box-sizing: border-box;
}