.inhoud3planeten-grid {
  display: grid;
  grid-template-columns: 4fr 2fr 6fr;
  gap: 20px;
  padding: 20px;
}

/* Slideshow container */
.slideshow-container {
    position: relative;
}
  
/* Slides */
.mySlides {
  display: none;
  padding: 0px;
}
  
/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -30px;
  padding: 16px;
  color: #888;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
}
  
/* Position the "next button" to the right */
.next {
  position: absolute;
  right: 0;
  border-radius: 3px 0 0 3px;
}
  
/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
  color: white;
}
  
.dot-container {
  position: relative;
  text-align: center;
  z-index: 5;
}
  
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
  
/* Add a background color to the active dot/circle */
.active, .dot:hover {
  background-color: #717171;
}

.label-container{
  display: flex;
  flex-direction: column;
}

.label {
  pointer-events: auto;
  cursor: pointer;
  border: none;
  padding: 0.5rem;
  margin: 5px;
  font-family: inherit;
  font-size: inherit;
  position: relative;
  display: inline-block;    
}

.label::before,
.label::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.button--anthe {
	font-family: bely-display, sans-serif;
	color: #fff;
	background: none;
}

.button--anthe::before {
	content: '';
	background: #1D3966;
	-webkit-clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
	transition: clip-path 0.4s cubic-bezier(0.2, 1, 0.8, 1), -webkit-clip-path 0.4s cubic-bezier(0.2, 1, 0.8, 1);
}

.button--anthe:hover::before {
	background: #1D3966;
	-webkit-clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
}

.button--anthe span {
	display: block;
	mix-blend-mode: difference;
	transition: transform 0.4s cubic-bezier(0.2, 1, 0.8, 1);
}

.button--anthe:hover span {
	transform: translate3d(-10px,0,0);
}

a:focus,
button:focus {
	/* Provide a fallback style for browsers
	 that don't support :focus-visible */
	outline: none;
}

a:focus-visible,
button:focus-visible {
	/* Draw a very noticeable focus style for
	 keyboard-focus on browsers that do support
	 :focus-visible */
	outline: 2px solid #443ffc;
	outline-offset: 3px;
}

a:focus-visible {
	background: none;
}

.mySlides ol {
  list-style: circle;
}

/* Style the button that is used to open and close the collapsible content */
.collapsible {
  background-color: #0A224A;
  color: #E2B86D;
  cursor: pointer;
  padding: 12px;
  width: 100%;
  border: none;
  outline: none;
  font-size: 15px;
}

.collapsible:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: white;
  float: right;
  margin-left: 5px;
}

.active_coll {
  height: 100%;
}

.active_coll:after {
  content: "\2796"; /* Unicode character for "minus" sign (-) */
}

/* Style the collapsible content. Note: hidden by default */
.content {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

table {
  width: 100%;

}
th, td {
  border-bottom: 1px solid;
  border-color: #BBA33F;
  border-collapse: collapse;
  text-align: left;
  padding: 4px 8px;
}
/*# sourceMappingURL=C:/Data/WEBSERVER/Astro/app/public/maps/indeling_planeten.css.map */