body{
  background: black;
  background-image: url("JcArena-01.png");
  background-size: cover;

}

.WPDP{
  width: 177px;
  height: 169px;
  top: 68%;
  left: 15%;
  position: absolute;
  transform: translate(-50%,-50%);
}

.titel{
  width: 1112px;
  height: 98px;
  
  position: absolute;
  left: 50%;
  top: 20%;
  
  transform: translate(-50%,50%);
}

.logo{
  width: 144px;
  height: 83px;
  position: absolute;
  left: 85%;
  top: 58%;
  transform: translate(-50%,-50%);
}

.mdb{
  width: 144px;
  height: 83px;
  position: absolute;
  left: 85%;
  top: 78%;
  transform: translate(-50%,-50%);
}

.tile{
  width: 180px;
  height: 150px;
  margin: 10px;
  
  float: left;
  place-items: center;
  text-align: center;
  cursor: pointer;
  border-radius: 10px;
  box-shadow: 0 5px 10px rgba(255, 255, 255, 0.5);
}

#main-container{
  max-width: 640px;
  max-height: 300px;
  margin: 0 auto;
  position: absolute;
  top: 65%;
  left: 50%;
  transform: translate(-50%,-50%);
}

#main-container :hover{
  transform: scale(1.05);
}

.plaatje1{
  background: url("Blokken-03.png");
  background-size: cover;
  background-repeat: no-repeat;
}

.plaatje2{
  background: url("Blokken-04.png");
  background-size: cover;
  background-repeat: no-repeat;
}

.plaatje3{
  background: url("Blokken-05.png");
  background-size: cover;
  background-repeat: no-repeat;
}

.plaatje4{
  background: url("Blokken-06.png");
  background-size: cover;
  background-repeat: no-repeat;
}

.plaatje5{
  background: url("Blokken-07.png");
  background-size: cover;
  background-repeat: no-repeat;
}

.plaatje6{
  background: url("Blokken-08.png");
  background-size: cover;
  background-repeat: no-repeat;
}
