@import "bootstrap.min.css";
/**
 * Burger parts
 *
 * (---) top    -> &:before
 * [---] middle -> &
 * (---) bottom -> &:after
 */
/**
 * Burger
 */
body {
  margin: 0;
  padding: 0 0 40px 0;
  font-family: 'Questrial', Helvetica, Arial, sans-serif;
  font-size: 18px;
  line-height: 28px;
  overflow-y: scroll; }

.row a:hover {
  text-decoration: underline; }

#hero {
  position: relative;
  overflow: hidden;
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover; }

#hero-bg {
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0;
  background-image: url('https://cantabileplus.nl/images/202212/cantabileplus_2022_panorama_1.jpg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  -ms-transition-property: background-position;
  -ms-transition-duration: 0.15s;
  transition-property: background-position;
  transition-duration: 0.15s; }

.hero-content {
  position: absolute;
  right: 0;
  left: 0;
  top: 200px;
  padding: 1em;
  margin: auto;
  width: 500px;
  text-align: center;
  background: rgba(0, 0, 0, 0.25);
  color: white; }

#hero, #hero_bg {
  height: 400px; }

@media screen and (min-width: 1000px) {
  #hero, #hero_bg {
    height: 450px; } }

@media screen and (min-width: 1100px) {
  #hero, #hero-bg {
    height: 500px; } }

@media screen and (min-width: 1250px) {
  #hero, #hero-bg {
    height: 550px; } }

@media screen and (min-width: 1450px) {
  #hero, #hero-bg {
    height: 650px; } }

@media screen and (min-width: 1550px) {
  #hero, #hero-bg {
    height: 700px; } }

@media screen and (min-width: 1700px) {
  #hero, #hero-bg {
    height: 750px; } }

.burger-button {
  position: fixed;
  z-index: 1001;
  display: inline-block;
  padding: 22px 18px;
  background-color: #b7084a;
  border: 0px solid #fff;
  top: 20px;
  left: 20px;
  cursor: pointer; }
  .burger-button .burger-icon {
    position: relative;
    margin-top: 5px;
    margin-bottom: 5px;
    /**
 * Select parts of the burger
 */ }
    .burger-button .burger-icon, .burger-button .burger-icon:before, .burger-button .burger-icon:after {
      display: block;
      width: 20px;
      height: 2px;
      background-color: #fff;
      -webkit-transition-property: background-color, -webkit-transform;
      -moz-transition-property: background-color, -moz-transform;
      -o-transition-property: background-color, -o-transform;
      transition-property: background-color, transform;
      -webkit-transition-duration: 0.3s;
      -moz-transition-duration: 0.3s;
      -o-transition-duration: 0.3s;
      transition-duration: 0.3s; }
    .burger-button .burger-icon:before, .burger-button .burger-icon:after {
      position: absolute;
      content: ""; }
    .burger-button .burger-icon:before {
      top: -5px; }
    .burger-button .burger-icon:after {
      top: 5px; }
  .burger-button.is-active .burger-icon {
    background-color: transparent; }
    .burger-button.is-active .burger-icon:before {
      -webkit-transform: translateY(5px) rotate(45deg);
      -moz-transform: translateY(5px) rotate(45deg);
      -ms-transform: translateY(5px) rotate(45deg);
      -o-transform: translateY(5px) rotate(45deg);
      transform: translateY(5px) rotate(45deg); }
    .burger-button.is-active .burger-icon:after {
      -webkit-transform: translateY(-5px) rotate(-45deg);
      -moz-transform: translateY(-5px) rotate(-45deg);
      -ms-transform: translateY(-5px) rotate(-45deg);
      -o-transform: translateY(-5px) rotate(-45deg);
      transform: translateY(-5px) rotate(-45deg); }
  .burger-button:hover {
    background: #e20026; }

@media (min-width: 768px) {
  .burger-button {
    top: 55px;
    left: 25px; } }

@media (min-width: 1024px) {
  .burger-button {
    top: 55px;
    left: 55px; } }

#menu-wrapper {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.8);
  opacity: 1;
  transition-property: opacity;
  transition-duration: 0.3s; }
  #menu-wrapper.menuhidden {
    opacity: 0;
    pointer-events: none; }
  #menu-wrapper .logo {
    position: absolute;
    left: 92px;
    top: 20px;
    width: 207px; }
    #menu-wrapper .logo img {
      width: 100%; }

@media (min-width: 768px) {
  #menu-wrapper {
    height: 167px; }
    #menu-wrapper.has-submenu {
      height: 207px; }
    #menu-wrapper .logo {
      left: 110px;
      top: 42px;
      width: 257px; } }

@media (min-width: 1024px) {
  #menu-wrapper .logo {
    left: 165px;
    top: 24px;
    width: 324px; } }

#menu-wrapper .top-menu {
  padding: 96px 20px 0 20px; }
  #menu-wrapper .top-menu ul {
    margin: 0;
    padding: 0; }
  #menu-wrapper .top-menu li {
    background: #a10d59;
    list-style: none; }
    #menu-wrapper .top-menu li.selected {
      background: #e20026; }
    #menu-wrapper .top-menu li a {
      text-decoration: none;
      display: block;
      color: white;
      line-height: 40px;
      padding-left: 30px; }
      #menu-wrapper .top-menu li a:hover {
        background: #b7084a; }
  #menu-wrapper .sub-menu {
    margin: 0 20px; }
  #menu-wrapper .sub-menu ul {
    margin: 0;
    padding: 0 0 20px 0; }
    #menu-wrapper .sub-menu ul:after {
      clear: both;
      content: '';
      display: block; }
  #menu-wrapper .sub-menu li {
    background: #a10d59;
    list-style: none; }
    #menu-wrapper .sub-menu li.selected {
      background: #e20026; }
    #menu-wrapper .sub-menu li a {
      text-decoration: none;
      display: block;
      color: white;
      line-height: 40px;
      padding-left: 40px; }
      #menu-wrapper .sub-menu li a:hover {
        background: #b7084a; }
    #menu-wrapper .sub-menu li.logout {
      display: none; }
  #menu-wrapper .sub-menu form ul:after {
    content: '';
    clear: both;
    display: block; }
    #menu-wrapper .sub-menu form ul li {
      background: #e20026;
      padding: 0px 20px; }
      #menu-wrapper .sub-menu form ul li input {
        width: 100%;
        border: none;
        padding-left: 12px;
        outline: none;
        height: 40px; }
      #menu-wrapper .sub-menu form ul li button {
        border: none;
        height: 40px;
        width: 100%;
        background: #a10d59;
        color: white; }
        #menu-wrapper .sub-menu form ul li button:hover {
          background: #b7084a; }
      #menu-wrapper .sub-menu form ul li:last-child {
        padding-bottom: 20px; }

@media (min-width: 768px) {
  #menu-wrapper li.button {
    list-style: none;
    float: left;
    display: block;
    margin: 0;
    background: #a10d59; }
    #menu-wrapper li.button + li.button {
      margin-left: 20px; }
    #menu-wrapper li.button a, #menu-wrapper li.button a:visited {
      padding: 0 15px;
      font-size: 16px;
      min-width: 110px;
      text-align: center;
      height: 56px;
      line-height: 56px; }
    #menu-wrapper nav.top-menu, #menu-wrapper nav.sub-menu {
      position: absolute;
      right: 25px;
      padding: 0;
      margin: 0; }
    #menu-wrapper nav.top-menu ul, #menu-wrapper nav.sub-menu ul {
      padding: 0;
      margin: 0; }
    #menu-wrapper .top-menu {
      top: 55px; }
    #menu-wrapper .sub-menu {
      top: 131px; }
    #menu-wrapper .sub-menu form ul li {
      list-style: none;
      float: left;
      display: block;
      margin: 0;
      background: transparent; }
      #menu-wrapper .sub-menu form ul li input, #menu-wrapper .sub-menu form ul li button {
        display: block;
        font-size: 16px;
        height: 56px;
        line-height: 56px;
        padding: 0 15px;
        min-width: 110px;
        margin: 0; }
      #menu-wrapper .sub-menu form ul li input {
        width: 240px; }
      #menu-wrapper .sub-menu form ul li:last-child {
        padding: 0; }
    #menu-wrapper .sub-menu ul li.logout {
      display: block !important; }
      #menu-wrapper .sub-menu ul li.logout div a {
        width: 56px;
        height: 56px;
        min-width: 0;
        padding: 0;
        background: url(/assets/pics/logout.png) no-repeat; } }

@media (min-width: 1024px) {
  /*
#menu-wrapper 
{
	position: fixed; 
	top:0px; 
	left:0px; 
	right:0px; 
	z-index:1000; 
	background-color: rgba(0,0,0,0.8);
	height: 167px;
	
	opacity: 1;
	transition-property: opacity;
	transition-duration: 0.3s;
	
	&.has-submenu
	{
		height: 207px;
	}

	li.button 
	{
		list-style:none; 
		float:left; 
		display:inline-block; 
		margin:0 10px;
		background: rgba(161,13,89,1); 
		text-align: center;

		&.selected { background: #E20026; }

		a, a:visited, button
		{
			display: block; 
			padding: 14px 15px 14px 15px;
			text-decoration: none;
			color: white;
			font-size: 16px;
			min-width: 110px;			
			border: none;
			background: none;
			text-align: center;
		}
		a:hover
		{
			font-weight: normal;
		}
	}
	
	li.input-field
	{
		list-style:none; 
		float:left; 
		display:inline-block; 
		margin:0 10px;
//		background: rgba(161,13,89,1); 
		background: white;
				
		input[type=password]
		{
			display: block;
			padding: 14px 20px 14px 20px;
			font-size: 16px;
			line-height: 28px;
			height: 28px;
			
			border: none;
			background: none;
			width: 400px;
			color: black;

			
			outline: none;
		}
	}
	
	.menu-items-wrapper
	{
		float: right;
		margin: 55px 5% 0 0;
	}
	.submenu-items-wrapper 
	{
		float: right;
		margin: 20px 5% 0 0;
	}
}

@media (min-width: 768px) 
{
	#menu-wrapper .logo img 
	{
		height: 65px; 
		display: inline-block;
		float: left; 
		margin: 46px 0 0 130px;
	}
}
@media (min-width: 992px) 
{
	#menu-wrapper .logo img 
	{
		height: 85px;
		margin: 26px 0 0 160px;
	}
}
@media (min-width: 1200px) 
{
	#menu-wrapper 
	{
		.logo img 
		{
			height: 100px;
			margin:11px 0 0 217px;
		}
		.menu-items-wrapper { margin:55px 217px 0 0; }
		.submenu-items-wrapper { margin:20px 217px 0 0; }
	}
}*/
    #menu-wrapper nav.top-menu, #menu-wrapper nav.sub-menu {
      right: 55px; } }

.img-responsive {
  width: 100%; }

a {
  color: white;
  text-decoration: underline; }
  a.leesmeer {
    text-align: center;
    display: block;
    text-decoration: none;
    color: white;
    font-size: 120%;
    margin-top: 20px; }

.container-fluid {
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0px; }

.row {
  margin-left: 0;
  margin-right: 0; }

.row.no-gutter {
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 55px; }
  .row.no-gutter [class*='col-'] {
    padding: 0;
    color: white; }
  .row.no-gutter:nth-child(2n+0) [class*='col-'] {
    background: #e20026; }
  .row.no-gutter:nth-child(2n+0) [class*='col-']:not(:first-child) {
    padding: 30px; }
  .row.no-gutter:nth-child(2n+1) [class*='col-'] {
    background: #a10d59; }
  .row.no-gutter:nth-child(2n+1) [class*='col-']:not(:last-child) {
    padding: 30px; }

@media (min-width: 768px) {
  .container-fluid {
    margin-right: auto;
    margin-left: auto; }

  .row.no-gutter {
    margin-left: 5%;
    margin-right: 5%; } }

@media (min-width: 1300px) {
  .row.no-gutter {
    margin-left: 150px;
    margin-right: 150px; } }

.col-top {
  vertical-align: top; }

.col-middle {
  vertical-align: middle; }

.col-bottom {
  vertical-align: bottom; }

.row-full-height {
  height: 100%; }

.col-full-height {
  height: 100%;
  vertical-align: middle; }

.row-same-height {
  display: table;
  width: 100%;
  table-layout: fixed; }

.col-xs-height {
  display: table-cell;
  float: none !important; }

@media (min-width: 768px) {
  .col-sm-height {
    display: table-cell;
    float: none !important; } }

@media (min-width: 992px) {
  .col-md-height {
    display: table-cell;
    float: none !important; } }

@media (min-width: 1200px) {
  .col-lg-height {
    display: table-cell;
    float: none !important; } }

h1 {
  margin: 0px 0px 20px 0px;
  font-size: 34px;
  line-height: 34px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px; }

[class*="col-"] {
  padding-top: 10px;
  padding-bottom: 15px;
  border: 0px solid #80aa00;
  background: #d6ec94; }

.col-full-height:before {
  content: ""; }

.item {
  width: 100%;
  height: 100%;
  border: 1px solid #cecece;
  padding: 12px 6px;
  background: #ededed;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4f4f4), color-stop(100%, #ededed));
  background: -moz-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
  background: -ms-linear-gradient(top, #f4f4f4 0%, #ededed 100%); }

.item {
  display: table; }

.content {
  display: table-cell;
  vertical-align: middle;
  text-align: center; }

.article-parallax img {
  width: 100%; }

.detailpage {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-delay: 0.1s;
  margin: 55px auto; }
  .detailpage h1 {
    text-align: center;
    font-weight: bold; }
  .detailpage a {
    color: #a10d59;
    text-decoration: none; }
  .detailpage a:hover {
    text-decoration: underline; }
  .detailpage table {
    width: 120%;
    box-sizing: content-box;
    margin-left: -50px;
    margin-right: -50px; }
  .detailpage table tr:nth-child(odd) {
    background: rgba(0, 0, 0, 0.2); }
  .detailpage table tr:nth-child(even) {
    background: rgba(0, 0, 0, 0.1); }
  .detailpage table tr:nth-child(1) {
    background: rgba(0, 0, 0, 0.3); }
    .detailpage table tr:nth-child(1) td {
      padding-top: 20px; }
  .detailpage table td {
    line-height: 34px;
    padding: 0 5px; }
    .detailpage table td:first-child {
      text-align: right;
      padding-right: 20px;
      padding-left: 10px; }
    .detailpage table td:last-child {
      padding-right: 20px; }
  .detailpage table p {
    margin: 0; }
  .detailpage table em {
    font-style: normal; }
  .detailpage article > div {
    margin: 0 auto;
    width: 50%;
    text-align: justify;
    border: 0px solid red;
    font-size: 80%; }
  .detailpage article > div h1 {
    text-transform: uppercase; }

.internal_link {
  color: #000 !important;
  font-weight: bold;
  text-align: center;
  display: block;
  font-size: 140%;
  text-decoration: none;
  margin: 55px 0; }

.contactpage {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-delay: 0.1s; }
  .contactpage h1 {
    text-align: left; }

.has-menu .contactpage {
  margin-top: 222px; }

.contact-container {
  padding: 30px;
  margin-top: 54px; }
  .contact-container form input, .contact-container form textarea, .contact-container form button {
    color: black;
    padding: 10px;
    width: 100%;
    display: block;
    margin-bottom: 8px;
    border: none; }
  .contact-container form input[type=text], .contact-container form input[type=email], .contact-container form textarea {
    background: #eee; }
  .contact-container form input[type=text]::-moz-placeholder, .contact-container form input[type=email]::-moz-placeholder, .contact-container form textarea::-moz-placeholder {
    color: #333; }
  .contact-container form textarea {
    resize: none;
    height: 250px; }
  .contact-container form button {
    background: #a10d59;
    color: white; }
  .contact-container form input[type=text]#level {
    position: absolute;
    z-index: -9;
    width: 100px; }

.ledenpage {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-delay: 0.1s; }
  .ledenpage h1 {
    text-align: left; }
  .ledenpage table {
    width: 100%; }
  .ledenpage table tbody tr:nth-child(2n) {
    background: #a10d59 none repeat scroll 0 0; }
  .ledenpage table td {
    line-height: 34px;
    padding: 0 5px; }
  .ledenpage table p {
    margin: 0; }
  .ledenpage article {
    margin: 30px; }

.has-menu .ledenpage {
  margin-top: 262px; }

.tablepage {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-delay: 0.1s; }
  .tablepage h1 {
    text-align: left; }
  .tablepage > div > div {
    background: #b11d69 !important; }
  .tablepage table {
    width: 100%; }
  .tablepage table tbody tr:nth-child(odd) {
    background: rgba(0, 0, 0, 0.2); }
    .tablepage table tbody tr:nth-child(even) {
      background: rgba(0, 0, 0, 0.1); }
    .tablepage table tbody tr:nth-child(1) {
      background: rgba(0, 0, 0, 0.3); }
      .tablepage table tbody tr:nth-child(1) td {
        padding-top: 20px; }
      .tablepage table tbody tr:nth-child(1) em {
        font-style: normal;
        font-weight: normal;
        text-transform: uppercase; }
    .tablepage table tbody td {
      line-height: 34px;
      padding: 0 5px; }
    .tablepage table tbody p {
      margin: 0; }
    .tablepage table tbody a {
      text-decoration: none; }
      .tablepage table tbody a:hover {
        color: white; }
  .tablepage article {
    margin: 30px;
    padding-top: 30px; }
  .tablepage article > h1 {
    display: block; }

.has-menu .tablepage {
  margin-top: 262px; }

.midipage {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-delay: 0.1s; }
  .midipage article {
    padding-bottom: 30px; }
  .midipage article h1 {
    text-align: left; }
  .midipage article section {
    padding: 15px 20px 10px; }
    .midipage article section:nth-child(even) {
      background: rgba(0, 0, 0, 0.2); }
    .midipage article section:nth-child(odd) {
      background: rgba(0, 0, 0, 0.1); }
  .midipage ul {
    padding: 0;
    display: block; }
  .midipage ul li {
    float: left;
    display: block;
    height: 45px; }
    .midipage ul li a {
      color: black;
      background: rgba(255, 255, 255, 0.9);
      text-decoration: none;
      padding: 10px 30px;
      margin-right: 10px; }
      .midipage ul li a:hover {
        color: rgba(255, 255, 255, 0.9);
        background: black; }
  .midipage table tbody tr:nth-child(2n) {
    background: #a10d59 none repeat scroll 0 0; }
  .midipage table td {
    line-height: 34px;
    padding: 0 5px; }
  .midipage table p {
    margin: 0; }
  .midipage article {
    margin: 30px;
    padding-top: 30px; }
  .midipage article > h1 {
    display: block; }

.has-menu .midipage {
  margin-top: 262px; }

.fancybox-nav {
  outline: none !important; }

.fotopage {
  transition-property: margin;
  transition-duration: 0.3s;
  transition-delay: 0.1s; }
  .fotopage article {
    margin: 30px;
    padding-top: 30px;
    padding-bottom: 30px; }
  .fotopage article > h1 {
    display: block;
    text-align: left; }
  .fotopage article section {
    /*			&:nth-child(even)
			{
				background: rgba(black, 0.2);
			}
			&:nth-child(odd)
			{
				background: rgba(black, 0.1);
			}*/
    padding: 15px 20px; }
  .fotopage h2 {
    padding: 20px 20px 5px;
    margin-bottom: 15px;
    background: rgba(0, 0, 0, 0.3); }
  .fotopage ul {
    padding: 0;
    display: block; }
  .fotopage ul li {
    float: left;
    display: block;
    margin-right: 10px;
    margin-bottom: 10px; }
    .fotopage ul li figure {
      display: block;
      height: 260px;
      width: 220px;
      background: rgba(0, 0, 0, 0.1);
      padding-top: 30px;
      /*			a
			{
				color: black;
				background: rgba(white, 0.9);
				text-decoration: none;
				padding: 10px 30px;
				margin-right: 10px;
				
				&:hover
				{
					color: rgba(white, 0.9);
					background: black;
				}
			}*/ }
      .fotopage ul li figure img {
        margin: 0 auto;
        display: block; }
      .fotopage ul li figure figcaption {
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 0 5px; }
  .fotopage .download {
    float: right;
    margin-right: 20px; }
  .fotopage .download a {
    text-decoration: none;
    display: block;
    color: white;
    adding: 0 15px;
    font-size: 16px;
    min-width: 110px;
    text-align: center;
    height: 56px;
    line-height: 56px;
    background: rgba(0, 0, 0, 0.3); }
    .fotopage .download a:hover {
      background: rgba(0, 0, 0, 0.6); }

.has-menu .fotopage {
  margin-top: 262px; }