/* Tags */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap');

html
{
    font-family: 'Poppins', 'Noto Emoji', sans-serif;
}
    
body
{
    background-color: #ffffff;
}

/* Main styles */

a
{
    color: #0f555e;
    text-decoration: none;
}

a:hover
{
    text-decoration: underline;
}

h1, h2, h3
{
    color: #0f555e;
    font-family: 'Poppins', sans-serif !important;
}

.container p, .container ul li
{
    font-family: 'Poppins', 'Noto Emoji', sans-serif;
}

blockquote
{
    font-style: italic;
    margin: 16px 0px 32px 0px;
}

/* Navbar */

.dialog-off-canvas-main-canvas.d-flex.flex-column.h-100
{
    height: auto !important;
}

header
{
    background-color: #ffffff;
    font-family: 'Poppins', 'Noto Emoji', sans-serif;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1000;
}

.region-nav-branding
{
    align-items:center;
    display: flex;
}

#block-b5-vti-brandingafdelingen img
{
    height: 40px;
    margin: 8px;
}

@media(max-width: 1399px)
{
    #block-b5-vti-brandingafdelingen img
    {
        height: 25px;
        margin: 4px;
    }

    @media(max-width: 1199px)
    {
        #block-b5-vti-brandingafdelingen
        {
            display: none;
        }
    }

    @media(max-width: 991px)
    {
        #block-b5-vti-brandingafdelingen
        {
            display: block;
        }
    }
}

.navbar-nav .nav-item .nav-link
{
    /*border-radius: 5px;*/
    color: #000000;
    font-family: 'Poppins', 'Noto Emoji', sans-serif;
    /*font-weight: bold;*/
    margin: 5px;
    padding: 20px;
}

.navbar-nav .nav-item .nav-link:hover, .navbar-nav .nav-item .is-active, .navbar-nav .nav-item .active
{
    background-color: #0f555e;
    color: #ffffff;
    text-decoration: none;
}
    
.navbar-nav .nav-item .show
{
    background-color: #0f555e;
    color: #ffffff;
}

.dropdown-menu
{
    background-color: #ffffff;
    border: 2px solid #0f555e;
    border-radius: 0px;
}
    
.navbar-nav .nav-item ul.show
{
    background-color: #ffffff;
    color: #000000;
}

.dropdown-menu
{
    padding: 0px;
}

.dropdown-menu .dropdown-item
{
    color: #000000;
    /*font-weight: bold;*/
    padding: 16px;
    width: auto;
}
    
.dropdown-menu .dropdown-item:hover
{
    background-color: #0f555e;
    color: #ffffff;
    text-decoration: none;
}

/* Block Digitale systemen */

.block__digitale__systemen
{
    display: flex;
    height: 100%;
}

.block__digitale__systemen a
{
    border: 2px solid transparent;
    /*border-radius: 7px;*/
    display: block;
    height: 40px;
    margin: 2px;
    padding: 2px;
    width: auto;
}

.block__digitale__systemen a:hover
{
    border: 2px solid #0f555e;
}

.block__digitale__systemen img
{
    /*border-radius: 5px;*/
    height: 32px;
    width: auto;
}

@media (max-width: 1199px)
{
    .dropdown-menu .dropdown-item
    {
        padding: 10px;
    }
    
    #block-b5-vti-digitalesystemen
    {
        display: none;
    }
}

/* Main content */

main
{
    margin-top: 30px;
    margin-bottom: 30px;
}

@media (min-width: 992px)
{
    main .region-sidebar-first, main .region-content, main .region-sidebar-second
    {
        background-color: #ffffff;
        overflow: auto;
        /*padding: 45px;*/
    }
    
    main .region-sidebar-first
    {
        margin-right: 16px;
    }
    
    main .region-sidebar-second
    {
        margin-left: 16px;
    }
}

#block-b5-vti-page-title h1
{
    /*border-bottom: 3px solid #0f555e;*/
    margin-bottom: 30px;
    padding-bottom: 30px;
    text-align: center;
}

/* Footer */
footer
{
    background-color: #0f555e;
    display: block;
    margin-top: 16px !important;
}

@media (min-width: 992px)
{
    footer .region-footer
    {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
}

/* Inschrijven tijdens de kerstvakantie */

#block-b5-vti-inschrijventijdensdekerstvakantie
{
	/*background-attachment: fixed;*/
    background-image:url("/sites/default/files/media/kerstmis.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	height: fit-content;
	margin-bottom: 16px;
	padding: 16px;
	width: auto;
}

#block-b5-vti-inschrijventijdensdekerstvakantie .w3-section
{
	margin: 16px;
}

#block-b5-vti-inschrijventijdensdekerstvakantie p
{
	font-weight: bold;
}

#block-b5-vti-inschrijventijdensdekerstvakantie a
{
    text-decoration: none;
}

#block-b5-vti-inschrijventijdensdekerstvakantie a:hover
{
    text-decoration: underline;
}

@media (min-width: 992px)
{
    #block-b5-vti-inschrijventijdensdekerstvakantie p
    {
        width: 85%;
    }
}

@media (max-width: 991px)
{
	#block-b5-vti-inschrijventijdensdekerstvakantie h2, #block-b5-vti-inschrijventijdensdekerstvakantie .field--name-body
	{
		background-color: rgba(255, 255, 255, 0.75);
        backdrop-filter: blur(5px);
		/*border-radius: 10px;*/
		padding: 16px;
		width: fit-content;
	}
}

/* contactgegevens */

#block-b5-vti-contactgegevens
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    color: #ffffff;
    justify-content: center;
    padding: 30px;
}

#block-b5-vti-contactgegevens h2
{
    color: #ffffff;
}

#block-b5-vti-contactgegevens a
{
    color: #ffffff;
    font-weight: bold;
    text-decoration: none;
}

#block-b5-vti-contactgegevens a:hover
{
    text-decoration: underline;
}

@media (max-width: 991px)
{
    #block-b5-vti-contactgegevens h2
    {
        text-align: center;
    }
    
    #block-b5-vti-contactgegevens p
    {
        text-align: center;
    }
}

@media (min-width: 992px)
{
    #block-b5-vti-contactgegevens
    {
        width: 30%;
    }
}

/* Social media */

#block-b5-vti-socialmedia
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    padding: 30px;
}

#block-b5-vti-socialmedia h2
{
    color: #ffffff;
    text-align: center;
}

#block-b5-vti-socialmedia p
{
    display: flex;
    justify-content: center;
}

#block-b5-vti-socialmedia a
{
    display: block;
    margin: 16px;
}

#block-b5-vti-socialmedia a img
{
    height: 50px;
    width: auto;
}

@media (max-width: 991px)
{
    #block-b5-vti-socialmedia
    {
        border-bottom: 1px solid #ffffff;
        border-top: 1px solid #ffffff;
        margin: 16px 0;
    }
}

@media (min-width: 992px)
{
    #block-b5-vti-socialmedia
    {
        border-left: 1px solid #ffffff;
        border-right: 1px solid #ffffff;
        margin: 0 16px;
        width: 40%;
    }
}

/* Nuttige links */

#block-b5-vti-nuttigelinks
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    justify-content: center;
    padding: 30px;
}

#block-b5-vti-nuttigelinks h5
{
    color: #ffffff;
    font-size: 2rem;
    font-weight: 500;
}

#block-b5-vti-nuttigelinks .navbar-nav
{
    /*align-items: stretch;*/
}

#block-b5-vti-nuttigelinks li a
{
    color: #ffffff;
    display: block;
    margin: 5px 0px;
    padding: 4px 10px;
    width: 100%;
}

#block-b5-vti-nuttigelinks li a:hover
{
    background-color: #ffffff;
    color: #0f555e;
}

@media (max-width: 991px)
{
    #block-b5-vti-nuttigelinks h5
    {
        text-align: center;
    }
    
    #block-b5-vti-nuttigelinks li
    {
        text-align: center;
    }
}

@media (min-width: 992px)
{
    #block-b5-vti-nuttigelinks
    {
        width: 30%;
    }
    
    #block-b5-vti-nuttigelinks h5
    {
        text-align: right;
    }
    
    #block-b5-vti-nuttigelinks li
    {
        text-align: right;
    }
    
    #block-b5-vti-nuttigelinks .navbar-nav
    {
        align-items: flex-end;
    }
    
    #block-b5-vti-nuttigelinks .nav-item
    {
        width: fit-content;
    }
}

/* Fields */

.navbar-brand img
{
    height: 75px;
    width: auto;
}

.navbar-brand a.site-title
{
    color: #0f555e;
    text-transform: none;
}

.navbar-brand a.site-title:hover
{
    color: #0f555e;
}

.field--name-title
{
    color: #0f555e;
}

/* Views */

/* Nieuws */

.view-nieuws .display__flex-image-text
{
    border-bottom: 1px solid #0f555e;
    margin-bottom: 15px;
    padding-bottom: 15px;
}

.view-nieuws .display__flex-image-text__image img
{
    /*border-radius: 5px;*/
}

.view-nieuws h2 a
{
    text-decoration: none;
}

.view-nieuws h2 a:hover
{
    text-decoration: underline;
}

.view-nieuws .item-list ul li
{
    font-style: italic;
    list-style-type: none;
    margin-left: 0px;
}

@media (max-width: 991px)
{
    .view-nieuws .display__flex-image-text__image
    {
        margin: 0px auto;
        margin-bottom: 15px;
        width: 220px;
    }
    
    .view-nieuws .display__flex-image-text__image a
    {
        display: block;
        width: 100%;
    }
    
    .view-nieuws .display__flex-image-text__image img
    {
        /*height: 325px;*/
        width: 100%;
    }
    
    .view-nieuws h2, .view-nieuws .item-list ul li
    {
        text-align: center;
    }
}

@media (min-width: 992px)
{
    .view-nieuws .display__flex-image-text
    {
        display: flex;
 	
 	    align-items: flex-start;
    }
    
    .view-nieuws .display__flex-image-text__image
    {
        flex-shrink: 0;
        margin-right: 15px;
        width: 355px;
    }
    
    .view-nieuws .display__flex-image-text__image a
    {
        display: block;
        width: 100%;
    }
    
    .view-nieuws .display__flex-image-text__image img
    {
        /*height: 325px;*/
        width: 325px;
    }
}

.block-views-blocknieuws-block-1
{
    border-bottom: 1px solid #0f555e;
    margin-bottom: 16px;
}

.block-views-blocknieuws-block-1 .view-nieuws .display__flex-image-text
{
    border: 0;
}

.button__nieuws
{
    width: fit-content;
}

.button__nieuws a
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    color: #ffffff;
    display: block;
    margin: 16px;
    padding: 16px;
    text-decoration: none;
    width: fit-content;
}

.button__nieuws a:hover
{
    background-color: #f2ecdd;
    color: #000000;
}

@media (max-width: 991px)
{
    .block-views-blocknieuws-block-1 h2
    {
        text-align: center;
    }
    
    .button__nieuws
    {
        width: 100%;
    }
    
    .button__nieuws a
    {
        margin: 16px auto;
    }
}

@media (min-width: 992px)
{
    .button__nieuws
    {
        bottom: 100px;
        float: right;
        position: relative;
    }
}

/* Wie is wie */

.wie-is-wie__kaart
{
    background-color: #0f555e;
    /*border: 2px solid #0f555e;*/
}

.view-wie-is-wie .item-list h3
{
    color: #0f555e;
    margin-top: 15px;
    text-align: center;
}

.view-wie-is-wie .item-list h3 a
{
    text-decoration: none;
}

.view-wie-is-wie ul
{
    list-style-type: none;
}

.view-wie-is-wie ul li
{
    margin-left: 0px;
}

.wie-is-wie__kaart h4
{
    /*color: #ffffff;*/
}

@media (min-width: 992px)
{
    .view-wie-is-wie ul
    {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .wie-is-wie__kaart
    {
        /*border-radius: 5px;*/
        /*background-color: #ffffff;*/
        display: flex;
        flex-direction: column;
        flex-wrap: no-wrap;
        height: 350px;
        margin: 16px;
        padding: 12px;
        width: 300px;
    }
    
    .wie-is-wie__foto img
    {
        border: 2px solid #0f555e;
        /*border-radius: 5px;*/
        display: block;
        height: 160px;
        margin: 0px auto;
        /*position: relative;
        top: 20px;*/
        width: auto;
    }
    
    .wie-is-wie__kaart h4
    {
        border-bottom: 1px solid #ffffff;
        color: #ffffff;
        padding: 8px 0px;
        text-align: center;
    }

    .wie-is-wie__kaart .item-list ul
    {
        display: block;
    }
    
    .wie-is-wie__kaart .item-list ul li
    {
        font-weight: bold;
        margin-bottom: 0px;
        text-align: center;
    }
    
    .wie-is-wie__kaart .wie-is-wie__email
    {
        font-size: 0.8em;
        text-align: center;
    }
    
    .wie-is-wie__kaart .wie-is-wie__info
    {
        /*background-color: #f2ecdd;
        border-top: 10px solid #0f555e;*/
        color: #ffffff;
        flex-grow: 1;
        height: fit-content;
    }
}

@media (max-width: 991px)
{
    .wie-is-wie__kaart
    {
        /*border-radius: 5px;*/
        color: #ffffff;
        margin: 15px;
        padding: 15px;
    }
    
    .wie-is-wie__foto
    {
        display: none;
    }
    
    .view-wie-is-wie .item-list h3
    {
        margin-top: 30px;
        text-align: center;
    }
    
    .wie-is-wie__kaart h4
    {
        border-bottom: 1px solid #ffffff;
        color: #ffffff;
        padding-bottom: 8px;
        padding-left: 15px;
    }
    
    .wie-is-wie__kaart .item-list, .wie-is-wie__kaart .wie-is-wie__email
    {
        margin-left: 15px;
    }
    
    .wie-is-wie__kaart .item-list ul li
    {
        font-weight: bold;
    }
}

/* Studierichtingen */

.view-grouping
{
    border: 2px solid #0f555e;
    /*border-radius: 5px;*/
    margin-bottom: 16px;
    padding: 16px;
}

.view-studierichtingen .view-grouping-header
{
    /*border-bottom: 1px solid #0f555e;*/
    color: #0f555e;
    display: block;
    font-size: 2em;
    font-weight: 500;
    margin-bottom: 16px;
    padding: 10px;
    text-align: center;
    text-decoration: none;
}

.view-studierichtingen .item-list h3
{
    /*border-bottom: 1px dashed #0f555e;*/
    color: #0f555e;
    display: block;
    margin: 15px 0;
    padding: 10px;
    text-align: center;
    text-decoration: none;
}

.view-studierichtingen .item-list h3 a
{
    /*border-radius: 5px;*/
    color: #0f555e;
    text-decoration: none;
}

.view-studierichtingen .item-list ul
{
    list-style-type: none;
}

.view-studierichtingen .item-list ul li
{
    margin: 0px;
}

.view-studierichtingen .item-list ul li a
{
    align-items: center;
    background-color: #0f555e;
    /*border-radius: 5px;*/
    color: #ffffff;
    display: flex;
    /*font-weight: bold;*/
    height: 4em;
    margin: 15px;
    padding: 15px;
    text-decoration: none;
}

.view-studierichtingen .item-list ul li .Horeca
{
    background-color: #fdc204;
    color: #ffffff;
}

.view-studierichtingen .item-list ul li .Techniek
{
    background-color: #3693ff;
    color: #ffffff;
}

.view-studierichtingen .item-list ul li .Wetenschap
{
    background-color: #ff4f26;
    color: #ffffff;
}

.view-studierichtingen .item-list ul li a:hover
{
    background-color: #f2ecdd;
    color: #000000;
}

.view-studierichtingen .item-list ul li .Horeca:hover
{
    background-color: #ffeabc;
    color: #000000;
}

.view-studierichtingen .item-list ul li .Techniek:hover
{
    background-color: #95c6ff;
    color: #000000;
}

.view-studierichtingen .item-list ul li .Wetenschap:hover
{
   background-color: #ff9678;
   color: #000000;
}

.view-studierichtingen .item-list ul li a div
{
    margin: 0px auto;
    text-align: center;
}

@media (min-width:992px)
{
    .view-studierichtingen .item-list ul
    {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .view-studierichtingen .item-list ul li a
    {
        width: 300px;
    }
}

/*Nieuwe studierichtingen*/

#container__nieuwe__studierichtingen h2

{

 background-color: #0f555e;

 color: #ffffff;

 margin: 15px;

 padding: 10px;

 text-align: center;

}

#container__nieuwe__studierichtingen h3

{

 background-color: #0f555e;

 color: #ffffff;

 margin: 15px;

 padding: 10px;

 text-align: center;

}

#container__nieuwe__studierichtingen h4

{

 background-color: #5ab1b9;

 color: #ffffff;

 margin: 15px;

 padding: 10px;

 text-align: center;

}

#container__nieuwe__studierichtingen p

{

 background-color: #b2dee8;

 margin: 15px;

 /*padding: 15px;*/

 text-align: center;

}

#container__nieuwe__studierichtingen p a
{
    display: block;
    padding: 15px;
    text-decoration: none;
    width: 100%;
}

#container__nieuwe__studierichtingen p a:active, #container__nieuwe__studierichtingen p a:hover
{
    text-decoration: underline;
}

@media (min-width: 1201px), print

{

 #eerste__graad, #tweede__graad, #derde__graad

 {

 	border: 1px solid #0f555e;

	margin-bottom: 15px;

 }

 #container__nieuwe__studierichtingen h2, #container__nieuwe__studierichtingen h3, #container__nieuwe__studierichtingen h4, #container__nieuwe__studierichtingen p

 {

 	margin: 0px;

 }
 
 #container__nieuwe__studierichtingen h3
 {
     font-size: 1.2rem;
 }
 
 #container__nieuwe__studierichtingen h4
 {
     font-size: 1rem;
 }
 
  #container__nieuwe__studierichtingen .hide__on__mobile
  {
      padding: 15px;
  }
  
  @media (min-width: 1400px)
  {
      #container__nieuwe__studierichtingen .hide__on__mobile
      {
          display: none;
      }
  }

 #container__nieuwe__studierichtingen .studierichtingen__flex

 {

 	align-items: stretch;

	display: flex;

 	flex-direction: row;

 	/*flex-wrap: wrap;*/

 }

 #container__nieuwe__studierichtingen .studierichtingen__flex div

 {

 	border: 1px solid #0f555e;

	border-collapse: collapse;

 }

 #container__nieuwe__studierichtingen .studierichtingen__flex div div

 {

 	border: none;

 }

 .studierichtingen__sub__border

 {

 	border-right: 2px solid #0f555e !important;

	min-width: 50%;

 }
 
 #eerste__graad__content1, #eerste__graad__content2

 {

 	background-color: #b2dee8;

	/*border: 1px solid #5ab1b9;*/

	width: 50%;

 }

 #tweede__graad__content1, #derde__graad__content1

 {

 	background-color: #b2dee8;

	/*border: 1px solid #5ab1b9;*/

	min-width: 40%;

 }

 #derde__graad__content1
 {
	/*display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;*/
 }

 #tweede__graad__content2, #tweede__graad__content3, #derde__graad__content2, #derde__graad__content3

 {

 	background-color: #b2dee8;

	/*border: 1px solid #5ab1b9;*/

	/*flex-grow: 1;*/

	min-width: 30%;

 }

}

@media (max-width: 1200px)
{
	.hide__on__mobile
	{
		display: none;
	}
}

/* Various */

/* General small layout */

.center__text
{
    text-align: center;
}

@media (max-width: 991px)
{
    .hide__on__mobile
    {
        display: none;
    }
}

.os__button2
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    color: #ffffff;
    display: block;
    font-weight: bold;
    padding: 15px;
    text-decoration: none;
    width: fit-content;
}

.os__button2:hover
{
    background-color: #f2ecdd;
    color: #000000;
    text-decoration: none;
}

/*.os__button2 img
{
    background-color: #ffffff;
    padding: 2px;
}*/

.os__button3
{
    background-color: #ffffff;
    border: 2px solid #ffffff;
    /*border-radius: 5px;*/
    color: #0f555e;
    display: block;
    font-weight: bold;
    padding: 2px;
    text-decoration: none;
    width: fit-content;
}

.os__button3:hover
{
    border: 2px solid #0f555e;
    text-decoration: none;
}

.facebook
{
    align-items: flex-end;
    background-color: #0866ff;
    color: #ffffff;
    display: flex;
    font-weight: bold;
    padding: 8px;
    width: fit-content;
}

.facebook:hover
{
    text-decoration: none;
}

@media (max-width: 991px)
{
    .inline__image
    {
        height: auto;
        margin: 16px 0px;
        width: 100%;
    }
}

@media (min-width: 992px)
{
    .inline__image
    {
        float: right;
        height: auto;
        margin: 0px 0px 16px 16px;
        width: 400px;
    }
}

/* Tegels */

.tegels
{
    margin-bottom: 30px;
}

.tegels, .tegels2

{

	padding: 0px;

}

.tegels
{
    border-bottom: 1px solid #0f555e;
    padding-bottom: 30px;
}



.tegels__tegel__wrapper

{
 border: 2px solid transparent;
 /*border-radius: 8px;*/
 color: #ffffff;
 display: block;
 padding: 2px;
 text-decoration: none;
}

a.tegels__tegel__wrapper:hover
{
    border: 2px solid #0f555e;
    text-decoration: none;
}

.tegels__tegel

{
 /*background-color: #0f555e;*/
 /*border-radius: 5px;*/
 display: flex;
 flex-direction: column;
 flex-wrap: nowrap;
 height: 100%;
 justify-content: space-between;
 padding: 0px;

}

.tegels__tegel__wrapper h3
{
    color: #ffffff;
    padding: 16px;
    padding-bottom: 0px;
}

.tegels__tegel__wrapper p
{
    color: #ffffff;
}

.tegels__tegel__wrapper img
{
    /*border-radius: 5px;*/
    object-fit: cover;
    height: auto;
    width: 100%;
}

.tegels__tegel__no-padding

{

 background-color: #b2dee8;

 height: 100%;

 padding: 0px;

}



#tegels__tegel__no-padding__logo

{

 background: url(/sites/default/files/Social-media-post---Sjabloon---no-logo.png) no-repeat center center;

 -webkit-background-size: 100% 100%;

 -moz-background-size: 100% 100%;

 -o-background-size: 100% 100%;

 background-size: 100% 100%;
 
 /*border-radius: 5px;*/

 height: 100%;
 
 overflow: hidden;

 padding: 16px;

}



#tegels__tegel__no-padding__speelplaats

{

 background: url(/sites/default/files/media/tegel-speelplaats.jpg) no-repeat center center;

 -webkit-background-size: cover;

 -moz-background-size: cover;

 -o-background-size: cover;

 background-size: cover;
 
 /*border-radius: 5px;*/

 height: 100%;

 /*min-height: 320px;*/
 
 overflow: hidden;

 padding: 32px;

}

#tegels__tegel__no-padding__school

{

 background: url(/sites/default/files/media/school.jpg) no-repeat center center;

 -webkit-background-size: cover;

 -moz-background-size: cover;

 -o-background-size: cover;

 background-size: cover;
 
 /*border-radius: 5px;*/

 height: 100%;

 /*min-height: 320px;*/
 
 overflow: hidden;

 padding: 32px;

}



@media (min-width: 768px)

{

 .tegels, .tegels2

 {

 	display: flex;

 	flex-wrap: wrap;
 	justify-content: center;

 }



 .tegels__tegel__wrapper

 {

 	margin: 6px;
 	/*padding: 6px;*/

 	width: 45%;

 }

 @media (min-width: 1024px)

 {

 	.tegels__tegel__wrapper

	{

	 width: 23%;

	}

	.tegels2 .tegels__tegel__wrapper
	{
		width: 33%;
	}

 }

}

@media (max-width:767px)
{
    .tegels__tegel__wrapper
    {
        margin-bottom: 16px;
    }
    
    .tegels .hide__on__mobile
    {
        display: none;
    }
}

@media (min-width: 768px)
{
    .tegels .hide__on__mobile
    {
        display: block;
    }
}


/*.tegels .Horeca .tegels__tegel
{
    background-color: #fdc204;
    color: #000000;
}

.tegels .Techniek .tegels__tegel
{
    background-color: #3693ff;
    color: #000000;
}

.tegels .Wetenschap .tegels__tegel
{
    background-color: #ff4f26;
    color: #000000;
}

.tegels .Horeca:hover
{
    border: 2px solid #fdc204;
}

.tegels .Techniek:hover
{
    border: 2px solid #3693ff;
}

.tegels .Wetenschap:hover
{
   border: 2px solid #ff4f26;
}

.tegels .Wetenschap__Techniek:hover
{
   border-left: 2px solid #ff4f26;
   border-top: 2px solid #ff4f26;
   border-right: 2px solid #3693ff;
   border-bottom: 2px solid #3693ff;
}*/

.view-evenementen-voeding-en-horeca .tegels__tegel
{
    background-color: #fdc204;
    color: #000000;
}

@media (min-width: 768px)
{
    .view-evenementen-voeding-en-horeca .view-content
    {
        display: flex;
        flex-wrap: wrap;
        margin: 0px auto;
        /*width: fit-content;*/
    }

    .view-evenementen-voeding-en-horeca .view-content .views-row
    {
        width: 33.333%;
    }

    .view-evenementen-voeding-en-horeca .field-content
    {
        display: block;
        margin: 6px;
    }

    .view-evenementen-voeding-en-horeca .tegels__tegel__wrapper
    {
        margin: 0px;
        width: 100%;
    }

    @media (max-width: 1200px)
    {
        .view-evenementen-voeding-en-horeca h3
        {
            font-size: 0.8em;
        }
    }
}

/* Instagram */

@media (max-width: 991px)
{
    #block-b5-vti-welkom h2
    {
        text-align: center;
    }
}

/* Beleidsvisie */

.beleidsvisie__pijler

{

 padding: 16px;

}

@media (max-width: 991px)

{

 .beleidsvisie__pijler

 {

 	align-items: flex-start;

	display: flex;

	margin: 16px 0px;

 }



 .beleidsvisie__pijler img

 {

 	width: 30%;

 }



 .beleidsvisie__pijler div

 {

	padding: 16px;
 }

}



@media (min-width: 992px)

{

 .beleidsvisie

 {

 	display: flex;

	justify-content: space-evenly;

 }



 .beleidsvisie__pijler

 {

 	text-align: center;

	width: 30%;

 }



 .beleidsvisie__pijler img

 {

 	display: block;
 	margin: 0px auto;
 	max-width: 300px;

	width: 100%;

 }



 .beleidsvisie__pijler div

 {

 	margin: 0px auto;
 	margin-top: 30px;

 }

}

/* Eenvoudige pagina */

.page-node-type-page .field--name-field-afbeelding img
{
    /*border-radius: 5px;*/
}

@media (max-width: 991px)
{
    .page-node-type-page .field--name-field-afbeelding
    {
        margin-bottom: 15px;
    }
    
    .page-node-type-page .field--name-field-afbeelding img
    {
        height: 350px;
        width: 100%;
        object-fit: cover;
    }
}

@media (max-width: 768px)
{
    .page-node-type-page .field--name-field-afbeelding img
    {
        height: 250px;
        width: 100%;
        object-fit: cover;
    }
}

@media (min-width: 992px)
{
    .page-node-type-page .field--name-field-afbeelding
    {
        float: right;
        margin-left: 15px;
    }
    
    .page-node-type-page .field--name-field-afbeelding img
    {
        height: auto;
        width: 325px;
    }
}

/* Nieuws */

.node--type-nieuws .field--name-field-image img
{
    /*border-radius: 5px;*/
}

.node--type-nieuws .field--name-field-datum
{
    margin-bottom: 30px;
}

.node--type-nieuws .field--name-field-datum .field__item
{
    font-size: 1.2em;
    font-style: italic;
}

.evenement__menu
{
    background-color: #0f555e;
    border: 1px solid #0f555e;
    border-collapse:separate;
    /*border-radius: 5px;*/
}

.evenement__menu td
{
    background-color: #ffffff;
    padding: 15px;
}

@media (max-width: 991px)
{
    .node--type-nieuws .field--name-field-image
    {
        margin-bottom: 15px;
    }
    
    .node--type-nieuws .field--name-field-image img
    {
        height: auto;
        width: 100%;
    }
}

@media (min-width: 992px)
{
    .node--type-nieuws .field--name-field-image
    {
        float: right;
        margin-bottom: 16px;
        margin-left: 16px;
    }
    
    .node--type-nieuws .field--name-field-image img
    {
        height: auto;
        width: 325px;
    }
}

.region-sidebar-first .view-blog .view-grouping-header
{
    font-size: 2em;
}

.region-sidebar-first .view-blog h3
{
    margin-top: 16px;
}

.region-sidebar-first .view-blog .views-row a
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    color: #ffffff;
    display: block;
    margin: 5px;
    padding: 5px;
    text-decoration: none;
}

.region-sidebar-first .view-blog .views-row a:hover
{
    background-color: #f2ecdd;
    color: #000000;
}

@media (max-width: 991px)
{
    .region-sidebar-first .view-blog .view-grouping-header, .region-sidebar-first .view-blog h3, .region-sidebar-first .view-blog .views-row a
    {
        text-align: center;
    }
}

/* Studierichting */

.uurrooster
{
    background-color: #0f555e;
    border: 1px solid #0f555e;
    border-collapse:separate;
    /*border-radius: 5px;*/
    margin-bottom: 16px;
    width: 100%;
}

.uurrooster tr:nth-child(odd)
{
    background-color: #ffffff;
    border: 0;
}

.uurrooster tr:nth-child(even)
{
    background-color: #f2ecdd;
    border: 0;
}

.Horeca tr:nth-child(even)
{
    background-color: #ffeabc;
    border: 0;
}

.Techniek tr:nth-child(even)
{
    background-color: #95c6ff;
    border: 0;
}

.Wetenschap tr:nth-child(even)
{
    background-color: #ff9678;
    border: 0;
}

.uurrooster thead tr:first-child
{
    background-color: #0f555e;
}

.uurrooster th
{
    text-align: right;
    vertical-align: bottom;
}

.uurrooster th .align__vertical
{
    color: #ffffff;
    /*transform: scale(-1, -1);
    writing-mode: vertical-lr;*/
    writing-mode: vertical-rl;
    -moz-transform: scale(-1, -1);
    -webkit-transform: scale(-1, -1);
    -o-transform: scale(-1, -1);
    -ms-transform: scale(-1, -1);
    transform: scale(-1, -1);
    text-orientation: mixed;
    white-space:nowrap;
}

.uurrooster th:first-child
{
    transform: scale(1, 1);
    writing-mode: horizontal-tb;
}

.uurrooster th, .uurrooster td
{
    padding: 10px;
}

.uurrooster td p
{
    margin: 0;
}

.field--name-field-onderwijssysteem, .field--name-field-graad, .field--name-field-studiejaar
{
    display: flex;
    float: right;
    margin-bottom: 30px;
    /*margin-top: 15px;*/
}

.field--name-field-onderwijssysteem .field__item, .field--name-field-graad, .field--name-field-studiejaar .field__item
{
    background-color: #0f555e;
    /*border-radius: 5px;*/
    color: #ffffff;
    margin-left: 5px;
    margin-right: 5px;
    padding: 5px;
    text-decoration: none;
}

.field--name-field-onderwijssysteem a, .field--name-field-graad a, .field--name-field-studiejaar a
{
    color: #ffffff;
    display: block;
    height: 100%;
    padding: 5px;
    text-decoration: none;
    width: 100%;
}

@media (max-width: 991px)
{
    .uurrooster
    {
        margin-top: 16px;
        width: 50%;
    }
    
    .field--name-field-onderwijssysteem, .field--name-field-graad, .field--name-field-studiejaar
    {
        display: none;
    }
}

@media (max-width: 768px)
{
    .uurrooster
    {
        width: 100%;
    }
}



@media (min-width: 992px)
{
    .node--type-studierichting .field--name-field-afbeelding
    {
        width: 100%;
    }
    
    .node--type-studierichting .node__content
    {
        /*display: flex;*/
    }
    
    .node--type-studierichting .node__content .field--name-body
    {
        float: left;
        overflow: hidden;
        width: 55%;
    }
    
    .node--type-studierichting .node__content .field--name-body h2, .node--type-studierichting .node__content .field--name-body h3, .node--type-studierichting .node__content .field--name-body h4, .node--type-studierichting .node__content .field--name-body p
    {
        width: 100%;
    }
    
    .node--type-studierichting .node__content .field--name-field-uurrooster
    {
        margin-left: 15px;
        /*min-width: 350px;*/
        float: right;
        width: 40%;
    }
}

/* Vacatures */

.view-vacatures .views-row .vacature__overzicht a
{
    border: 2px solid transparent;
    /*border-radius: 5px;*/
    display: block;
    margin: 15px 0;
    padding: 2px;
    text-decoration: none;
}

.view-vacatures .views-row .vacature__overzicht a:hover
{
    border: 2px solid #0f555e;
}

.view-vacatures .views-row .vacature__overzicht a .vacature
{
    align-items: center;
    /*border-radius: 5px;*/
    display: flex;
    text-decoration: none;
}

.view-vacatures .views-row .vacature__overzicht a .vacature__afbeelding
{
    flex-shrink: 0;
    width: 100px;
}

.view-vacatures .views-row .vacature__overzicht a img
{
    /*border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;*/
}

.view-vacatures .views-row .vacature__overzicht a h2
{
    margin-left: 15px;
}

@media (max-width: 991px)
{
    .view-vacatures .views-row .vacature__overzicht a h2
    {
        font-size: 0.8em;
    }
}

.node--type-vacature .field--name-field-afbeelding img
{
    /*border-radius: 5px;*/
}

@media (max-width: 991px)
{
    .node--type-vacature .field--name-field-afbeelding
    {
        margin-bottom: 15px;
    }
}

@media (min-width: 992px)
{
    .node--type-vacature .field--name-field-afbeelding
    {
        float: right;
        margin-left: 15px;
    }
}

/* Contact */

.contact__adres, .contact__telefoon, .contact__email

{

 align-items: flex-start;

 display: flex;

 margin: 16px 0px;

}



.contact__logo

{

 width: 20%;

}



.contact__content

{

 margin-left: 16px;

 width: 80%;

}



.contact__logo img

{

 height: auto;

 width: 100%;

}

.locatie__kaart iframe

 {

 	border: 2px solid #0f555e;
 	/*border-radius: 5px;*/

	/*width: 40%;*/

 }


@media (min-width: 1024px)

{

 .contact-wrapper

 {



 }



 .contact__info

 {

 	align-items: flex-start;
 	display: flex;

	justify-content: space-evenly;

 }



 .contact__adres, .contact__telefoon, .contact__email

 {

 	width: 33%;

 }



 .locatie

 {

 	display: flex;

 }



 .locatie__beschrijving

 {

 	margin-right: 16px;

 }
 
 .locatie__kaart iframe
 {
     height: 400px;
     width: 600px;
 }

}

@media (max-width: 1023px)
{
    .locatie__kaart iframe
    {
        height: 300px;
        width: 100%;
    }
}

/* Printing rules */

@media print
{
    @page  
    { 
        size: auto;   /* auto is the initial value */ 
        /* this affects the margin in the printer settings */ 
        margin: 15mm 15mm;  
    } 

    body  
    { 
        /* this affects the margin on the content before sending to printer */ 
        margin: 0px;  
    } 
    
    .container
    {
        margin: 0 30px;
        width: auto;
        max-width: 100%;
    }
    
    header
    {
        position: static;
    }
    
    .navbar-toggler
    {
        display: none;
    }
    
    .uurrooster
    {
        border: none;
        /*page-break-before: always;*/
    }
    
    .uurrooster tr:nth-child(odd)
    {
        background-color: #ffffff;
        border: 0;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
    
    .uurrooster thead
    {
        background-color: #0f555e;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .uurrooster tr:nth-child(even)
    {
        background-color: #b2dee8;
        border: 0;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .uurrooster thead tr:first-child
    {
        background-color: #0f555e;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .uurrooster th .align__vertical
    {
        color: #ffffff;
        /*transform: scale(-1, -1);
        writing-mode: vertical-lr;*/
        writing-mode: vertical-rl;
        -moz-transform: scale(-1, -1);
        -webkit-transform: scale(-1, -1);
        -o-transform: scale(-1, -1);
        -ms-transform: scale(-1, -1);
        transform: scale(-1, -1);
        text-orientation: mixed;
        white-space:nowrap;
    }

    .uurrooster th:first-child
    {
        transform: scale(1, 1);
        writing-mode: horizontal-tb;
    }

    .uurrooster th, .uurrooster td
    {
        padding: 10px;
    }
    
    footer
    {
        display: none;
    }
}