/**
 * Custom CSS
 * Use this file to override styles if you feel uncomfortable editing
 * component stylesheets.
 * 
 * color:  #4598a6 ;
 * 
 * voor leerlingen:  color:  #e83089;
 * voor medewerkers:  color:  #f9b233;
 * onze organisatie:  color:  #212062;
 ============================================================================ */


* {box-sizing: border-box;
   padding: 0;
   margin:0 }

html {
    background-color: transparent;
    font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
}

body {font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";}
strong {font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";}


.l-rw {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  max-width: 100%;
  width: 100%;
}

.l-r {
  flex: 0 0 auto;
  padding: 0px;
  width: 100%;
}

.block {
  margin: 0;
}


.pr-header {
color: #000;
background-color: transparent;
}

.regions {
  background: none;
}

.page {
  background: none;
}

#navbar {max-width:  800px; margin:  auto; min-height: 120px;}

.pr-navbar {
  color: #000;
  background: none;
}

/* Branding */
/*
#block-drupal-theme-logokdgstandaardlogo{left: 0; position: relative;}
#block-drupal-theme-logokdgstandaardlogo{left: 0; position: relative;}
*/

#kdglogo {max-width: 400px;
  left: 0;
  position: absolute;
  top: -85px;
z-index: 20;}

/*menu*/


#block-corpus-theme-kareldegoede-2 {margin-top: 72px; margin-left: 50px; position: relative; left: 150px;}

ul.sf-menu.sf-style-none a, ul.sf-menu.sf-style-none a:visited, ul.sf-menu.sf-style-none span.nolink {
  border: 0 none;
  padding: 0.75em 1em;
  padding: 0.75rem 1rem;
  color: #4598a6;
}

ul.sf-menu.sf-style-none a, ul.sf-menu.sf-style-none a:hover, ul.sf-menu.sf-style-none span.nolink {
  border: 0 none;
  padding: 0.75em 1em;
  padding: 0.75rem 1rem;
  color: #4598a6;
  text-decoration:  none;
}



ul li .sf-depth-2 {border-bottom-color: #4598a6; border-bottom-style: solid; border-bottom-width: thin; }

/*accordeon vanaf 1159px */

/*
.sf-accordion-toggle {
  right: -28.25rem;
  top: -157%;
  position: relative;
}
*/

/*

.responsive-menus.responsified {
    clear: both;
    width: 100%;
	margin-top: 21px;
}

.responsive-menus.responsified.responsive-toggled span.toggler {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: 1px solid #bbb;
	width: 40px;
}

.responsive-menus.responsified span.toggler {
    padding: 1px;
    display: block;
    background: #8b6f4c;
    color: #fff;
    border-radius: 0px;
    box-shadow: none;
    font-size: 1.35em;
    text-align: center;
    cursor: pointer;
    outline: none;
	width: 33px;
	height: 33px;
	padding-top: 5px;
}

.responsive-menus.responsified .responsive-menus-simple {
    display: none;
    width: 100%;
    background: #8b6f4c;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    box-shadow: none;
}

/*socmed*/



#block-corpus-theme-socmed {
  width: 260px;
  right: 20px;
  z-index: 500;
  margin-top: 0px;
  position: absolute;
}

/*
#block-corpus-theme-socmed {
  width: 260px;
  left: 65%;
  z-index: 100;
  margin-top: 0px;
  position: relative;
}
*/

.buttonsmall {float: left;}



#facebook {
    height: 30px;
    opacity: 1;
    width: 30px;
	float: left;
	margin-left: 5px;
}
#facebook img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}

#instagram {
    height: 30px;
    opacity: 1;
    width: 30px;
	float: left;
	margin-left: 5px;
}
#instagram img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}
#tiktok {
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 5px;
}
#tiktok img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}


#mail {
    height: 30px;
    opacity: 1;
    width: 30px;
	float: left;
	margin-left: 5px;
}
#mail img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}

#tel {
    height: 30px;
    opacity: 1;
    width: 30px;
	float: left;
	margin-left: 5px;
}
#tel img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}

#mijnkareldegoede {
    height: 30px;
    opacity: 1;
    width: 180px;
    float: left;
    margin-left: 5px;
}
#mijnkareldegoede img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 180px;
}

#youtube {
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 5px;
}
#youtube img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}

#X {
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 5px;
}
#X img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}

#url {
    height: 30px;
    opacity: 1;
    width: 30px;
    float: left;
    margin-left: 5px;
}
#url img:hover {
    animation-duration: 1s;
    animation-name: buttontransition;
    height: 30px;
    opacity: 0.2;
    width: 30px;
}




.site-branding__name-link:link, .site-branding__name-link:visited {
    color: #fff;
}

#user-login-form{max-width:  1200px; margin:  auto; width:  80%; z-index: 100;
  position: relative;}

  .user--profile {max-width:  1200px; margin:  auto; width:  80%; z-index: 100;
  position: relative;}

.page {
    background-color: 
    transparent;
}
.node--id-3 {
    background: none!important;
}

.node--id-3 p {
    color: #fff;
}

.node--id-3 h1 {
    display:  none;
}

.node {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    max-width: 1200px;
  margin: auto;
}

.node h1 {
    color: #4598a6;
    text-align:  center;
}

.l-rw {
  padding: 0px;
}

#knop {background-color: #4598a6; padding: 7px; text-align: center;
width: fit-content;
block-size: fit-content;
text-transform: uppercase;
z-index: 999;
}

#knop a:link {
  color: #FFF;
}
#knop a:active {
  color: #FFF;
}
#knop a:hover {
  color: #000;
  text-decoration: none;
}

#knop a:visited {
  color: #FFF;
}



a:link {
  color: #4598a6;
}
a:active {
  color: #4598a6;
}
a:hover {
  color: #000;
  text-decoration: none;
}

a:visited {
  color: #4598a6;
}


/*SLIDERS */
.flexslider {
    border: 0px
}


#block-corpus-theme-views-block-slider-pagina-karel-de-goede-block-1 {position: relative; width: 100%; left: 0; top: 0;}

/*THEMATEGELS*/

#block-corpus-theme-views-block-doelgroepen-home-block-1 {text-align:  center; padding-bottom:  5%; margin-top:  -30px;}

.tegel .andere {
  height: 120px;
  width: 320px;
  /* width: 100%; */
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: green;
  padding:  10px;
  display:block;

}


.tegel .leerlingen {
  height: 120px;
  width: 320px;
  /* width: 100%; */
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: #e83089;
  padding:  10px;
  display:block;

}

.tegel .medewerkers {
      height: 120px;
  width: 320px;
  /* width: 100%; */
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: #f9b233;
  padding:  10px;
  display:block;

}

.tegel .organisatie {
      height: 120px;
  width: 320px;
  /* width: 100%; */
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: #212062;
  padding:  10px;
  display:block;

}

.tegels .tegel {
  display:inline-block;
  margin: 10px;
    vertical-align: top;
    padding:  7px; 
    }  
    
}

.tegel .andere:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
}

.tegel .organisatie:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
}

.tegel .medewerkers:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
}

.tegel .leerlingen:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
}

.tegel h2 {text-transform: uppercase; padding-top: 2em;}
.tegel h2 a:link {color:  #fff;}
.tegel h2 a:active {color:  #fff;}
.tegel h2 a:hover {color:  #fff; text-decoration: none;}
.tegel h2 a:visited {color:  #fff;}
/*

.leerlingen {background-color:red;}
.medewerkers {background-color:blue;}
.organisatie {background-color:orange;}
*/

/* TEGELPAGINA'S VOLGENS DOELGROEPEN */

/* submenus tegels */

 .submenus .submenu {
  display:inline-block;
  margin: auto;
  position: relative;
  text-align:center;

    } 

    .view-submenus-leerlingen {
  color: #363636;
  background: none;
  max-width: 1200px;
  margin: auto;
  text-align: center;
  z-index: 400;
position: relative;
  border-top-color: #000; border-top-style: dotted; border-top-width: thin;
  padding-top: 10px;
}

    .view-submenus-medewerkers {
  color: #363636;
  background: none;
  max-width: 1200px;
  margin: auto;
  text-align: center;
  z-index: 400;
  position: relative;
  border-top-color: #000; border-top-style: dotted; border-top-width: thin;
  padding-top: 10px;
}

    .view-submenus-organisatie {
  color: #363636;
  background: none;
  max-width: 1200px;
  margin: auto;
  text-align: center;
  z-index: 400;
   position: relative;
  border-top-color: #000; border-top-style: dotted; border-top-width: thin;
  padding-top: 10px;
}

.submenu h2 {font-size: 1em;
    text-transform: uppercase;
    text-align: center;}

.submenu h2 a:link {color: #4598a6; padding-left:10px; padding-right:  10px; padding-top:3px; padding-bottom:3px;}  
.submenu h2 a:active {color: #4598a6;   padding-left:  10px; padding-right:  10px; padding-top:3px; padding-bottom:3px;}  
.submenu h2 a:hover {border-color: #4598a6; border-style: solid; border-width: thin; color: #4598a6;   padding-left:  10px; padding-right:  10px; padding-top:3px; padding-bottom:3px; text-decoration: none;}  
.submenu h2 a:visited {color: #4598a6; padding-left:  10px; padding-right:  10px; padding-top:3px; padding-bottom:3px;} 

/* VOOR LEERLINGEN */

.leerlingtegels {text-align:  center; padding-bottom:  5%; max-width:  1200px; margin:  auto;}

.leerlingtegels .leerlingtegel {
  display:inline-block;
    vertical-align: top;
  height: 120px;
  width: 320px;
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: #e83089;
  padding:  10px;
    } 

  .leerlingtegels .leerlingtegel:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
} 
.leerlingtegel h2 {font-weight: normal; font-size: 2.1em; line-height: 1em; text-align: left;}
.leerlingtegel h2 a:link {color:  #fff;}
.leerlingtegel h2 a:active {color:  #fff;}
.leerlingtegel h2 a:hover {color:  #fff; text-decoration: none;}
.leerlingtegel h2 a:visited {color:  #fff;}

/* buttons themablokjes */

.tegelblokjes  {text-align:  center; padding-bottom:  5%; max-width:  100%; margin:  auto;}

.tegelblokjes .tegelblokje {
  display:inline-block;
    vertical-align: top;
  height: 238px;
  width: 450px;
  margin: 10px auto;
  position: relative;
  text-align:left;
  padding:  10px;
    } 
.views-field-field-button-theme-blokje {margin-top: -245px;}
.views-field-field-button-theme-blokje img:hover {opacity: 0; transition: 0.5s;}


.views-field-field-background-themablokje img { opacity: 1; }


/* VOOR MEDEWERKERS */

.medewerkerstegels {text-align:  center; padding-bottom:  5%; max-width:  1200px; margin:  auto;}

.medewerkerstegels .medewerkertegel {
  display:inline-block;
    vertical-align: top;
  height: 120px;
  width: 320px;
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: #f9b233;
  padding:  10px;
    } 

  .medewerkerstegels .medewerkertegel:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
} 

.medewerkertegel h2 {font-weight: lighter; font-size: 2.1em; line-height: 1em; text-align: left;}
.medewerkertegel h2 a:link {color:  #fff;}
.medewerkertegel h2 a:active {color:  #fff;}
.medewerkertegel h2 a:hover {color:  #fff; text-decoration: none;}
.medewerkertegel h2 a:visited {color:  #fff;}

/* VOOR ORGANISATIE */

.organisatietegels {text-align:  center; padding-bottom:  5%; max-width:  1200px; margin:  auto;}

.organisatietegels .organisatietegel {
  display:inline-block;
  margin: 10px;
    vertical-align: top;
  height: 120px;
  width: 320px;
  margin: 10px auto;
  position: relative;
  text-align:left;
  background-color: #212062;
  padding:  10px;
    } 

  .organisatietegels .organisatietegel:after {
   content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 70px 70px;
  border-color: transparent transparent #fff transparent;
} 

.organisatietegel h2 {font-weight: lighter; font-size: 2.1em;line-height: 1em; text-align: left;}
.organisatietegel h2 a:link {color:  #fff;}
.organisatietegel h2 a:active {color:  #fff;}
.organisatietegel h2 a:hover {color:  #fff; text-decoration: none;}
.organisatietegel h2 a:visited {color:  #fff;}

/* paginas voor rubrieken */

.node--type-pagina-rubriek-onze-organisatie {max-width:  1200px; margin:  auto;}

.node--type-pagina-rubriek-onze-organisatie h1 {color: #212062; font-size: 3em; font-weight: bold; text-align: center;}
.node--type-pagina-rubriek-onze-organisatie h2 {color: #212062; font-size: 2em; font-weight: bold; }
.node--type-pagina-rubriek-onze-organisatie h3 {color: #212062; font-size: 1.6em; font-weight: bold; }
.node--type-pagina-rubriek-onze-organisatie h4 {color: #212062; font-size: 1.2em; font-weight: bold; }
.node--type-pagina-rubriek-onze-organisatie h5 {color: #212062; font-size: 1em; font-weight: normal; }
.node--type-pagina-rubriek-onze-organisatie h6 {color: #212062; font-size: 0.8em; font-weight: normal; }
/*.node--type-pagina-rubriek-onze-organisatie 9 {color: #000; font-size: 1em; font-weight: normal; }*/


/*
#block-corpus-theme-content {max-width: 1150px; margin-left: 130px; z-index: 400;
  position: relative; margin: auto;}
  */

 .tabs {max-width: 1150px; margin: auto; z-index: 400;position: relative;}


.node--type-pagina-leerlingenrubriek h1 {color: #e83089; font-weight:  bold; font-size: 3em; text-align: left;}
.node--type-pagina-leerlingenrubriek h2 {color: #e83089; font-weight:  bold; font-size: 2em; }
.node--type-pagina-leerlingenrubriek h3 {color: #e83089; font-weight:  bold; font-size: 1.3em; }
.node--type-pagina-leerlingenrubriek strong {color: #4598a6;}
.node--type-pagina-leerlingenrubriek a:link {color: #4598a6; text-decoration: underline;}
.node--type-pagina-leerlingenrubriek a:active {color: #4598a6; text-decoration: underline;}
.node--type-pagina-leerlingenrubriek a:hover {color: #e83089; text-decoration: underline;}
.node--type-pagina-leerlingenrubriek a:visited {color: #4598a6; text-decoration: underline;}

.node--type-pagina-rubriek-medewerkers h1 {color: #f9b233; font-weight:  bold; font-size: 3em; text-align: left;}
.node--type-pagina-rubriek-medewerkers h2 {color: #f9b233; font-weight:  bold; font-size: 2em; }
.node--type-pagina-rubriek-medewerkers h3 {color: #f9b233; font-weight:  bold; font-size: 1.3em; }
.node--type-pagina-rubriek-medewerkers strong {color: #4598a6;}
.node--type-pagina-rubriek-medewerkers a:link {color: #4598a6; text-decoration: underline;}
.node--type-pagina-rubriek-medewerkers a:active {color: #4598a6; text-decoration: underline;}
.node--type-pagina-rubriek-medewerkers a:hover {color: #f9b233; text-decoration: underline;}
.node--type-pagina-rubriek-medewerkers a:visited {color: #4598a6; text-decoration: underline;}

.node--type-pagina-rubriek-onze-organisatie h1 {color: #212062; font-weight:  bold; font-size: 3em; text-align: left;}
.node--type-pagina-rubriek-onze-organisatie h2 {color: #212062; font-weight:  bold; font-size: 2em; }
.node--type-pagina-rubriek-onze-organisatie h3 {color: #212062; font-weight:  bold; font-size: 1.3em; }
.node--type-pagina-rubriek-onze-organisatie strong {color: #4598a6;}
.node--type-pagina-rubriek-onze-organisatie a:link {color: #4598a6; text-decoration: underline;}
.node--type-pagina-rubriek-onze-organisatie a:active {color: #4598a6; text-decoration: underline;}
.node--type-pagina-rubriek-onze-organisatie a:hover {color: #212062; text-decoration: underline;}
.node--type-pagina-rubriek-onze-organisatie a:visited {color: #4598a6; text-decoration: underline;}



/*SCHOLEN*/

.view-scholen-secundair-onderwijs {padding-bottom: 5%;}

#block-corpus-theme-page-title {margin-top: 15px; text-align: center; color: #4598a6; font-size: 1.2em;}

.group-header .field-type-image__figure {margin:  auto; width: 100%;}
.group-header h2 {color: #4598a6; text-transform: uppercase; font-weight:  bold; text-align:  center;}
.group-header {border-bottom-color: #4598a6; border-bottom-style: solid; border-bottom-width: thin; margin-bottom: 15px; }

.ds-2col-stacked > .group-left {
  float: left;
  width: 45%;
}

.field-node--field-omschrijving-school {font-size:  1em; line-height: 1.5em; }

.school {
   width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
  padding-bottom:  50%;

}

.school img {width: 100%; height: auto;}

.scholen .school {
  height: 150px;
  width: 150px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
    border-color: #4598a6; border-width: thin; border-style: dotted;
    padding:  7px;
    margin-top: 30px;
    
    
}

.scholen {
  text-align: center;
    max-width: 75em; 
    margin:auto;
}

.mixitup-select {
  width: 200px;
  margin: auto;
    margin-right: auto;
    margin-left: auto;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
}

/* uitzetten logo op full page secundair */

.field-node-field-logo {text-align: center; margin: auto}
.node--id-19.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-32.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-29.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-27.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-30.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-21.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-28.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-26.node--view-mode-full .field-node-field-logo {display: none;}
.node--id-31.node--view-mode-full .field-node-field-logo {display: none;}


.node--type-school {max-width: 1200px; margin:  auto;}

.address {background-color:rgba(69,152,166,0.3); 
padding: 15px; }

.given-name {display: none;}
.family-name {display: none;}

.organization {color: #4598a6;
  text-transform: uppercase;
  font-weight: bold;  }

.address-line1 {display: contents;}

.postal-code {display: contents;}
.locality {display: contents;}
.country {display:  none;}

.field-node--field-social-media-school {
    margin-top: -59px;
  position: relative;
  float: right;
  right: 10px;}

  /* opendeur en infomomenten */

  /*.node--type-open-dag {width: 300px; float: left; background-color: rgba(69,152,166,0.3); margin-right: 5px;}
   */
  .node--type-infomoment .node__title {font-size: 1.2em; font-weight: bold; text-align: center; height: 30px;}
  .field-node--field-infomomenten {font-size: 1.4em; font-weight: bold; text-align: center;}

  .node--type-open-dag .node__title {font-size: 1.2em; font-weight: bold; text-align: center; height: 30px;}
  .field-node--field-open-dag {font-size: 1.4em; font-weight: bold; text-align: center;}
 

  .infomomenten .infomoment {
  height: 150px;
  width: 300px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
    background-color: rgba(69,152,166,0.3);
    padding:  7px;
    
    
}

.infomomenten {
  text-align: center;
    max-width: 75em; 
    margin:auto;
}

.block-views-css-class--infomomenten h2 {text-align:  center;}

/*overzichtpagina open dagen */

.infomoment .views-field-term-node-tid {
  font-size: 1em;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  color: #000;
  padding-bottom: 10px;
  padding-top: 15px;
}

.infomoment .views-field-title {
  font-size: 1.2em;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  color: #4598a6;
}

.infomoment .views-field-field-open-dag {
  font-size: 1.4em;
  font-weight: bold;
  text-align: center;
}

.infomoment .views-field-field-infomomenten {
  font-size: 1.4em;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
}

  /* aanbod */

  .field-node-field-opties-a-stroom {border-bottom-color: #4598a6; border-bottom-style: dotted; border-bottom-width: thin; padding-bottom: 10px;}
  .field-node-field-opties-b-stroom {border-bottom-color: #4598a6; border-bottom-style: solid; border-bottom-width: thin; padding-bottom: 10px;}
  .field-node-field-arbeidsfinaliteit {border-bottom-color: #4598a6; border-bottom-style: solid; border-bottom-width: thin; padding-bottom: 10px;}
  .field-node-field-arbeidsfinaliteit-derde-gr {border-bottom-color: #4598a6; border-bottom-style: solid; border-bottom-width: thin; padding-bottom: 10px;}
  .field-node-field-7de-jaar {border-bottom-color: #4598a6; border-bottom-style: solid; border-bottom-width: thin; padding-bottom: 10px;}


  .oranje {color:  orange;}
  .groen {color:  lime;}
  .rood {color:  red;}
  .blauw {color: cyan;}
  .paars {color:  purple;}

  .field-entity-reference-type-taxonomy-term .field__item {
  margin: 0 0 0 0;
  display: inline-block;
}
.field-node-field-studieaanbood .field__label {color: #4598a6; font-size: 1.5em;}
.field-node-field-eerste-graad-b-stroom .field__label {color: #4598a6; font-size: 1.5em;}
.field-node-field-tweede-graad .field__label {color: #4598a6; font-size: 1.5em;}
.field-node-field-derde-graad-domeinen .field__label {color: #4598a6; font-size: 1.5em;}
.field-node-field-7de-jaar .field__label {color: #4598a6;font-size: 1.5em;}

.field-entity-reference-type-taxonomy-term .field__item-wrapper::after {
  content: "\00a0|\00a0";
  display: inline-block;
}

.field-node--field-meer-info-aanbod a {color: #fff; padding: 5px; text-align: center; width: 180px; margin: auto; border-color: #4598a6; border-width: thin; border-style: solid; }
.field-node--field-meer-info-aanbod a:link {color: #fff; background-color: #4598a6; width: 180px; }
.field-node--field-meer-info-aanbod a:hover {color: #4598a6; text-decoration: none; background-color: #fff; width: 180px;}

/* pagina scholen */

.field-node--field-omschrijving-school p a {color: #4598a6; }
.field-node--field-omschrijving-school p a:link {color: #4598a6; }
.field-node--field-omschrijving-school p a:active {color: #4598a6; }
.field-node--field-omschrijving-school p a:hover {color: #000; text-decoration: none; }
.field-node--field-omschrijving-school p a:visited {color: #4598a6; }


/* KAARTEN */

.leaflet-popup-content {
  line-height: 1.3;
  font-size: 1.08333em;
  max-width: 250px;
  min-width: 250px;
}

/* VACATURES */

#block-corpus-theme-views-block-vacatures-directie-block-1-title {max-width: 1200px; margin:  auto; color: #000; padding-bottom: 15px; width:  95%;}
#block-corpus-theme-views-block-vacatures-directie-block-1--2-title {max-width: 1200px; margin:  auto; color: #000; padding-bottom: 15px; width:  95%;}
#block-views-block-vacatures-leerkrachten-basis-en-kleuter-block-1-title {max-width: 1200px; margin:  auto; color: #000; padding-bottom: 15px; width:  95%;}
#block-views-block-vacatures-administratief-block-1-title {max-width: 1200px; margin:  auto; color: #000; padding-bottom: 15px; width:  95%; }

.vacatures {max-width: 1200px; margin:  auto; padding-bottom:  25px; width:  95%;}
.vacature { padding-bottom: 15px; border-bottom-style: dotted; border-bottom-width: thin; border-bottom-color: #000; }

.vacature h3 {color:  #4598a6; padding-bottom:  16px; margin-top:  20px;}
.views-field-field-omschrijving-vacature {margin-top: -15px;}
.views-field-field-omschrijving-vacature a:link {color: #4598a6; border-color: #4598a6; border-width:thin; border-style: solid; padding: 5px; border-radius: 5px; background-color:  #fff;}
.views-field-field-omschrijving-vacature a:visited {color: #4598a6; border-color: #4598a6; border-width:thin; border-style: solid; padding: 5px; border-radius: 5px; background-color:  #fff;}
.views-field-field-omschrijving-vacature a:hover {color: #fff; border-color: #4598a6; border-width:thin; border-style: solid; padding: 5px; border-radius: 5px; background-color: #4598a6; }

/*#block-patisserie-vanmullem-content {background-color: rgba(157,157,157,0.57)}*/



.vacatureskdg {
  text-align: center;
  max-width: 75em;
  margin: auto;
}

.vacatureskdg .vacaturekdg {
  height: 300px;
  width: 300px;
  display: inline-block;
  margin: 10px;
  vertical-align: top;
  background-color: rgba(69,152,166,0.8);
  padding: 7px;
} 

.vacaturekdg .views-label-title {
  width: 300px;
  text-align: center;
  font-size: 2em;
  padding-top: 19px;
  display: inline-block;
  color: #fff;
  padding-bottom: 22px;
  font-weight: bolder;
}

.vacaturekdg .views-field-title .field-content {font-size: 1.5em; margin-top: 15px;}

.vacaturekdg .views-field-field-omschrijving-vacature {margin-top: 73px; }


.vacaturekdg .views-field-title .field-content a:link {color: #fff;}
.vacaturekdg .views-field-title .field-content a:active {color: #fff;}
.vacaturekdg .views-field-title .field-content a:hover {color: #000; text-decoration: none;}
.vacaturekdg .views-field-title .field-content a:visited {color: #fff;}

.mixitup-select label {display: none;}

/*

.regions {
     background-color: 
    transparent;
}

.node--id-3 {display: none;}

.pr-footer .regions {
    background: none;
}

#block-views-block-slider-home-block-1 {position: fixed; z-index: -1; width: 100%; left: 0; top: -20px; }

#block-views-block-slider-pagina-block-1 {position: fixed; z-index: -1; width: 100%; left: 0; top: -20px; }


#block-patisserie-vanmullem-content {padding-bottom: 10%;}

/* formulier */
/*

.button--primary {
    color: #fff;
    background-color: #8b6f4c;
    border: 1px #000 solid;
}

.button--primary:hover {
    color: #fff;
    background-color: #000;
    border: 1px #000 solid;
}
.details-description {display: none;}

td, th {
    border-color: #fff;
}

/*SCHOLENGEMEENSCHAPPEN */
/* titels logo's */

#block-karel-de-goede-scholengemeenschap-block-1 {border-top-color: #666; border-top-width: thin; border-top-style: dotted; padding-top: 15px;}
#block-karel-de-goede-scholengemeenschap-block-1-title{
    background-image: url("https://karel-de-goede.corpus-studio.be/scholen-brugge/sites/default/files/2025-06/scholengemeenschap-kdg.jpg"); 
    background-position: center; background-repeat: no-repeat;
    width: 500px; height: 250px; margin: auto;
    color: #FFF;
    }
#block-corpus-theme-views-block-bernedam-block-1 {border-top-color: #666; border-top-width: thin; border-top-style: dotted; padding-top: 15px;}
#block-corpus-theme-views-block-bernedam-block-1-title {
    background-image: url("https://karel-de-goede.corpus-studio.be/scholen-brugge/sites/default/files/2025-05/scholengemeenschap-Bernedam_logo.jpg"); 
    background-position: center; background-repeat: no-repeat;
    width: 500px; height: 250px; margin: auto;
    color: #FFF;
    }

#block-corpus-theme-views-block-gruuthuuse-block-1 {border-top-color: #666; border-top-width: thin; border-top-style: dotted; padding-top: 15px;}
#block-corpus-theme-views-block-gruuthuuse-block-1-title{
    background-image: url("https://karel-de-goede.corpus-studio.be/scholen-brugge/sites/default/files/2025-05/scholengemeenschap-Gruuthuse.jpg"); 
    background-position: center; background-repeat: no-repeat;
    width: 500px; height: 250px; margin: auto;
    color: #FFF;
    }
#block-corpus-theme-views-block-duplicaat-van-bernedam-block-1 {border-top-color: #666; border-top-width: thin; border-top-style: dotted; padding-top: 15px;}
#block-corpus-theme-views-block-duplicaat-van-bernedam-block-1-title{
    background-image: url("https://karel-de-goede.corpus-studio.be/scholen-brugge/sites/default/files/2025-05/scholengemeenschap-sint-trudo.jpg"); 
    background-position: center; background-repeat: no-repeat;
    width: 500px; height: 250px; margin: auto;
    color: #FFF;
    } 


/* uitzetten melding adaptivethemes.com */

.attribution__link {display: none;}


/*FOOTER */

#sub-features {
  background: #4598a6;
  height: 287px;
  padding: 2em;
}

/*titels*/

#block-corpus-theme-overkareldegoede h2 {color:  #fff; text-transform:  uppercase; font-size: 1.3em; border-bottom-color: #fff;
  border-bottom-style: solid;
  border-bottom-width: thin;
  width: 80%;
  margin: auto;}
#block-corpus-theme-scholen h2 {color:  #fff; text-transform:  uppercase; font-size: 1.3em;  border-bottom-color: #fff;
  border-bottom-style: solid;
  border-bottom-width: thin;
  width: 80%;
  margin: auto;}
#block-corpus-theme-internaatkareldegoede h2 {color:  #fff; text-transform:  uppercase; font-size: 1.3em; border-bottom-color: #fff;
  border-bottom-style: solid;
  border-bottom-width: thin;
  width: 80%;
  margin: auto;}
#block-corpus-theme-jobs h2 {color:  #fff; text-transform:  uppercase; font-size: 1.3em; border-bottom-color: #fff;
  border-bottom-style: solid;
  border-bottom-width: thin;
  width: 80%;
  margin: auto;}

/*mixitup filter*/

label {
  font-weight: bold;
  text-decoration: none;
  white-space: nowrap;
  display: block;
}

/*childs*/
#block-corpus-theme-overkareldegoede ul li {font-size: 0.8em; width: 80%;
  margin: auto;}
#block-corpus-theme-overkareldegoede ul li a:link {color: #fff;}
#block-corpus-theme-overkareldegoede ul li a:active {color: #fff;}
#block-corpus-theme-overkareldegoede ul li a:hover {color: #000;}
#block-corpus-theme-overkareldegoede ul li a:visited {color: #fff;}

#block-corpus-theme-scholen ul li {font-size: 0.8em; width: 80%;
  margin: auto;}
#block-corpus-theme-scholen ul li a:link {color: #fff;}
#block-corpus-theme-scholen ul li a:active {color: #fff;}
#block-corpus-theme-scholen ul li a:hover {color: #000;}
#block-corpus-theme-scholen ul li a:visited {color: #fff;}

#block-corpus-theme-internaatkareldegoede  ul li {font-size: 0.8em; width: 80%;
  margin: auto;}
#block-corpus-theme-internaatkareldegoede  ul li a:link {color: #fff;}
#block-corpus-theme-internaatkareldegoede  ul li a:active {color: #fff;}
#block-corpus-theme-internaatkareldegoede  ul li a:hover {color: #000;}
#block-corpus-theme-internaatkareldegoede  ul li a:visited {color: #fff;}

.view-internaat-karel-de-goede .view-header {max-width: 800px; margin: auto;}

#block-corpus-theme-jobs  ul li {font-size: 0.8em; width: 80%;
  margin: auto;}
#block-corpus-theme-jobs  ul li a:link {color: #fff;}
#block-corpus-theme-jobs ul li a:active {color: #fff;}
#block-corpus-theme-jobs ul li a:hover {color: #000;}
#block-corpus-theme-jobs  ul li a:visited {color: #fff;}

/*
#block-patisserie-vanmullem-footer ul li a:link {color: #fff;}
#block-patisserie-vanmullem-footer ul li a:active {color: #fff;}
#block-patisserie-vanmullem-footer ul li a:hover {color: #000;}
#block-patisserie-vanmullem-footer ul li a:visited {color: #fff;}
*/

#block-corpus-theme-footer {text-align:  center; width: 800px;
  margin: auto; color:  #fff; text-transform:  uppercase;
}
#block-corpus-theme-footer .menu__link {
  color: #fff;
}
#block-corpus-theme-footer ul li {font-size: 0.8em;}
#block-corpus-theme-footer  ul li a:link {color: #fff;}
#block-corpus-theme-footer ul li a:active {color: #fff;}
#block-corpus-theme-footer ul li a:hover {color: #000;}
#block-corpus-theme-footer  ul li a:visited {color: #fff;}

#footer {position: absolute;
width: 100%;
    bottom: 0;
 background: #4598a6;
}

.pr-footer {color: #000;
background-color: transparent;
    border-top-color: #4598a6;
    border-top-style: solid;
    border-top-width: thin;
}

/* COOKIE BANNER */

.cookiesjsr-service-group.active .cookiesjsr-service-group--content {
  background: #004c93;
  background: var(--layer-tab-active-bg-color,#004c93);
  color: #fff;
  color: var(--layer-tab-active-font-color,#fff);
  display: block;
  font-weight: 100;
  width: 570px;
}

/* MEDIA QUERYS ------------------------------- */


@media only screen and (max-width: 1270px) {
	#block-logo {margin-top: 15%;}
	#block-views-block-slider-home-block-1 img {  display: block;
  width: 100vw;
  height: 100vh;
  object-fit: cover;}

}

@media only screen and (max-width: 1172px) {


    #kdglogo {
  max-width: 288px;
  left: 0;
  position: absolute;
  top: -58px;

}

#block-corpus-theme-content {
  z-index: 995;
}



}
/*/#block-corpus-theme-kareldegoede-2  ul li {background-color:  #fff;}*/

@media only screen and (max-width: 876px) { 
    .ds-2col-stacked > .group-left {
  float: none;
  width: 100%;
}
.ds-2col-stacked > .group-right {
  float: none;
  width: 100%;
}

    }



@media only screen and (max-width: 966px) {
	  .site-branding__name-link:link, .site-branding__name-link:visited {
    color: #8b6f4c;
}
	
#block-patisserie-vanmullem-footer ul li a {font-size: 0.6em}

  #block-corpus-theme-kareldegoede-2 {
    margin-top: 0px;
    margin-left: 10px;
    position: fixed;
    left: 0px;
    z-index: 150;
    width: 97%;
  }


  #superfish-karel-de-goede-toggle span {display: none;}
    
     #superfish-karel-de-goede-accordion .sf-depth-1 {background-color:#FFF; margin-top: 3px; }
  #superfish-karel-de-goede-accordion .sf-depth-2 {background-color: rgba(91,211,220,0.20); margin-top: 3px;}

 
    /*#superfish-karel-de-goede-accordion .menuparent {background-color:#FFF; margin-top: 3px; border-top-color: #4598a6; border-top-width:medium; border-top-style: solid;}
  #superfish-karel-de-goede-accordion .sf-no-children {background-color:#FFF; margin-top: 3px;}
  #superfish-karel-de-goede-accordion .sf-depth-2 {background-color: rgba(91,211,220,0.50); margin-top: 3px;}
    */

  


/*#block-corpus-theme-kareldegoede-2 .sf-depth-1 {background-color: #035a61; width:  96%;}*/

.sf-accordion-toggle.sf-style-none  {
    /*content: "≡";*/
  content: " ";
  background-image: url("https://karel-de-goede.corpus-studio.be/scholen-brugge/sites/default/files/inline-images/menu.jpg");
  background-repeat: no-repeat;
  background-size: 32px 32px;
    z-index: 150;
    position: relative;
}

div.sf-accordion-toggle.sf-style-none > a::after {
  content: " "!important;
  position: absolute;
  font-size: 2rem;
  right: 0.75rem;
  top: 42%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  speak: none;
}


}

@media only screen and (max-width: 560px) { 
    #navbar {
  max-width: 800px;
  margin: auto;
  min-height: 135px;
}

   #kdglogo {
  max-width: 288px;
    left: -71px;
    position: absolute;
    top: -14px;}

    .tegel:nth-child(2) { margin-top:-40px }
    .tegel:nth-child(3) { margin-top:-40px }


  #sub-features {
  background: #4598a6;
  height: auto;
  padding: 2em;
}

#block-corpus-theme-views-block-doelgroepen-home-block-1 {
  text-align: center;
  padding-bottom: 5%;
  margin-top: -121px;
}

#block-corpus-theme-content {
  margin-left: 20px;
}


/* buttons themablokjes */

.tegelblokjes  {text-align:  center; padding-bottom:  5%; max-width:  100%; margin:  auto;}

.tegelblokjes .tegelblokje {
  display:inline-block;
    vertical-align: top;
  height: 178px;
  width: 350px;
  margin: 10px auto;
  position: relative;
  text-align:left;
  padding:  10px;
    } 
.views-field-field-button-theme-blokje {
  margin-top: -192px;
}

}
@media only screen and (max-width: 435px) { 

.field-node--field-social-media-school {
  left: 158px;
  margin-top: -88px;
  position: relative;
  width: 130px;
}
.field-node--field-social-media-school img {padding: 1px;}
}