.slide{
  position: relative;
  width: 100%;
  height: 0px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.5s;
  text-align: center;
}
.active-slide{
  opacity: 1;
  height: 200px;
  z-index: 2;
}
.test-container{
  position: relative;
  height: 280px;
  margin-top: 40px;
}

.slide > label {
  height: 100px;
}

.noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}


.linkbutton{background:#009b97;border:none;color:#fff;width:auto;cursor:pointer;text-transform:uppercase;display:inline-block;padding:15px 30px;font-size:1.1em;border-radius:5px;letter-spacing:1px;float:left;margin-right:40px;text-decoration: none;}
.linkbutton:hover{background:#007e7b; color: #fff; text-decoration: none;}

.startoverlay{background:url(images/startoverlay.png) no-repeat center center fixed;-webkit-background-size:100% 100%;-moz-background-size:100% 100%;-o-background-size:100% 100%;background-size:100% 100%;min-width:100%;min-height:100%;z-index:999999999;position:fixed;cursor:pointer}
.meerkeuze{display:table;width:100%;height:100px;border-spacing: 10px;}
.meerkeuze > label{padding:0 10px 5px 0;font-size:1em;font-weight:bolder;text-transform:none;letter-spacing:0;cursor:pointer;display:table-cell;width:25%;padding:10px!important;height:100%;margin-bottom:30px; background: rgb(63 103 102 / 65%);box-shadow: 0 4px 30px rgb(0 0 0 / 10%);backdrop-filter: blur(5.3px);-webkit-backdrop-filter: blur(11.3px);border-radius: 15px;}
.meerkeuze > label > input{margin-right:10px;height:auto;width:20px;visibility:hidden;display:none}
.talentimg {height: 25vh;}

@media (max-width: 480px) {
  .meerkeuze > label{width: 80vw; margin: 8px; display: inline-block;}
  .questioncontainer {height: 600px !important;}
}
@media (min-width: 480px and max-width: 768px) {
  .meerkeuze > label{width: 40vw; margin: 10px; display: inline-table;}
  .questioncontainer {height: 400px !important;}
}

.tooltip-inner {
    max-width: 550px;
    /* If max-width does not work, try using width instead */
    width: 450px; 
}

.talentgroep {
	background: #009b97;
    border: none;
    color: #fff;
    width: 90%;
    cursor: pointer;
    display: inline-block;
    padding: 15px 15px;
    font-size: 1.1em;
    border-radius: 10px;
    letter-spacing: 1px;
    float: left;
    text-align: center;
    margin-top: 10px;
    min-width: 160px;
}

.talent1 {
	background: rgb(0 155 151 / 41%);
}

.talent2 {
	background: rgb(82 207 21 / 41%);
}

.talent3 {
	background: rgb(207 207 21 / 41%);
}

.talent4 {
	background: rgb(207 64 21 / 41%);
}

.talent5 {
	background: rgb(207 21 132 / 41%);
}

.talent6 {
	background: rgb(21 42 207 / 41%);
}

.modal-header {
	border-bottom: none !important;
} 

.modal-body {
	padding: 0px !important;
}

.modal-content {
	border-radius: 15px !important;
}

.aanbeveling {
	color: #4af217;
}
.valkuil {
	color: #f2bc17;
}
.groep {
	color: pink;
}