body {
  margin: 0;
  -webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace"
  }
  
/*Everything goes inside here.*/


.wrapper {
  width: 900px;
  margin: 0 auto;
  }
  
.spoiler-body {
  display: none;
}
  
.sidebar-img, .footer, .title, .links, .box {
  margin-top: 25px;
  }
  
.title, .links, .footer {
  text-align: center;
  }
  
/*Navigation links.*/

a:link{
	color:#245b40;
}

a:visited{
	color:#245b40;
}

a:hover{
	background-color:#245b40;
	color:#245b40;
}

.links li:hover {
	background-color: #170EFB;
	color: white;
}
.links ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
	color: #245b40;
  }
  
.links li {
  display: inline-block;
	color: #170EFB;
  }

/*Some fancy code for fun, to add special characters around the navigation links. Change content to "" if you don't want these.*/
.links li:before {
  content: ".";
  }
  
.links li:after {
  content: ".";
  }
  
.links .last:after {
  content: ".";
  }
  
.links li:before, .links li:after {
  letter-spacing: 0.1em;
  }
  
/*Basic box code that is used for all content boxes on the page.*/
.box {
  border: 1px solid black;
  padding: 0.5em 1em;
  }

.footerbox {
  border: 1px solid black;
  padding: 0.5em 1em;
  }
.titlebox {
  border: 1px solid black;
  padding: 0.5em 1em;
font-family: Cooper;
  }

.titlebox:hover {
  background-color: #a74131;
  color: white;
  }
.footer {
	font-size: 70%;
}
.footerbox:hover{
	background-color: rgb(246, 245, 65);
}  
.box:hover {
  background-color: #a74131;
	color: white;
}

/*Prevent image overflow.*/
.box img, .sidebar img {
  max-width: 100%;
  height: auto;
  }
.box video, .sidebar video {
  max-width: 100%;
  height: auto;
  }
  
/*Wrapper for the sidebar.*/

  
/*Remove extra padding line at the bottom of the image.*/
.sidebar-image img {
  display: block;
  }
  
/*This is where the title, navbar, and main content all go.*/
.main-wrapper {
  }
  
/*Two columns by default. The "single-column" class can be added to make it one column.*/
.main {
  columns: 1;
  column-gap: 25px;
  }
  
/*Make sure boxes don't spread over multiple columns.*/
.main .box {
  display: inline-block;
  }
  
.single-column {
  columns: 1;
  }
  
.footer {
  margin-bottom: 25px;
  }
  
@media(max-width:915px) {
  .wrapper {    
    width: 95%;
    }
    
  .main-wrapper {
    width: calc(100% - 225px);
    }
  }
  
@media (orientation: portrait), (max-width: 480px) {
  .wrapper {
    width: 100%;
    }
  
  .main-wrapper, .sidebar, .footer {
    margin: 0 auto;
    width: 90%;
    }
  
  .sidebar {
    float: none;
    display: block;
    }

  .sidebar-image {
    margin: 0 auto;
    width: 66%;
    margin-top:25px;
    }

  .sidebar .sidebar-image img {
    width: 100%;
    }
    
  .footer {
    margin-bottom: 25px;
    }
  
  }
.show {
  display: block;
}

.hide {
  display: none;
}
.spoiler {
    display:none;
}

.agenda {
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 20px;
	 margin-top: 20px;

    }
.locatie {
	text-align: right;
}

.word {
            display: inline-block;
        }

        .letter {
            display: inline-block;
            position: relative;
            animation: auto-bounce 5s ease infinite;
        }

        .letter:nth-child(1) { animation-delay: 0s; }
        .letter:nth-child(2) { animation-delay: 0.08s; }
        .letter:nth-child(3) { animation-delay: 0.16s; }
        .letter:nth-child(4) { animation-delay: 0.24s; }
        .letter:nth-child(5) { animation-delay: 0.32s; }
        .letter:nth-child(6) { animation-delay: 0.40s; }
        .letter:nth-child(7) { animation-delay: 0.48s; }
        .letter:nth-child(8) { animation-delay: 0.56s; }
        .letter:nth-child(9) { animation-delay: 0.64s; }
        .letter:nth-child(10) { animation-delay: 0.72s; }
        .letter:nth-child(11) { animation-delay: 0.80s; }
        .letter:nth-child(12) { animation-delay: 0.88s; }
        .letter:nth-child(13) { animation-delay: 0.96s; }
        .letter:nth-child(14) { animation-delay: 1.04s; }
        .letter:nth-child(15) { animation-delay: 1.12s; }

        @keyframes auto-bounce {
            0%, 10%, 100% {
                transform: translateY(0);
            }
            3% {
                transform: translateY(-8px);
            }
            5% {
                transform: translateY(-4px);
            }
            7% {
                transform: translateY(-2px);
            }
}
/* Mobile */
    @media (max-width: 900px) {
      .agenda {
        grid-template-columns: 100%;
        gap: 5px;
      }
      
      .locatie {
        margin-bottom: 20px;
		text-align: right !important;
      }

}
img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}