/**
 * Custom CSS
 * Use this file to override styles if you feel uncomfortable editing
 * component stylesheets.
 ============================================================================ */
/* COLORS 

KUNST CREATIE  #f19fb5
HOVER: rgba(241,159,181,0.2)


MENS MAATSCHAPPIJ  #7bc2ec
rgba(123,194,236,0.20)



STEM  #ab63a5
rgba(171,99,165,0.20)


EERSTE GRAAD
OKAN
SENSE

*/

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

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

.page {
    background-color: 
    transparent;
}

.regions {
     background-color: 
    transparent;
}
/* branding */

#block-corpus-studio-branding {z-index: 99;}
.site-branding {width: 100%; left: 0; position: relative; top: 0;}
.site-branding__logo-link {
    display: block;
    padding-right: 1rem; min-width: 150px; width: 150px;
    margin-top: 30px;
}
.site-branding__logo-img { width: 100%; height: auto; margin-left: 20%;}
.site-branding__name {color: #1db3b4; 
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
font-weight: bolder;
font-size: 2em;
margin-left: 30px;
margin-top: 25px;}

.site-branding__name a:link {color: #1db3b4; }
.site-branding__name a:active {color: #1db3b4; }
.site-branding__name a:hover {color: #000; }
.site-branding__name a:visited {color: #1db3b4; }

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

/* socmed */

#block-socmed {
float: right;
    margin-right: 60px;
    margin-top: -90px;
    position: relative
   }

.socmed {float: left;}

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

#smartschool_button {
    background-image: url(/sites/default/files/inline-images/smartschool_hover.png);
    background-size: 40px 40px;
    width: 40px;
    height: 40px;
}

#smartschool_button img{
    opacity: 1;
     transition: 0.5s;
}

#smartschool_button img:hover {
    opacity: 0;
}



#bel_button {
    background-image: url(/sites/default/files/inline-images/phone_hover.png);
    background-size: 40px 40px;
    width: 40px;
    height: 40px;
}

#bel_button img{
    opacity: 1;
     transition: 0.5s;
}

#bel_button img:hover {
    opacity: 0;
}

#instagram_button {
    background-image: url(/sites/default/files/inline-images/instagram_hover.png);
    background-size: 40px 40px;
    width: 40px;
    height: 40px;
}

#instagram_button img{
    opacity: 1;
     transition: 0.5s;
}

#instagram_button img:hover {
    opacity: 0;
}

#facebook_button {
    background-image: url(/sites/default/files/inline-images/facebook_hover.png);
    background-size: 40px 40px;
    width: 40px;
    height: 40px;
}

#facebook_button img{
    opacity: 1;
     transition: 0.5s;
}

#facebook_button img:hover {
    opacity: 0;
}

#youtube {
    background-image: url(/sites/default/files/inline-images/youtube_hover.png);
    background-size: 40px 40px;
    width: 40px;
    height: 40px;
}


#youtube img{
    opacity: 1;
     transition: 0.5s;
}

#youtube img:hover {
    opacity: 0;
}

#mail_button {
    background-image: url(/sites/default/files/inline-images/mail_hover.png);
    background-size: 40px 40px;
    width: 40px;
    height: 40px;
}

#mail_button img{
    opacity: 1;
     transition: 0.5s;
}

#mail_button img:hover {
    opacity: 0;
}


/* menu */

#block-schoolmenu {position: relative; z-index: 100; margin-top: -82px;}

#superfish-schoolmenu-toggle span { display: none;}

div.sf-accordion-toggle.sf-style-white a {
    background: #1db3b4;
    border: 0px solid #381301;
    color: #000;
    display: inline-block;
    font-weight: bold;
    padding: 1em 1em 1em 1em;
    width: 50px; height: 45px;
    position: relative;
    margin-top: -12px;
    border-radius: 3px;
}


div.sf-accordion-toggle.sf-style-white a:hover {
    color: #1db3b4;
    background: rgba(29,179,180,0.20);
}


div.sf-accordion-toggle.sf-style-white a.sf-expanded, ul.sf-menu.sf-style-white.sf-accordion li.sf-expanded {
    background: #fff;
}

.sf-accordion-toggle {
    float: right;
right: 10px;
position: absolute;
}

ul.sf-menu.sf-accordion.sf-expanded, ul.sf-menu.sf-accordion li.sf-expanded > ul {
    left: auto !important;
    position: relative;
    top: auto !important;

}

ul.sf-menu.sf-style-white li, ul.sf-menu.sf-style-white.sf-navbar {
    background: rgba(29,179,180,0.20);
}


ul.sf-menu.sf-style-white a, ul.sf-menu.sf-style-white a:visited, ul.sf-menu.sf-style-white span.nolink {
    border: 0 none;
    color: #000;
    padding: 0.75em 1em;
        padding-right: 1em;
    padding-right: 2em !important;
    text-align: right;
}


ul.sf-menu.sf-style-white li:hover, ul.sf-menu.sf-style-white li.sfHover, ul.sf-menu.sf-style-white a:focus, ul.sf-menu.sf-style-white a:hover, ul.sf-menu.sf-style-white span.nolink:hover {
    background: none;
    outline: 0;
    color: #1db3b4;
}
ul.sf-menu.sf-style-white .sf-depth-1 li:first-child {display: none;}

ul.sf-menu.sf-style-white .sf-depth-1 li {background: none;}



/* paginas onder branding*/

.l-main {max-width: 75em; margin: auto; }
.node {
    background-color: #ffffff;
    -webkit-box-shadow: none;
    box-shadow: none;
}


.node--type-homepage .node__title {display: none;}

/* homepage*/

/* videoblok */

.videocontainer {
    margin-top: 0px;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}
.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#block-bovenblok img.align-center, figure.align-center, .field-type-image__figure.align-center {
    margin-bottom: 0rem;
}

#block-bovenblok img.align-center {
    display: block;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
}

#block-bovenblok {position: relative; left: 0;
padding: 0;
    width: 100vw;
    height: 50vw;
    margin-top: 0px;
}

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

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

.rid-content-suffix {position: absolute; left: 0;
padding: 0;
    width: 100vw;
    padding-bottom: 40px;
    margin-top: 80px;
}


#block-views-block-homepage-block-1 {position: absolute; left: 0;
padding: 0;
    width: 100vw;
    padding-bottom: 20%;
    margin-top: -20px;
}


.wrapper {}

ul {

    left: 0;
padding: 0!important;}


ul li {list-style: none;
margin-top: -6px !important;}



.puzzel {
padding: 0 !important;
float: left;}
/*
.puzzel img {width: 100%; height: auto; }*/

.views-field-field-fotoboven img {width: 100%; height: auto;}

.views-field-field-fotoboven img:hover {
    width: 100%;
    height: auto;
    opacity: 0.5;
}




.views-field-field-puzzelfotoonder img {width: 100%; height: auto;
 opacity: 1;
  transition: 0.5s;}

.views-field-field-puzzelfotoonder img:hover {opacity: 0;}

/*grote foto*/

.puzzel:first-child  {
        display: none;
	width: 100vw;
    height: 50vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:first-child .views-field-field-puzzelfotoonder {margin-top: -50%;}

/*eerste jaar */  

.puzzel:nth-child(2) {
	width: 20vw;
	height: 20vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
    }

.puzzel:nth-child(2) .views-field-field-puzzelfotoonder {margin-top: -100%;}


/*okan */  

.puzzel:nth-child(3) {
	width: 20vw;
	height: 20vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
    }
.puzzel:nth-child(3) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*Sense*/  

.puzzel:nth-child(4) {
    width: 20vw;
	height: 20vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}
.puzzel:nth-child(4) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*starter */  

.puzzel:nth-child(5) {
	width: 40vw;
	height: 60vw;
margin-left: 60% !important;
margin-top: -20% !important;}
.puzzel:nth-child(5) .views-field-field-puzzelfotoonder {margin-top: -150%;}

/*creatie */  


.puzzel:nth-child(6) {
width: 20vw;
	height: 20vw;
	margin-top: -40% !important;
	margin-lef: 0% !important;
}
.puzzel:nth-child(6) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*maatschppij */ 

.puzzel:nth-child(7) {
	width: 20vw;
	height: 20vw;
margin-top: -40% !important;
margin-left: 20% !important;}

.puzzel:nth-child(7) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*stem */  

.puzzel:nth-child(8) {
	width: 20vw;
	height: 20vw;
margin-top: -40% !important;
margin-left: 40% !important;}

.puzzel:nth-child(8) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*zorg */
.puzzel:nth-child(9) {
	width: 20vw;
	height: 40vw;
	margin-top: -20% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(9) .views-field-field-puzzelfotoonder {margin-top: -200%;}

/*structuur */

.puzzel:nth-child(10) {
	width: 40vw;
	height: 20vw;
margin-top: -20% !important;
margin-left: 0% !important;
}

.puzzel:nth-child(10) .views-field-field-puzzelfotoonder {margin-top: -50%;}

/*wie is wie */
.puzzel:nth-child(11) {
	width: 20vw;
	height: 20vw;
margin-top: 0% !important;
margin-left: 0% !important;

}

.puzzel:nth-child(11) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*virtueel */ 
.puzzel:nth-child(12) {
	width: 60vw;
	height: 40vw;
	opacity: 1;
	margin-top: 0% !important;
	margin-left: 0% !important;


}
.puzzel:nth-child(12) .views-field-field-puzzelfotoonder {margin-top: -66.7%;}


/*out of the box */ 

.puzzel:nth-child(13) {
    width: 40vw;
    height: 40vw;
	margin-top: -20% !important;
	margin-left: 0% !important;	
}
.puzzel:nth-child(13) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*internaat */ 


.puzzel:nth-child(14) {
    width: 40vw;
    height: 60vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(14) .views-field-field-puzzelfotoonder {margin-top: -150%;}
/*op weg naar's */ 

.puzzel:nth-child(15) {
width: 20vw;
height: 40vw;
		margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(15) .views-field-field-puzzelfotoonder {margin-top: -200%;}

/*solliciteren */ 

.puzzel:nth-child(16) {
	width: 20vw;
	height: 20vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(16) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*werkgroepen */ 

.puzzel:nth-child(17) {
width: 40vw;
	height: 40vw;
	margin-top: -40% !important;
	margin-left: 0% !important;

}

.puzzel:nth-child(17) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*stories */ 

.puzzel:nth-child(18) {
	width: 60vw;
	height: 40vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(18) .views-field-field-puzzelfotoonder {margin-top: -66.7%;}

/*schoolboeken */ 

.puzzel:nth-child(19) {
	width: 40vw;
	height: 40vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}
.puzzel:nth-child(19) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*vrij*/ 

.puzzel:nth-child(20) {
    display: none;
	width: 100vw;
	height: 40vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(20) .views-field-field-puzzelfotoonder {margin-top: -400%;}


/* uitzetten melding adaptivethemes.com */

.attribution .attribution__link {
    color: #363636;
    display: none;
}



/*RICHTINGEN */

.node--view-mode-full .field-node--field-inleidingstekst p {color: #1db3b4 !important; font-weight: lighter !important; font-size: 1.1em !important; padding-bottom: 2em;}
.node--view-mode-full.node--type-richting p {font-size: 0.8em; color: #666;}
.node--view-mode-full.node--type-richting ul li {font-size: 0.8em; color: #666; list-style: disc; line-height: 1.3em; padding-bottom: 15px; margin-left: 15px;}
.node--view-mode-full.node--type-richting strong {color: #1db3b4;}
.node--view-mode-full.node--type-richting h1 {font-size: 2em; color: #1db3b4; font-weight: bolder; text-transform: uppercase; padding-bottom: 15px;}
.node--view-mode-full.node--type-richting h2 {font-size: 1.2em; color: #1db3b4; text-transform: uppercase; padding-top: 15px;}
.node--view-mode-full.node--type-richting h3 {font-size: 1.5em; color: #000; font-weight: bolder; text-transform: uppercase; padding-bottom: 15px;}
.node--view-mode-full.node--type-richting h4 {font-size: 1em; color: #1db3b4; font-weight: normal;  padding-top: 15px;}
/*youtube video */
.youtube-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}
.youtube-field-player {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*lestabel */
.node--type-richting .group-right {padding-left: 5%;}


tbody {background-color:rgba(29,179,180,0.10); 
}

thead, tbody, tr, th, td {
    border-width: 0px; border-color: none;
}
tr {
    border-top-color: #666;
    border-top-width: 1px;
    border-top-style: dotted;
} 

table.lestabel {min-width: 300px !important; border-radius: 15px; padding: 10px;}
table.lestabel tr {font-size: 0.8em;}
table.lestabel h2 {font-size: 1.5em; color: #1db3b4; padding-top: 15px; }
table.lestabel h3 {font-size: 1.2em; color: #1db3b4; padding-top: 15px; font-weight: bolder;}

.field-node--field-fotoboek {}

.group-right figure {height: 116px; width: 116px; float: left; margin-right: 14px;}


/* infofiche */
.file--mime-application-pdf {margin-top: 20px;}
.file--mime-application-pdf a:link {color: #fff;background-color: #1db3b4; padding: 10px; border-radius: 5px; border-color: #1db3b4; border-width: medium; border-style: solid;}
.file--mime-application-pdf a:hover {color: #000;background-color: #fff; padding: 10px; border-radius: 5px; border-color: #1db3b4; border-width: medium; border-style: solid;}

/*uitzonderingen voor onthaalklas vertalingen voeg de node class toe per pagina .node--id-99 */
.node--view-mode-full.node--type-richting.node--id-99 h3  {
    display: none;
}

/* overzicht richtingen */

/* blokken graden */

#block-views-block-eerste-graad-block-4 h2 {text-align: center; text-transform: uppercase; color: #000;  border-top-color: #000; border-top-style: dotted; border-top-width: thin;
padding-top: 30px;}
#block-views-block-eerste-graad-block-5  h2 {text-align: center; text-transform: uppercase; color: #000;  border-top-color: #000; border-top-style: dotted; border-top-width: thin;
padding-top: 30px;}

/* blokken KUNST EN CREATIE */

/*eerste graad*/

#block-views-block-sense-block-4 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px; }
/*tweede graad*/
#block-views-block-sense-block-3 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/*derde graad*/
#block-corpus-studio-views-block-sense-block-2 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/* specialisatiejaren*/
#block-views-block-sense-block-5 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/*sense*/
#block-views-block-sense-block-1 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}

/* blokken MAATSCHAPPIJ EN WELZIJN */

/*eerste graad*/

#block-views-block-domein-maatschappij-en-welzijn-block-4 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px; }
/*tweede graad*/
#block-views-block-domein-maatschappij-en-welzijn-block-3 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/*derde graad*/
#block-views-block-domein-maatschappij-en-welzijn-block-2 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/* specialisatiejaren*/
#block-views-block-domein-maatschappij-en-welzijn-block-5 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/*sense*/
#block-views-block-domein-maatschappij-en-welzijn-block-1 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}

/* blokken STEM */

/*tweede graad*/
#block-views-block-domein-stem-block-3 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/*derde graad*/
#block-views-block-domein-stem-block-2 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}
/*sense*/
#block-views-block-domein-stem-block-1 h2 {text-align: center; text-transform: uppercase; color: #1db3b4; font-weight: bolder;  border-top-color: #000; border-top-style: dotted; border-top-width: thin; padding-top: 30px;}

.richtingen {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align: center;
    vertical-align: top;
}

.richtingen .richting {
  height: 600px;
  width: 270px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
      border-top-color: #1db3b4;
    border-top-style: solid;
    border-top-width: 10px;

}
.richting ul li {list-style: disc;
line-height: 22px;
margin-left: 15px;
font-size: 0.9em;}

.kunstcreatie {
      border-top-color: #f19fb5 !important;

}

.kunstcreatie .field-node--field-naam-richting  {
    color: #f19fb5 !important;
}

.maatschappij {
      border-top-color: #7bc2ec !important;

}

.maatschappij .field-node--field-naam-richting  {
    color: #7bc2ec !important;
}

.stem {
      border-top-color: #ab84bb !important;

}

.stem .field-node--field-naam-richting  {
    color: #ab84bb !important;
}

.node.node--view-mode-teaser.node--type-richting {padding: 0px; padding-top: 15px;}

.field-node--field-naam-richting {color: #1db3b4; text-transform: uppercase; font-weight: bolder; font-size: 1.1em; text-align: left; height: 55px;}

.field-entity-reference-type-taxonomy-term .field__item {
margin-right: 5px;
display: inline-block;
margin-left: 0px;
}

.richting .field-node-field-domein {
    text-align: left;
    text-transform: uppercase;
    line-height: 10px;
padding-top: 5px;
    border-top-color: #666;
    border-top-style: dotted;
    border-top-width: thin;
    margin-top: 30px;
    font-size: 0.5em;
}

.richting .field-node-field-domein a:link {
    text-align: left;
    text-transform: uppercase;
    font-size: 0.5em;
    color: #000;
}
.richting .field-node-field-domein a:hover {
    text-align: left;
    text-transform: uppercase;
    font-size: 0.5em;
    color: #1db3b4;
    text-decoration: none;
}
.richting .field-node-field-domein a:visited {
    text-align: left;
    text-transform: uppercase;
    font-size: 0.5em;
    color: #000;
    text-decoration: none;
}

.field-label-inline .field__label {
    margin: 0;
    display: inline-block;
    padding: 0 0.375rem 0 0;
    text-align: left;
    text-transform: uppercase;
    font-size: 0.5em;
    color: #666;
}

.field-node-field-finaliteiten .field__label {
    margin: 0;
    display: inline-block;
    padding: 0 0.375rem 0 0;
    text-align: left;
    text-transform: uppercase;
    font-size: 1em;
    color: #666;
}



.richting .field__item--dubbele-finaliteit {
    text-align: left;
    text-transform: uppercase;
}
.richting .field-node-field-finaliteiten {
    text-align: left;
    text-transform: uppercase;
    font-size: 0.5em;
    color: #666;
    margin-top: -20px;
}

.richting .field-node-field-finaliteiten a:link {
        color: #000;
    text-decoration: none;
}




.richting .field-node--field-inleidingstekst {text-align: left; font-size: 0.8em; line-height: 1.3em; height: 110px; }

.richting .field-node--node-link {
    float: right; 
}
.richting .field-node--node-link a:link { background-color: #1db3b4; padding-right: 15px;width: 90px; font-size: 0.6em;
    color: #fff; padding: 10px; border-radius: 5px;
}

.richting .field-node--node-link a:hover {background-color: rgba(29,179,180,0.50); padding-right: 15px;width: 90px; font-size: 0.6em;
    color: #000; padding: 10px;text-decoration: none;
}
.richting .field-node--node-link a:visited { background-color: #1db3b4; padding-right: 15px;width: 90px; font-size: 0.6em;
    color: #fff; padding: 10px; border-radius: 5px;
}


.richting .field-type-image figure {
    margin-bottom: 1rem;
    text-align: left;
}

.richting .field-type-image figure img {
    width: 100%; height: auto;
}

/* basispagina met titel */

.node--type-basispagina-met-titel h2 {color: #1db3b4; font-weight: bolder; text-transform: uppercase;}
.node--type-basispagina-met-titel h3 {color: #1db3b4; font-weight: lighter;}
.node--type-basispagina-met-titel ul li {line-height: 2em; }
.node--type-basispagina-met-titel ul li::before { /* add the new bullet point */
  display: inline-block;
    content: '';
    -webkit-border-radius: 0.375rem;
    border-radius: 0.375rem;
    height: 0.75rem;
    width: 0.75rem;
    margin-right: 0.5rem;
    background-color: #bdbdbd;
}

#troeven {padding: 20px; padding-bottom: 5px; background-color: rgba(120,168,85,0.20);}
#troeven ul {list-style-position: inside;}
#troeven ul li {margin-left: 15px; font-size: 1.0em; color: #000; line-height: 1.3em; padding-bottom: 15px; padding-left: 15px; }
#troeven ul li::before { /* add the new bullet point */
  display: inline-block;
    content: '';
    -webkit-border-radius: 0.375rem;
    border-radius: 0.375rem;
    height: 0.50rem;
    width: 0.50rem;
    margin-right: 0.5rem;
    background-color: #000;
    margin-left: -15px
}

#troeven h3 {color: #9ac657; font-weight: bolder;}



/*PERSONEN */
.personen {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align: center;
    vertical-align: top;
}

.personen .persoon {
  height: 400px;
  width: 270px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
      border-top-color: #1db3b4;
    border-top-style: solid;
    border-top-width: 10px;

}

#block-views-block-personen-block-1-title { text-align: center;}
#block-views-block-personen-ta-block-1-title { text-align: center;}
#block-views-block-personen-eerste-graad-block-1-title { text-align: center; border-top-color: #666; border-top-style: dotted; border-top-width: thin; padding-top: 25px;}
#block-views-block-personen-tweede-graad-block-1-title { text-align: center; border-top-color: #666; border-top-style: dotted; border-top-width: thin; padding-top: 25px;}
#block-views-block-personen-derde-graad-block-1-title { text-align: center; border-top-color: #666; border-top-style: dotted; border-top-width: thin; padding-top: 25px;}
#block-views-block-personen-sense-block-1-title { text-align: center; border-top-color: #666; border-top-style: dotted; border-top-width: thin; padding-top: 25px;}

.persoon h2 { font-size: 1.2em; font-style: bolder;}
.persoon .field-node--field-fuctie { font-size: 0.8em; font-style: normal; text-align: center}

/*custom pagina's met titel */

.node--id-224 p strong {color: #1db3b4;}
.node--id-224 p strong a {color: #1db3b4; text-decoration:  underline;}

.node--id-224 ul li strong {color: #1db3b4;}


.node--id-223 p strong {color: #000;}
.node--id-223 p strong a {color: #1db3b4; text-decoration:  underline;}

.node--id-223 ul li strong {color: #1db3b4;}
.node--id-223 h4 {color: #1db3b4;}


/* OVERZICHTSTABEL AANBOD ------------------------------------------------- */

/*kleurcodes */

#kleurcodes {text-align: center;}
#kleurcodes .kunst {color: #f19fb5; display: inline-block; font-weight: bolder;}
#kleurcodes .maatschappij {color: #7bc2ec;display: inline-block; font-weight: bolder;}
#kleurcodes .stem {color: #ab63a5;display: inline-block; font-weight: bolder;}

#kleurcodes .kso {color:#FF5600; display: inline-block; font-weight: bolder;}
#kleurcodes .mode {color: #EE0003;display: inline-block; font-weight: bolder;}
#kleurcodes .personenzorg {color:#00A1FF;display: inline-block; font-weight: bolder;}
#kleurcodes .lichaamsverzorging {color:#699D01;display: inline-block; font-weight: bolder;}
#kleurcodes .wetenschap {color:#9D00EC; display: inline-block; font-weight: bolder;}


/*EERSTE GRAAD-------------------------------------------------------------------------------------------------------------------*/
/*titel eerste graad */

#block-eerstegraad-title {
    width: 98.3%;
    text-align: center;
    color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 1.4em;
    font-weight: bolder;
    background-color: #1db3b4;
}
/*

#block-views-block-aanbod-block-1-title {width: 100%; text-align: center; color: #fff; padding-top: 10px; padding-bottom: 10px;font-size: 1.4em; font-weight: bolder; background-color: #1db3b4; }
*/

/* titels 1A - 1B - OKAN - WEL WEERGEVEN */
#block-views-block-aanbod-eerste-graad-block-1-title {font-size: 1em; font-weight: bolder;}
#block-views-block-aanbod-eerste-graad-block-2-title {font-size: 1em; font-weight: bolder;}
#block-views-block-aanbod-eerste-graad-block-3-title {font-size: 1em; font-weight: bolder;}

#block-views-block-aanbod-eerste-graad-block-1 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
#block-views-block-aanbod-eerste-graad-block-2 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
#block-views-block-aanbod-eerste-graad-block-3 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}

/* eerste graad 1A kleurvolgorde */
#block-views-block-aanbod-eerste-graad-block-1 ul li a { color: #fff; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 0px; margin-top: 8px; }
#block-views-block-aanbod-eerste-graad-block-1 ul li a:link {background-color:rgba(29,179,180,0.60); color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-eerste-graad-block-1  ul li a:hover {background-color:rgba(29,179,180,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-eerste-graad-block-1-title ul li a:visited {margin-left: 15px; color: #fff; line-height: 1.1em; }

/* eerste graad 1B kleurvolgorde */
#block-views-block-aanbod-eerste-graad-block-2 ul li a { color: #fff; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 0px; margin-top: 8px; }
#block-views-block-aanbod-eerste-graad-block-2 ul li a:link {background-color:rgba(29,179,180,0.60); color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-eerste-graad-block-2  ul li a:hover {background-color:rgba(29,179,180,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-eerste-graad-block-2-title ul li a:visited {margin-left: 15px; color: #fff; line-height: 1.1em; }

/* eerste graad OKAN kleurvolgorde */
#block-views-block-aanbod-eerste-graad-block-3 ul li a { color: #fff; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 0px; margin-top: 8px; }
#block-views-block-aanbod-eerste-graad-block-3 ul li a:link {background-color:rgba(29,179,180,0.60); color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-eerste-graad-block-3  ul li a:hover {background-color:rgba(29,179,180,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-eerste-graad-block-3-title ul li a:visited {margin-left: 15px; color: #fff; line-height: 1.1em; }

/*TWEEDE GRAAD-------------------------------------------------------------------------------------------------------------------*/
/*titel tweede graad */

#block-tweedegraad-title {width: 98.3%; text-align: center; color: #fff; padding-top: 10px; padding-bottom: 10px;font-size: 1.4em; font-weight: bolder; background-color: #1db3b4; margin-top: 180px; }

/* titels doorstroom - dubbele finaliteit - arbeidsmarkt - WEL WEERGEVEN */
#block-views-block-aanbod-tweede-graad-titels-block-1-title {font-size: 1em; font-weight: bolder;}
#block-views-block-aanbod-tweede-graad-titels-block-2-title {font-size: 1em; font-weight: bolder;}
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3-title {font-size: 1em; font-weight: bolder;}


#block-kunstencreatie-title {width: 100%; text-align: center; color: #f19fb5; font-size: 1em; font-weight: bolder}
#block-views-block-aanbod-tweede-graad-titels-block-1 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
#block-views-block-aanbod-tweede-graad-titels-block-2 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
/* 3DE JAAR */
h2.derdejaar {
    width: 98.3%;
    text-align: center;
    color: #666;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 1.4em;
    font-weight: bolder;
    background-color: #eee;
}

/* tweede graad doorstroom - kleurvolgorde */
/*first child */
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:first-child a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 0px; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:first-child a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:first-child a:hover {background-color: rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:first-child a:visited {margin-left: 15px; color: #fff; line-height: 1.1em; }
/*2 child */
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(2) a:link {background-color:#7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(2) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*3 child */
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(3) a:link {background-color:#ab63a5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(3) a:hover {background-color:rgba(171,99,165,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-1 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/* tweede graad DUBBELE FINALITEIT - kleurvolgorde */
/*first child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:first-child a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 0px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:first-child a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:first-child a:hover {background-color: rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:first-child a:visited {margin-left: 15px; color: #fff; line-height: 1.1em; }
/*2 child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(2) a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(2) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*3 child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(3) a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(3) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*4 child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(4) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(4) a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(4) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(4) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*5 child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(5) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(5) a:link {background-color:#7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(5) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(5) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*6 child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(6) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(6) a:link {background-color:#7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(6) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(6) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*7 child */
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(7) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(7) a:link {background-color:#ab63a5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(7) a:hover {background-color:rgba(171,99,165,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-tweede-graad-titels-block-2 ul li:nth-child(7) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}


/* tweede graad ARBEIDSMARKT - kleurvolgorde */
/*first child */
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:first-child a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 0px; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:first-child a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:first-child a:hover {background-color: rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:first-child a:visited {margin-left: 15px; color: #fff; line-height: 1.1em; }
/*2 child */
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(2) a:link {background-color:#7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(2) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*3 child */
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(3) a:link {background-color:#7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(3) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}
/*4 child */
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(4) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(4) a:link {background-color:#7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(4) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3 ul li:nth-child(4) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*DERDE GRAAD-------------------------------------------------------------------------------------------------------------------*/
/*titel derde graad */

#block-corpus-studio-derdegraad-title {width: 98.3%; text-align: center; color: #fff; padding-top: 10px; padding-bottom: 10px;font-size: 1.4em; font-weight: bolder; background-color: #1db3b4; margin-top: 355px; }

/* titels doorstroom - dubbele finaliteit - arbeidsmarkt - WEL WEERGEVEN */
#block-aanbod-derde-graad-kunst-creatie-block-1-title {font-size: 1em; font-weight: bolder;}
#block-block-aanbod-derde-graad-kunst-creatie-block-2-title {font-size: 1em; font-weight: bolder;}
#block-block-aanbod-derde-graad-kunst-creatie-block-3-title {font-size: 1em; font-weight: bolder;}

#block-aanbod-derde-graad-kunst-creatie-block-1 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
#block-block-aanbod-derde-graad-kunst-creatie-block-2 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}
#block-block-aanbod-derde-graad-kunst-creatie-block-3 {width: 33%; float: left; vertical-align: top; top: 0; height: 100px;}

/* DERDE graad DOOSTROOM - kleurvolgorde */

/*first child */

#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:first-child a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:first-child a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:first-child a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:first-child a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*2 child */
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(2) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(2) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*3 child */
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(3) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(3) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*4 child */
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(4) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(4) a:link {background-color: #ab63a5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(4) a:hover {background-color:rgba(171,99,165,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-aanbod-derde-graad-kunst-creatie-block-1 ul li:nth-child(4) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}


/* DERDE graad DUBBELE FINALITEIT - kleurvolgorde */
/*first child */

#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:first-child a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:first-child a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:first-child a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:first-child a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*2 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(2) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(2) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*3 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(3) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(3) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*4 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(4) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(4) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(4) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(4) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*5 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(5) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(5) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(5) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(5) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*6 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(6) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(6) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#bblock-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(6) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#bblock-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(6) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*7 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(7) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(7) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(7) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(7) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*8 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(8) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(8) a:link {background-color:  #ab63a5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(8) a:hover {background-color:rgba(171,99,165,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-2 ul li:nth-child(8) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}



/* DERDE graad ARBEIDSMARKT - kleurvolgorde */
/*first child */
/*first child */

#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:first-child a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:first-child a:link {background-color:#f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:first-child a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:first-child a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*2 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(2) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(2) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*3 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(3) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(3) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*4 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(4) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(4) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(4) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(4) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*5 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(5) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(5) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(5) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(5) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

/*6 child */
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(6) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(6) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(6) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-block-aanbod-derde-graad-kunst-creatie-block-3 ul li:nth-child(6) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}




/*SENSE EN 7DE JAREN-------------------------------------------------------------------------------------------------------------------*/
/*titel sense en 7de jaren graad */

#block-corpus-studio-7deleerjaren-title {width: 98.3%; text-align: center; color: #fff; padding-top: 10px; padding-bottom: 10px;font-size: 1.4em; font-weight: bolder; background-color: #1db3b4; margin-top: 426px; }

/* titels doorstroom - dubbele finaliteit - arbeidsmarkt - WEL WEERGEVEN */
#block-views-block-aanbod-sense-oude-structuur-block-1-title {font-size: 1em; font-weight: bolder;}
#block-views-block-aanbod-sense-oude-structuur-block-2-title {font-size: 1em; font-weight: bolder;}

#block-views-block-aanbod-sense-oude-structuur-block-1 {width: 100%; float: none; vertical-align: top; top: 0; height: 100px;}
/*#block-views-block-aanbod-sense-oude-structuur-block-2 {width: 49.5%; float: left; vertical-align: top; top: 0; height: 100px; padding-bottom: 30%;}/*



/* 7DE JAREN - kleurvolgorde */

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(1) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(1) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(1) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(1) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(2) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(2) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(2) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(2) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(3) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(3) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(3) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(3) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(4) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(4) a:link {background-color: #f19fb5; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(4) a:hover {background-color:rgba(241,159,181,0.2); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(4) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(5) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(5) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(5) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(5) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(6) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(6) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(6) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(6) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}

#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(7) a { color: #000; line-height: 1.1em; padding: 10px; display: block; width: 98%; margin-top: 8px; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(7) a:link {background-color: #7bc2ec; color: #fff; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(7) a:hover {background-color:rgba(123,194,236,0.20); color: #000 !important; line-height: 1.1em; text-decoration: none; }
#block-views-block-aanbod-sense-oude-structuur-block-1 ul li:nth-child(7) a:visited {margin-left: 15px; color: #fff; line-height: 1.1em;}





/*TRANSPORT ---------------------------------------------------*/

.transportmiddel {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
    vertical-align: top;
}

.transportmiddel .transport {
  height: 250px;
  width: 250px;
  display:inline-block;
  margin: 10px;
}


/*OUT OF THE BOX ---------------------------------------------------*/

.icoontjes {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
    vertical-align: top;
}

.icoontjes .icoon {
  height: 280px;
  width: 280px;
  display:inline-block;
  margin: 10px;
}


#block-views-block-out-of-the-box-block-1-title {text-align: center;}
#block-views-block-out-of-the-box-block-2-title {text-align: center;}
#block-views-block-out-of-the-box-block-3-title {text-align: center;}

   .boxen {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align: center;
    vertical-align: top;
}

.boxen .box {
  height: 600px;
  width: 280px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
      border-top-color: #1db3b4;
    border-top-style: solid;
    border-top-width: 10px;

}

.box .field-node--body {text-align: left; font-size: 0.8em; line-height: 1.3em; height: 110px; }

.box h2 {color: #1db3b4; font-size: 1em; text-transform: uppercase; text-align: left; font-weight: bolder; }

.box .field-node--node-link {float: right;}

.box .field-node--node-link a:link { background-color: #1db3b4; padding-right: 15px;width: 90px; font-size: 0.6em;
    color: #fff; padding: 10px; border-radius: 5px;}

.box .field-node--node-link a:hover {background-color: rgba(29,179,180,0.50); padding-right: 15px;width: 90px; font-size: 0.6em;
    color: #000; padding: 10px;text-decoration: none;}

.box .field-node--node-link a:visited { background-color: #1db3b4; padding-right: 15px;width: 90px; font-size: 0.6em;
    color: #fff; padding: 10px; border-radius: 5px;}


.node--type-out-of-the-box .group-footer .field-node--field-social-media {height: 50px; vertical-align: middle; padding-top: 5px; border-top-color: #666; border-top-style: dotted; border-top-width: thin;}
.node--type-out-of-the-box .group-footer .field-node--field-social-media .field__label {font-size: 0.8em; vertical-align: top; height: 50px; padding-top: 12px;}


.node--type-out-of-the-box .group-right {padding-left: 15px;}

/*
.field-formatter-youtube-video {width:100%}

.youtube-field-player {
    width: 100% !important;
    height: auto;
    float: left;
    margin-right: 20px;
    margin-top: 0px;
}
*/
.field-node--field-logo {text-align: center;}

.field-name-field-fotoboek-outofthebox figure {height: 116px; width: 116px; float: left; margin-right: 14px;}

.node--type-out-of-the-box {padding-bottom: 15%;}


.website {width:250px; margin-top: 10px;}
.website a:link {color: #fff;
background-color: #1db3b4;
padding: 5px;
border-radius: 5px;
border-color: #1db3b4;
border-width: medium;
border-style: solid; 
}

.website a:active {color: #fff;
background-color: #1db3b4;
padding: 5px;
border-radius: 5px;
border-color: #1db3b4;
border-width: medium;
border-style: solid;
}

.website a:hover {color: #000;background-color: #fff; padding: 5px; border-radius: 5px; border-color: #1db3b4; border-width: medium; border-style: solid;}
.website a:visited {color: #fff;
background-color: #1db3b4;
padding: 5px;
border-radius: 5px;
border-color: #1db3b4;
border-width: medium;
border-style: solid;}

/* active school */
/*uitzetten lees meer knop*/

.actieveschool .box .field-node--node-link {display: none;}

/* CONTACT -----------------------------------------------------*/
#block-corpus-studio-page-title {margin: auto; color: #1db3b4; text-align: center; }

.contactbuttons{
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
    vertical-align: top;
}

.contactbuttons .contactbutton {
  height: 200px;
  width: 200px;
  display:inline-block;
  margin: 10px;
}

/*INTERNAAT ---------------------------------------------------*/

.icoontjesinternaat {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align:center;
    vertical-align: top;
}

.icoontjesinternaat  .icooninternaat {
  height: 200px;
  width: 200px;
  display:inline-block;
  margin: 10px;
}

.daginternaat > tbody > tr > td {font-size: 0.8em; line-height: 1.3em;}

.daginternaat > tbody > tr:first-child > td {background-color: #18b3b7; color: #fff; font-weight: bolder;}

.daginternaat > tbody > tr:nth-child(6) > td {background-color: #e6a3b5; color: #000;}
.daginternaat > tbody > tr:nth-child(14) > td {background-color: #e6a3b5; color: #000;}
/*lessen*/
.daginternaat > tbody > tr:nth-child(5) > td {background-color: #fff; color: #000;}
.daginternaat > tbody > tr:nth-child(7) > td {background-color: #fff; color: #000;}
/*vieruurtje*/
.daginternaat > tbody > tr:nth-child(11) > td:nth-child(2) {background-color: #e6a3b5; color: #000;}
.daginternaat > tbody > tr:nth-child(9) > td:nth-child(3) {background-color: #e6a3b5; color: #000;}
.daginternaat > tbody > tr:nth-child(8) > td:nth-child(4) {background-color: #e6a3b5; color: #000;}
.daginternaat > tbody > tr:nth-child(11) > td:nth-child(5) {background-color: #e6a3b5; color: #000;}

/* studie */
.daginternaat > tbody > tr:nth-child(10) > td:nth-child(4) {background-color: #cfb008; color: #000;}
.daginternaat > tbody > tr:nth-child(12) > td:nth-child(3) {background-color: #cfb008; color: #000;}
.daginternaat > tbody > tr:nth-child(13) > td:nth-child(2) {background-color: #cfb008; color: #000;}
.daginternaat > tbody > tr:nth-child(13) > td:nth-child(5) {background-color: #cfb008; color: #000;}
.daginternaat > tbody > tr:nth-child(16) > td {background-color: #cfb008; color: #000;}

.node--type-internaat-persoon {border-color: #18b3b7; border-style: solid; border-widht: thick; border-radius: 50px}
.node--type-internaat-persoon img {border-radius: 50%; width: 250px; height: 250px; margin-left: 50px; margin-top: 50px;}
.node--type-internaat-persoon h2 {color: #18b3b7; font-weight: bolder;}

/* infofiche */
.file--mime-application-vnd-openxmlformats-officedocument-wordprocessingml-document {margin-top: 20px; margin-bottom: 10px;}
.file--mime-application-vnd-openxmlformats-officedocument-wordprocessingml-document a:link {color: #fff;background-color: #1db3b4; padding: 10px; border-radius: 5px; border-color: #1db3b4; border-width: medium; border-style: solid;}
.file--mime-application-vnd-openxmlformats-officedocument-wordprocessingml-document a:hover {color: #000;background-color: #fff; padding: 10px; border-radius: 5px; border-color: #1db3b4; border-width: medium; border-style: solid;}


/* Werkgroepen */

/*teasers */

.node--view-mode-teaser.node--type-werkgroep h2 { color: #1db3b4 !important; font-size: 2.2em;  font-weight: bolder;}

.node--type-werkgroep .field-node--node-link {
    float: right; 
}
.node--type-werkgroep .field-node--node-link a:link { background-color: #1db3b4; padding-right: 15px;width: 90px; font-size: 1em;
    color: #fff; padding: 10px; border-radius: 5px;
}

.node--type-werkgroep.field-node--node-link a:hover {background-color: rgba(29,179,180,0.50); padding-right: 15px;width: 90px; font-size: 1em;
    color: #000; padding: 10px;text-decoration: none;
}
.node--type-werkgroep .field-node--node-link a:visited { background-color: #1db3b4; padding-right: 15px;width: 90px; font-size: 1em;
    color: #fff; padding: 10px; border-radius: 5px;
}


.node--view-mode-teaser.node--type-werkgroep {border-bottom-color: #666; border-bottom-style: dotted; border-bottom-width: thin;}

/* node full */

.node--view-mode-full.node--type-werkgroep h2 { color: #1db3b4 !important; font-size: 2.2em;  font-weight: bolder;}

.node--view-mode-full.node--type-werkgroep h3 { color: #1db3b4 !important; font-size: 2em;  font-weight: lighter;}

/* story */

.node--type-story h2 { color: #1db3b4 !important; font-size: 2.2em;  font-weight: bolder;}

.node--type-story .group-right {padding-left: 5%;}

.node--type-story .field-node--field-linkadres { margin-top: 150px;}

.node--type-story .field-node--field-linkadres a:link {
    color: #fff;
    background-color: #1db3b4;
    padding: 10px;
    border-radius: 5px;
    border-color: #1db3b4;
    border-width: medium;
    border-style: solid;
   
}

.node--type-story .field-node--field-linkadres a:active {
    color: #fff;
    background-color: #1db3b4;
    padding: 10px;
    border-radius: 5px;
    border-color: #1db3b4;
    border-width: medium;
    border-style: solid;
   
}

.node--type-story .field-node--field-linkadres a:hover {
    color: #fff;
    background-color: #000;
    padding: 10px;
    border-radius: 5px;
    border-color: #1db3b4;
    border-width: medium;
    border-style: solid;
   
}
.node--type-story .field-node--field-linkadres a:visited {
    color: #fff;
    background-color: #1db3b4;
    padding: 10px;
    border-radius: 5px;
    border-color: #1db3b4;
    border-width: medium;
    border-style: solid;
   
}

/*FOOTER */

#footer {position: fixed;
width: 100%;
    bottom: 0;
}

.pr-footer {color: #000;
    background: none;

    padding-top: 0px;
}

/* partners */

.partners {
  width: 100%;
  margin: 10px auto;
  position: fixed;
  text-align: center;
    vertical-align: top;
background-color: #1db3b4 !important;
    border-top-color: #000;
    border-top-style: solid;
    border-top-width: thick;
    padding-bottom: 20px;
    bottom: 25px;
}

.partners .partner {
  height: 100px;
  width: 150px;
  display:inline-block;
  margin: 10px;
    margin-top: 0px;
    vertical-align: top;

}
#block-corpus-studio-footer { width: 100%; background-color: #1db3b4 !important; padding-top: 15px; 
position: fixed; bottom: -20px;     border-top-color: #fff;
    border-top-style: solid;
    border-top-width: thin; }

#block-corpus-studio-footer ul { width: 80%; margin: auto;}
#block-corpus-studio-footer ul li {display: inline-block;}
#block-corpus-studio-footer ul li a:link {color: #fff; text-transform: uppercase; font-size: 0.8em; border-right-color: #fff; border-right-width: thin; border-right-style: solid; padding-right: 10px;}
#block-corpus-studio-footer ul li a:active {color: #fff;}
#block-corpus-studio-footer ul li a:hover {color: #000; text-decoration: none;}
#block-corpus-studio-footer ul li a:visited {color: #fff;}


/*HOMEBUTTONS BOVENPUZZEL*/

.advertenties {
  width: 100%;
  margin: 0px auto;
  position: relative;
  text-align: center;
    border-radius: 0px;

}
.advertenties img {border-radius: 0px; padding: 5px; width: 100%; height: auto;}

.advertenties .advertentie {
  height: 200px;
  width: 300px;
  display:inline-block;
  margin: 15px;
    vertical-align: top;
    
    
}


/* RESPONSIVE DESIGN -----------------------------------------------------------*/




/* RESPONSIVE DESIGN PUZZEL */
@media only screen and (max-width: 1202px) { #rid-content {margin-left: 0.5%;}

}


@media only screen and (max-width: 900px) {
    
    .site-branding__name {color: #1db3b4; 
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
font-weight: bolder;
font-size: 1.5em;
margin-left: -50px;
margin-top: 30px;}

.site-branding__logo-img {
    width: 50%;
    height: auto;
    margin-left: 20%;
}
    
#block-socmed {
float: right;
    margin-right: 60px;
    margin-top: -90px;
    position: relative
   }
    
/*overzicht richtingen */
    
    #block-sense7despecialisatiejaren-title {
    margin-top: 400px;
}
    #block-derdegraad-title {
    margin-top: 400px;
}
    
    .view-aanbod-sense-oude-structuur {padding-bottom: 25%;}
  
#footer {position: relative;
width: 100%;
bottom: 0 !important;
}
    
.l-attribution {background-color: #1db3b4 !important;}
  

}

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

@media only screen and (max-width: 568px) { 
    
    /* puzzelblok extra padding onderaan */
    
    #block-views-block-homepage-block-1 {padding-bottom: 30%; }
    
 /* footer - partners */
    
.partners { width: 100vw;
	height: 25vw;
	margin-top: 0% !important;
	margin-left: 0% !important;}
    
.partners .partner { width: 100px; height: 50px;}
    
.partners img {width: 100%; height: auto;}
    
    /* overzicht richtingen */
    
#kleurcodes {font-size: 0.6em;}  
#block-views-block-aanbod-eerste-graad-block-1-title { text-align: center;}
#block-views-block-aanbod-eerste-graad-block-2-title { text-align: center;}
#block-views-block-aanbod-eerste-graad-block-3-title { text-align: center;}
#block-views-block-aanbod-tweede-graad-titels-block-1-title { text-align: center;}
#block-views-block-aanbod-tweede-graad-titels-block-2-title { text-align: center;}
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3-title { text-align: center;}
#block-views-block-aanbod-derde-graad-kunst-creatie-block-1-title { text-align: center;}
#block-views-block-aanbod-derde-graad-kunst-creatie-block-2-title { text-align: center;}
#block-views-block-aanbod-derde-graad-kunst-creatie-block-3-title { text-align: center;}
#block-views-block-aanbod-sense-oude-structuur-block-1-title { text-align: center;}
#block-views-block-aanbod-sense-oude-structuur-block-2-title { text-align: center;}
    

#block-views-block-aanbod-eerste-graad-block-1 {width: 100%; margin-top: -10px;}
#block-views-block-aanbod-eerste-graad-block-2 {width: 100%; margin-top: -10px;}
#block-views-block-aanbod-eerste-graad-block-3 {width: 100%; margin-top: -10px;}

#block-tweedegraad-title {margin-top: 350px;}
    
#block-views-block-aanbod-tweede-graad-titels-block-1 {width: 100%; float: none; vertical-align: top; top: 0; height: 130px !important;}
#block-views-block-aanbod-tweede-graad-titels-block-2 {width: 100%; float: none; vertical-align: top; top: 0; height: 297px !important;}
#block-corpus-studio-views-block-aanbod-tweede-graad-titels-block-3{width: 100%; float: none; vertical-align: top; top: 0; height: 100px;}
    
#block-4dejaar-title {
    margin-top: 100px;
}

#block-views-block-aanbod-tweede-graad-oude-structuur-block-1 {width: 100%; float: none; vertical-align: top; top: 0; height: 160px !important;}
#block-views-block-aanbod-tweede-graad-oude-structuur-block-2 {width: 100%; float: none; vertical-align: top; top: 0; height: 120px !important;}
#block-views-block-aanbod-tweede-graad-oude-structuur-block-3 {width: 100%; float: none; vertical-align: top; top: 0; height: 100px;}

#block-corpus-studio-derdegraad-title {margin-top: 150px;}

#block-aanbod-derde-graad-kunst-creatie-block-1-title {text-align: center;}
#block-block-aanbod-derde-graad-kunst-creatie-block-2-title {text-align: center;}
#block-block-aanbod-derde-graad-kunst-creatie-block-3-title {text-align: center;}

#block-aanbod-derde-graad-kunst-creatie-block-1 {width: 100%; float: none; vertical-align: top; top: 0; height: 220px !important;}
#block-block-aanbod-derde-graad-kunst-creatie-block-2 {width: 100%; float: none; vertical-align: top; top: 0; height: 377px;}
#block-block-aanbod-derde-graad-kunst-creatie-block-3 {width: 100%; float: none; vertical-align: top; top: 0; height: 100px;}

#block-corpus-studio-7deleerjaren-title {margin-top: 180px !important;}

#block-views-block-aanbod-sense-oude-structuur-block-1 {width: 100%; float: none; vertical-align: top; top: 0; height: 270px;}
#block-views-block-aanbod-sense-oude-structuur-block-2 {width: 100%; float: none; vertical-align: top; top: 0; height: 100px; padding-bottom: 30%;}
    
}


@media only screen and (max-width: 450px) {
    
html, body {max-width: 100%; overflow-x: none; }
    

.pr-header { background-color: transparent; }
    
.site-branding__name {color: #1db3b4; font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; font-weight: bolder; font-size: 1.2em; margin-left: -50px; margin-top: 30px;}
    
    
/*socmed*/
    
#smartschool_button {
    background-image: url(/sites/default/files/inline-images/smartschool_hover.png);
    background-size: 30px 30px;
    width: 30px;
    height: 30px;
}
    
#bel_button {
    background-image: url(/sites/default/files/inline-images/phone_hover.png);
    background-size: 30px 30px;
    width: 30px;
    height: 30px;
}


#instagram_button {
    background-image: url(/sites/default/files/inline-images/instagram_hover.png);
     background-size: 30px 30px;
    width: 30px;
    height: 30px;
}


#facebook_button {
    background-image: url(/sites/default/files/inline-images/facebook_hover.png);
     background-size: 30px 30px;
    width: 30px;
    height: 30px;
}


#youtube {
    background-image: url(/sites/default/files/inline-images/youtube_hover.png);
     background-size: 30px 30px;
    width: 30px;
    height: 30px;
}


#mail_button {
    background-image: url(/sites/default/files/inline-images/mail_hover.png);
     background-size: 30px 30px;
    width: 30px;
    height: 30px;
}

.sf-accordion-toggle {
    float: right;
    right: 10px;
    position: absolute;
    margin-top: -7px;
}


    

    
/* PUZZEL HOME */
    
    
.puzzel:first-child  {
display: none;
	width: 100vw;
    height: 100vw;
	margin-top: 0% !important;
	margin-left: 0% !important;

}
    
/*eerste jaar */  

.puzzel:nth-child(2) {
	width: 50vw;
	height: 50vw;
	margin-top: 150% !important; /* bij grote foto zichtbaar wijzigen in 100% */
	margin-left: 0% !important;
    }

.puzzel:nth-child(2) .views-field-field-puzzelfotoonder {margin-top: -100%;}


/*okan */  

.puzzel:nth-child(3) {
	width: 50vw;
	height: 50vw;
	margin-top: 150% !important; /* bij grote foto zichtbaar wijzigen in 100% */
	margin-left: 0% !important;
    }
.puzzel:nth-child(3) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*Sense*/  

.puzzel:nth-child(4) {
    width: 50vw;
	height: 50vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}
.puzzel:nth-child(4) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*starter */  

.puzzel:nth-child(5) {
	width: 100vw;
	height: 60vw;
margin-left: 0 !important;
margin-top: -250% !important;
}
.puzzel:nth-child(5) .views-field-field-puzzelfotoonder {margin-top: -150%;}

/*creatie */  


.puzzel:nth-child(6) {
width: 50vw;
	height: 50vw;
	margin-top: -50% !important;
	margin-left: 50% !important;
}
.puzzel:nth-child(6) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*maatschppij */ 

.puzzel:nth-child(7) {
	width: 50vw;
	height: 50vw;
margin-top: 0% !important;
margin-left: 0 !important;}

.puzzel:nth-child(7) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*stem */  

.puzzel:nth-child(8) {

	width: 50vw;
	height: 50vw;
margin-top: -50% !important;
margin-left: 50% !important;}

.puzzel:nth-child(8) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*zorg */
.puzzel:nth-child(9) {

	width: 100vw;
	height: 100vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(9) .views-field-field-puzzelfotoonder {margin-top: -200%;}

/*structuur */

.puzzel:nth-child(10) {

	width: 100vw;
	height: 100vw;
margin-top: 100% !important;
margin-left: 0% !important;
}

.puzzel:nth-child(10) .views-field-field-puzzelfotoonder {margin-top: -50%;}

/*wie is wie */
.puzzel:nth-child(11) {
	width: 100vw;
	height: 100vw;
margin-top: -50% !important;
margin-left: 0% !important;

}

.puzzel:nth-child(11) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*virtueel */ 
.puzzel:nth-child(12) {
	width: 100vw;
	height: 100vw;
	opacity: 1;
	margin-top: 0% !important;
	margin-left: 0% !important;


}
.puzzel:nth-child(12) .views-field-field-puzzelfotoonder {margin-top: -66.7%;}


/*out of the box */ 

.puzzel:nth-child(13) {
    width: 100vw;
    height: 100vw;
	margin-top: -34% !important;
	margin-left: 0% !important;	
}
.puzzel:nth-child(13) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*internaat */ 


.puzzel:nth-child(14) {
    width: 100vw;
    height: 100vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(14) .views-field-field-puzzelfotoonder {margin-top: -150%;}
/*op weg naar's */ 

.puzzel:nth-child(15) {
width: 100vw;
height: 100vw;
		margin-top: 50% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(15) .views-field-field-puzzelfotoonder {margin-top: -200%;}

/*solliciteren */ 

.puzzel:nth-child(16) {
	width: 100vw;
	height: 100vw;
	margin-top: 100% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(16) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*werkgroepen */ 

.puzzel:nth-child(17) {
width: 100vw;
	height: 100vw;
	margin-top: 0% !important;
	margin-left: 0% !important;

}

.puzzel:nth-child(17) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*stories */ 

.puzzel:nth-child(18) {
	width: 100vw;
	height: 100vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(18) .views-field-field-puzzelfotoonder {margin-top: -66.7%;}

/*schoolboeken */ 

.puzzel:nth-child(19) {
	width: 100vw;
	height: 100vw;
	margin-top: -33% !important;
	margin-left: 0% !important;
}
.puzzel:nth-child(19) .views-field-field-puzzelfotoonder {margin-top: -100%;}

/*vrij*/ 

.puzzel:nth-child(20) {
	width: 100vw;
	height: 100vw;
	margin-top: 0% !important;
	margin-left: 0% !important;
}

.puzzel:nth-child(20) .views-field-field-puzzelfotoonder {margin-top: -400%;}
    
    /* richtingen */
    .richtingen {
  width: 100%;
  margin: 10px auto;
  position: relative;
  text-align: center;
    vertical-align: top;
}

.richtingen .richting {
  height: 600px;
  width: 280px;
  display:inline-block;
  margin: 10px;
    vertical-align: top;
      border-top-color: #1db3b4;
    border-top-style: solid;
    border-top-width: 10px;

}

    
        
    /* footer - partners */
    
.partners { width: 100vw;
	height: 25vw;
	margin-top: 0% !important;
	margin-left: 0% !important;}
    
.partners .partner { width: 100px; height: 50px;}
    
.partners img {width: 70%; height: auto;}
}
    


@media only screen and (max-width: 320px) { 
    
    /* branding */
    
    .site-branding__text {display: none;}
.site-branding__logo-img {
    width: 50%;
    height: auto;
    margin-left: 55%;
}
img .site-branding__logo-img {
    margin-top: 20px;
}
    
.site-branding__logo-link {
    display: block;
    padding-right: 1rem;
    min-width: 150px;
    width: 150px;
    margin-top: 30px;
    padding-top: 20px;
}
    
#block-socmed {
    float: right;
    margin-right: 60px;
    margin-top: -100px;
    position: relative;
}
    
    .sf-accordion-toggle {
    float: right;
    right: 10px;
    position: absolute;
    margin-top: -17px;
}
    
    h1, .h1 {
    font-size: 1.625rem;
}
    
    /* overzicht richtingen */
#block-views-block-aanbod-tweede-graad-titels-block-1 {height: 185px !important;}
#block-views-block-aanbod-tweede-graad-titels-block-2 {height: 301px !important;}
#block-views-block-aanbod-derde-graad-kunst-creatie-block-1 {height: 260px !important;}
#block-views-block-aanbod-derde-graad-kunst-creatie-block-2 {height: 394px !important;}
#block-views-block-aanbod-derde-graad-kunst-creatie-block-3 {height: 120px !important;}
#block-views-block-aanbod-sense-oude-structuur-block-1 {height: 310px;}
    
    
#block-sense7despecialisatiejaren-title {font-size: 0.8em;}
    
#block-views-block-partners-block-1 {  margin-top: 1650%;}
    
 /* footer - partners */
    
.partners { width: 100vw;
	height: 35vw;
	margin-top: 0% !important;
	margin-left: 0% !important;}
    
.partners .partner { width: 60px; height: 50px;}
    
.partners img {width: 100%; height: auto;}

    

    }