/* cmsms stylesheet: metanimatie modified: 21-04-23 13:07:32 */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i, 500,500i,600,600i&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500&display=swap');


/* LAATSTE BEWERKING GEDAAN OP:
      metanimatie	animatie			21-04-23 13:15:07 */

html, body, div, span, p.was-span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, div.was-adress, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

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

ol, ul { list-style: none; margin-bottom: 1rem; }

blockquote, q { 
  font-size: 1.4rem;
  font-style: italic;
  padding: 0 0 1rem 0;
}

blockquote p {margin-top: -0.5rem; }

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

* { box-sizing: border-box; }

html, body {
  width: 100%;
  height: 100%;
}

body {
  position: relative;
  font-family:'Open sans';
  font-size: 18px;
  font-weight: 300;
  line-height: 1.8rem;
  color: rgba(71, 71, 71);
  min-height: 100%;
  background-color: rgb(255, 255, 255);
}

a { 
  display: inline-block; 
  font-size: inherit;
  font-weight: 400;
  color: rgba(0, 90, 186); 
  text-decoration: none; 
}

a:hover { 
  color: rgba(47, 152, 228);
  text-decoration: underline;     
}

  a[href^="tel"]:link,
  a[href^="tel"]:visited, 
  a[href^="tel"]:hover {
    font-size: initial;
  }


img { 
  max-width: 100%; 
  height: auto; 
  box-shadow: 0px 8px 9px -6px rgba(42, 42, 42, .4);
  border: 1px solid rgb(176, 176, 176);
  border-radius: 3px;
}
    

h1, h2, h3, h4, h5 { font-family: Montserrat; }

h1 {
  font-size: 2rem; 
  font-weight: 300;
  line-height: 1.3;
  margin-bottom: 1.3rem;
}

h2 {
  font-size: 1.2rem;
  font-weight: 500;
  margin: 1.5rem 0 0.2rem 0;
}

h3 {
  font-size: 1.1rem;
  font-weight: 500;
  padding-top: 0.5rem;
}

h4 {
  font-size: 1rem;
  font-weight: 500;
}

p { font-weight: 300; }
p:not(:last-child) { margin:  0 0 1rem 0; }

em     { font-style: italic; }
strong { font-weight: 600; }

hr {
  margin: 2rem 0;
  color: rgba(0, 0, 0, 0.19);
}

hr:last-child { margin: 2rem 0 0 0; }


div.mobile { display: none; }

header {
  max-width: 1090px; /*1290px;*/
  margin : 0 auto;
}

header .custom-logo {
  width: 377px;
  max-width: 70%;
  height: auto;
  padding: 0 0 0 1.5rem;
  border: initial;
  box-shadow: initial;
}

@media only screen and (min-width:621px){

nav.menu-menu-1-container {
  width: 100%;
  padding: 1rem 0 0.5rem 0;
}

.menu-menu-1-container > ul {
  text-align: right;
  text-transform: uppercase;
  max-width: 1090px; /*1290px;*/
  padding-right: 1rem;
  margin : 0 auto;
}

.menu-menu-1-container > ul > li {
  list-style: none;
  display: inline-block;
  position: relative;
}

.menu-menu-1-container a {
  display: block;
  font-size: 1.1rem;
  font-weight: 600;
  text-decoration: none;
  color: rgb(110, 110, 110);
  padding: 0.2rem 0.5rem;
  white-space: nowrap; 
}

.menu-menu-1-container .menu-item-60 > a:hover, .menu-menu-1-container menu-item-60 > a.menuactive { color: rgba(153, 149, 228); }

.menu-menu-1-container .menu-item-67 > a:hover, .menu-menu-1-container .menu-item-67 > a.menuactive, 
.menu-menu-1-container ul li:nth-child(2) ul a { color: rgba(87, 186, 209); }

.menu-menu-1-container .menu-item-69 > a:hover, .menu-menu-1-container .menu-item-69 > a.menuactive, 
.menu-menu-1-container ul li:nth-child(3) ul a { color: rgba(110, 203, 152); }

.menu-menu-1-container .menu-item-63 > a:hover, .menu-menu-1-container .menu-item-63 > a.menuactive,
.menu-menu-1-container ul li:nth-child(4) ul a { color: rgba(245, 191, 60); }

.menu-menu-1-container .menu-item-426 > a:hover, .menu-menu-1-container .menu-item-66 > a.menuactive { color: rgba(237, 63, 32); }

.menu-menu-1-container .menu-item-61 > a:hover, .menu-menu-1-container .menu-item-61 > a.menuactive { color: rgba(253, 134, 166); }

/*dropdown*/
.menu-menu-1-container > ul li ul {
  display: none;
  text-transform: none;
  padding-left: 0.3rem;
}

.menu-menu-1-container > ul li:hover ul {
  display: block;
  text-align: left;
  position: absolute;
  left: 0;
  top: 2.2rem;
  min-width: 112px;
  border-radius: 0 0 0 7px;
  border: 1px solid rgba(153, 153, 153);
  border-top: none;
  background-color: rgba(255, 255, 255);
  z-index: 10000000 !important;
  margin-bottom: 0;
}

.menu-menu-1-container > ul li ul li:last-child { padding-bottom: 0.5rem; }

.menu-menu-1-container li li a {
  font-size: 1rem;
  font-weight: 600;
  padding: 0.3rem 1rem;
  transition: all 250ms ease-in-out;
}

.menu-menu-1-container li li a:hover { color: rgb(139, 139, 139)!important; }

}

main {
  position: relative;
  max-width: 63rem;
  padding: 2.5rem 1.5rem;
  margin: 0 auto;
  z-index: 2;
}


nav.projecten ul {
  display: grid;
  /*de RBRACE is GEEN foutmelding!*/
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 2rem 1.5rem;
  margin: auto;
}

nav.projecten li { position: relative; }

nav.projecten li span {
  display: block;
  margin: -8px 0 0 5px;
}

nav.projecten li a {
  font-family: Montserrat; 
  font-size: 0.9rem;
  font-weight: 400;
  color: inherit;
  text-decoration: none;
}

nav.projecten img {
  width: 100%;
  height: auto;
}

.kernzin {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.6;
  text-align: center;
  color: rgba(253, 253, 253);
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  width: 100%;
  height: calc( 100% - 1.9rem);
  background-color: rgba(125, 186, 152);
  padding: 18% 0.5rem;
}

a:hover .kernzin { visibility: visible; }


.tekst ul li {
  list-style: disc;
  list-style-position: outside;
  margin-left: 1.5rem;
}

.tekst ul li::marker { color: rgba(215, 0, 1); }

.paginasboven {
  display: block;
  font-size: 0.7em;
  font-weight: 400;
}  

/*lokatie: design manager -> scipnieuws 23*/
.paginas {
  display: block;
  font-size: 0.85rem;
  font-weight: 400;
  margin-top: -1rem;
}

#nieuws, .projecten { margin-top: 2rem; }
.home #nieuws    { padding-bottom: 1.5rem; }
.home #nieuws h1 { margin-bottom: 1.8rem; }


.newsitems,
.inner_news_container {    
  display: grid;
  /*de RBRACE is GEEN foutmelding!*/
  grid-template-columns: repeat(auto-fill, minmax(20.5rem, 1fr));
  gap: 2rem 1.5rem;
  margin: auto;
}

.NewsSummary {
  font-size: 1rem;
  line-height: 1.5rem;
  max-width: 22rem;
  min-width: 16rem;
  padding: 1.5rem;
  box-shadow: 0px 8px 9px -6px rgba(42, 42, 42, .4);
  border: 1px solid rgb(176, 176, 176);
  border-radius: 3px;
}

.NewsSummary  p  { font-size: 0.9em; }
.NewsSummary img { box-shadow: none; }

.NewsSummary h3 { 
  font-size: 1.2rem; 
  font-weight: 400;
  margin-bottom: 0.5rem;
  padding-top: 0;
}

.NewsSummaryPostdate, .NewsSummaryMorelink  {
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1.3rem;
  text-align: left;
}

#NewsPostDetailDate {
  font-size: 1rem;
  float: right;
  line-height: 3;
}

#NewsPostDetailSummary    { margin-bottom: 1rem; }
#NewsPostDetailReturnLink { font-size: 0.8rem; }
/* extra ivm de << in sjabloon */

#NewsPostDetailReturnLink a {
  font-size: 0.9rem;
  padding-top: 1rem;
}

#NewsPostDetailReturnLink + hr { margin-top: 1rem; }


.tekst iframe, 
.tekst img, 
.welkom img { margin: 0.5rem 0 0 0; }

.img-extra-margin { margin: 2rem 0 0 0; }

.page-id-52  #NewsPostDetailDate, 
.page-id-52 .NewsSummaryPostdate,
.page-id-26 #NewsPostDetailSummary img, 
.page-id-26 #NewsPostDetailDate,
.page-id-26 .NewsSummaryPostdate { display: none; }

.page-id-26 .NewsSummarySummary img { width: 100%; max-width: 300px; }


.inner_news_container .NewsSummary {
  padding: 2rem 1.5rem;
  /* background-color: rgba(0, 0, 0, 0.01); */
}

iframe { max-width: 100%; }


/* .note zijn de italics in lotgenotengroepen */
div.was-adress, .note { 
  display: block;
  font-size: 1rem;
  line-height: 1.6;
  margin-top: 1rem;
}


/* ***** lOKATIES CONTACT ADRESSEN op individuele pagina's ***** */
div.was-adress:not(:last-child) { margin: 0 0 2rem 0; }

.adres-lokaties {
  display: flex;
  flex-flow: column wrap;
  align-items: flex-start;
}

.adres-lokaties p { margin-bottom: 0; }

.adres-lokaties div:first-child { padding-bottom: 0.5rem; }
.adres-lokaties div:last-child  { padding-top: 0.5rem; }

.adres-lokaties + hr {
  margin: 1rem 0;
  max-width: 50%;
  display: none;
}

/* ***** CONTACT PAGINA ***** */
.contactpagina { padding-top: 1.5rem; }
.contactpagina div.was-adress a { font-weight: 400; }

.leaflet-control-attribution.leaflet-control { visibility: hidden; }


/* *****  CONTAINERS OPMAAK VOOR TWEE COLOMMEN ***** */
.box {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: space-between;
  row-gap: 1rem;
}

.box div:first-child { flex: 0 0 60%; }
.box div:last-child  { flex: 0 0 35%; }

/* voor lokatie zonder plaatje ernaast */
.box.lokatie-single,
.box.box-single { display: initial; }

.clear { clear: both; }


/* ***** PROJECTEN - DE EETKAMER ***** */
.eetkamer { padding-left: 1rem; }

.eetkamer h2 { 
  font-size: 1.5rem;
  font-weight: 300; 
  font-style: italic; 
}

.eetkamer h2 + h2 + p { margin-top: 0; }
.eetkamer h3          { font-style: initial; }
.eetkamer h3 + h3     { padding-top: 2rem; }
.eetkamer p strong    { font-size: 1.1rem; font-weight: 600; }

.eetkamer > ul p { padding-left: 1rem; }


/* ***** MEEDOEN - LEREN PAGINA ***** */
.border {
  border: 6px solid black;
  border-radius: 0.2rem;
  padding: 2rem 2rem 1rem 2rem;
  margin: 3rem 0 0 0;
  background-color: rgba(249, 249, 249);
}

/* .border h1:not(:first-child) { margin: 2rem 0 1rem 0; } */
.border h1:not(:first-child) { margin: 0; }

.yellowroadbox {
  border-color: rgba(246, 210, 4);
  background-color: rgba(246, 210, 4, 0.07);
}

.scipcursussen {
  border-color: rgba(224, 69, 36); 
  background-color: rgba(224, 69, 36, 0.07);
}

.gebarentaal {
  border-color: rgba(20, 112, 148); 
  background-color: rgba(20, 112, 148, 0.07);
}

.vrijwilligersacademie {
  border-color: rgba(107, 176, 138); 
  background-color:  rgba(107, 176, 138, 0.07);
}

.domestika {
  border-color: rgba(124, 61, 171); 
  background-color: rgba(124, 61, 171, 0.07);
}

ol {
  list-style-position: inside;
  margin: 0.3rem 0 1.2rem 1rem;
  list-style: decimal;
}

ol.list-first li { padding: 0.1rem 0; }

ol li { padding: 0.5rem 0 0 0; }
ol li:last-child { padding: 0.5rem 0 0 0; }

ol.scip-list-first ul li {
  padding: 0.1rem 0 0 0;
}

/* === voor de challenge pagina nieuw SINGLE PAGINA ==== */
ol.yellow-list-first li:nth-of-type(-n+2) { padding: 0 0 0.2rem 0; }
ol.yellow-list-first li:last-child { padding: 0; }
ol.yellow-list-first h3 { padding-top: 0; }

.yellowroadbox ol li::marker,
.yellowroadbox ul li::marker { font-weight: 500; }
/* Hieronder voor pagina LEREN ivm h2 ipv h3 */
ol li::marker,
ul li::marker { font-weight: 600; }

ol li h2,
ul li h2 {
  font-size: 1.3rem;
  margin: 1.5rem 0 0.2rem 0;
}

h2 ~ h3,
ol li h3,
ul li h3 {
  font-size: 1.1rem;
  padding-top: .5rem;
}

ol li h3 + p:first-child { 
  font-size: 1.1rem; 
  font-style: italic; 
}

ol li h4,
ul li h4 {
  font-size: 1rem;
  margin-top: -.3rem;
  padding-bottom: 1.5rem;
}

ol li:last-child h4, 
ul li:last-child h4 { padding-bottom: 0; }

.list li { padding: 1rem 0; }


/* ***** FOOTER ***** */
footer { background-color: rgba(66, 106, 130); }

footer a       { color: rgba(77, 177, 237); text-decoration: none; } 
footer a:hover { color: rgba(239, 239, 239); }


footer img {
  border: initial;
  box-shadow: initial;
}

/* *** cc en rgb zijn de images in de footer *** */
footer .cc  { 
	padding: 3px; 
}

footer .rgb img { 
	width: 6.2rem;  
	margin: 0.3rem; 
}

footer .rgb a {
	padding-bottom: 8.7334px;
}


footer div.was-adress { margin: 0; }

.footer-items, .foot {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 68rem;
}

.footer-items {
  font-size: 0.9rem;
  font-weight: 400;
  max-width: 64rem;
  margin: 0 auto;
}

.footer-items div { padding: 1em; }

.footer-items div.was-adress { padding: 0; }

.footer-items h1 {
  font-size: 1.3rem;
  font-weight: 400;
  color: rgba(255, 255, 255);
  margin-bottom: 0.5rem;
}

footer p.was-span {
	display: inline;
}

footer p.was-span.was-br {
	display: block;
	margin-bottom: 0.0166626px;
}

.footer-items div.was-adress p.was-span {
  font-size: 0.9rem;
  color: rgba(234, 234, 234);
  letter-spacing: 0.02rem;
}

.foot {
  align-items: flex-end;
  font-size: 0.85rem;
  letter-spacing: 0.05rem;
  color: rgba(218, 218, 218);
  max-width: 62rem;
  border-top: 1px solid rgba(218, 218, 218);
  margin : 0 auto;
  padding: 0 0 0.5rem 0;
}


.fb-icon {
	display: inline-block;
	padding-top: 4.2167px;
}

/* ***** NOTULEN PAGINA ***** */
.notulen .content { display: inline-block; width: 70%; padding-right: 8% }
.notulen .beleid  { display: inline-block; width: 20%; vertical-align: top; margin-top: 8.6em; padding-left: 10px; }
.notulen .huisregels { border: 1px solid rgba(215, 0, 1); margin-bottom: 1em; padding: 0.5em; }

 a.downloadnotulen { 
  color: rgba(255, 255, 255);
  text-decoration: none;
  padding: 0.2rem 1rem;
  background-color: rgba(215, 0, 1);
  border-radius: 3px;
}

.huisregels h2 { padding-bottom: 1em; line-height: 1em; }
.huisregels a  { font-weight: normal; }


/* ***** COOKIES ***** */
#cookie_consent {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  max-width: 20rem;
  padding: 1.5rem;
  background: rgb(241, 241, 241);
  border: 1px solid rgb(176, 176, 176, .4);
  border-radius: 3px;
  z-index: 100000;
}

#cookie_consent p {
  font-size: 0.8rem;
  color: rgb(51, 51, 51);
  line-height: 1.6;
  text-align: center;
}

#cookie_consent a.accept_cookies, #cookie_consent a.more_info {
  font-weight: bold;
  color: rgba(255, 255, 255);
  text-decoration: none;
  border-radius: 3px;
  background: rgba(71, 71, 71);
  cursor: pointer;
  padding: 0.3rem 1rem;
  margin: 0 1rem;
}

#cookie_consent a.more_info {
  color: rgba(71, 71, 71);
  background: rgb(205, 205, 205);
}



/* ***** MEDIAQUERIES ***** */
@media only screen and (min-width:1024px){
  a[href^="tel"]:link,
  a[href^="tel"]:visited, 
  a[href^="tel"]:hover {
    text-decoration: none;
    pointer-events: none;
    cursor: default;
    color: inherit;
  }
  
  .contact div.was-adress a { font-weight: 300; }
}

@media only screen and (max-width:725px){
  .box { flex-flow: column nowrap; }   
  .box div > img { max-width: 80%; }
}

@media only screen and (max-width:750px){  
  .newsitems,
  .inner_news_container {    
    display: grid;
    /*de RBRACE is GEEN foutmelding!*/
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
  }
}

@media only screen and (max-width:620px){
  nav.menu-menu-1-container   { display: none; }
  .mobile ul { display: none; }
    
  div.mobile { 
    display: block; 
    width: 100%; 
    height: 1.5rem; 
  }

  .mobile input { opacity: 0; }
  .mobile label { width: 100%; }
  
  .mobile input#toggle:checked{
  	color: blue;  
  }
	
  .mobile input#toggle:checked ~ nav.menu-menu-1-container, 
	.mobile input#toggle:checked ~ nav.menu-menu-1-container ul, 
	.mobile input#toggle:checked ~ nav.menu-menu-1-container ul ul {
    display: block;
    z-index: 10000 !important;
  }
    
  .mobile a {
    font-size: 1.5rem;
    font-weight: 400;
    color: rgba(255, 255, 255);
    line-height: 1.6;
    text-decoration: none;
  }
   
  .mobile ul {
    position: absolute;
    top: 0;
    width: 100%;
    padding-top: 7rem;
    background-color: rgb(56, 135, 148);
  }

  .mobile ul li { padding-left: 3rem; }    
 
  .mobile ul ul { 
    position: relative; 
    padding-top: 0; 
  }   
    
  .mobile ul ul a { font-size: 1.1rem; }
    
  /* hamburger */
  .mobile svg {
    stroke: rgb(176, 176, 176);
    stroke-width: 4;
    width: 30px;
    height: 24px;
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    cursor: pointer;
    z-index: 100000;
  }
}


@media only screen and (max-width:545px){
  header .custom-logo { max-width: 55%; }
  img.left, img.right { width: 100%; }
}


@media only screen and (max-width:394px) {
  a  { word-break: break-word; }  
  h1 { font-size: 1.4rem; }

  blockquote p { font-size: 1.3rem; }  
}


html {
visibility : visible;
opacity: 1;
}