#chck1,
#chck2,
#chck3,
#chck4,
#chck5,
#chck6,
#chck7,
#chck8,
#chck9,
#chck10 {
  position: absolute;
  opacity: 0;
  z-index: -1;
}


/* Accordion styles */

.tabsx,
.tabsx2,
.tabsx3,
.tabsx4,
.tabsx5,
.tabsx6,
.tabsx7,
.tabsx8,
.tabsx9,
.tabsx10 {
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.tabx,
.tabx2,
.tabx3,
.tabx4,
.tabx5,
.tabx6,
.tabx7,
.tabx8,
.tabx9,
.tabx10 {
  width: 100%;
  color: white;
  overflow: hidden;
}

.tab-labelx,
.tab-labelx2,
.tab-labelx3,
.tab-labelx4,
.tab-labelx5,
.tab-labelx6,
.tab-labelx7,
.tab-labelx8,
.tab-labelx9,
.tab-labelx10 {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  padding: 1em;
  background: #2c3e50;
  font-weight: bold;
  cursor: pointer;
}

.tab-labelx:hover,
.tab-labelx2:hover,
.tab-labelx3:hover,
.tab-labelx4:hover,
.tab-labelx5:hover,
.tab-labelx6:hover,
.tab-labelx7:hover,
.tab-labelx8:hover,
.tab-labelx9:hover,
.tab-labelx10:hover {
  background: #1a252f;
}

.tab-labelx::after,
.tab-labelx2::after,
.tab-labelx3::after,
.tab-labelx4::after,
.tab-labelx5::after,
.tab-labelx6::after,
.tab-labelx7::after,
.tab-labelx8::after,
.tab-labelx9::after,
.tab-labelx10::after {
  content: "\276F";
  width: 1em;
  height: 1em;
  text-align: center;
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.tab-content,
.tab-content2,
.tab-content3,
.tab-content4,
.tab-content5,
.tab-content6,
.tab-content7,
.tab-content8,
.tab-content9,
.tab-content10 {
  max-height: 0;
  padding: 0 1em;
  color: #2c3e50;
  background: white;
  -webkit-transition: all .5s;
  transition: all .5s;
}

.tab-close {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  padding: 1em;
  font-size: 0.75em;
  background: #2c3e50;
  cursor: pointer;
}

.tab-close:hover {
  background: #1a252f;
}

#chck1:checked+.tab-labelx,
#chck2:checked+.tab-labelx2,
#chck3:checked+.tab-labelx3,
#chck4:checked+.tab-labelx4,
#chck5:checked+.tab-labelx5,
#chck6:checked+.tab-labelx6,
#chck7:checked+.tab-labelx7,
#chck8:checked+.tab-labelx8,
#chck9:checked+.tab-labelx9,
#chck10:checked+.tab-labelx10 {
  background: #1a252f;
}

#chck1:checked+.tab-labelx::after,
#chck2:checked+.tab-labelx2::after,
#chck3:checked+.tab-labelx3::after,
#chck4:checked+.tab-labelx4::after,
#chck5:checked+.tab-labelx5::after,
#chck6:checked+.tab-labelx6::after,
#chck7:checked+.tab-labelx7::after,
#chck8:checked+.tab-labelx8::after,
#chck9:checked+.tab-labelx9::after,
#chck10:checked+.tab-labelx10::after {
  margin-right: .5em;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

#chck1:checked~.tab-content,
#chck2:checked~.tab-content2,
#chck3:checked~.tab-content3,
#chck4:checked~.tab-content4,
#chck5:checked~.tab-content5,
#chck6:checked~.tab-content6,
#chck7:checked~.tab-content7,
#chck8:checked~.tab-content8,
#chck9:checked~.tab-content9,
#chck10:checked~.tab-content10 {
  max-height: 100vh;
  padding: 1em;
}