#t-shirt{
  width: 90vw;
  margin: 0 5vw;
  height: 45vw;
  background: url("/img/t-shirt.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center top;
  overflow: hidden;
}

#t-shirt--back{
  width: 90vw;
  margin: 0 5vw;
  height: 45vw;
  background: url("/img/t-shirt--back.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center top;
  overflow: hidden;
}
.bmx-gen,
.bmx-gen2{
  max-width: 80vw;
  padding: 15vw 20vw;
  margin-left: 5vw;
}
@media (min-aspect-ratio: 8/7) {
  .bmx-gen{

  }
}


#comicWrapper{
}
.comic {
  display:flex;
  flex-wrap:wrap;
  padding:1vmin;
}

.panel {
  background-color:#fff;
  border:solid 2px #fff;
  box-shadow:0 6px 6px -6px #000;
  display:inline-block;
  flex:1 1;
  height:200px;
  margin:1vmin;
  overflow:hidden;
  position:relative;
  /*border-width: 2px 3px 2px 4px;
  border-radius:96% 3% 93% 4%/5% 96% 5% 96%;
  transform: rotate(1deg);*/
}

.text {
  background-color:#fff;
  color: #000;
  border:solid 2px #000;
  margin:0;
  padding:3px 10px;
}

.top-left {
  left:-6px;
  position:absolute;
  top:-2px;
  transform:skew(-15deg);
}

.bottom-right {
  bottom:-2px;
  position:absolute;
  right:-6px;
  transform:skew(-15deg);
}

.speech {
  background-color:#fff;
  color: #000;
  border:solid 2px #000;
  border-radius:12px;
  display:inline-block;
  margin:1em 0 0 6em;
  padding:.5em 1em;
  position:relative;
}

.speech:before {
  border:solid 12px transparent;
  border-left:solid 12px #000;
  border-top:solid 12px #000;
  bottom:-24px;
  content:"";
  height:0;
  left:12px;
  position:absolute;
  transform:skew(-15deg);
  width:0;
}

.speech:after {
  border:solid 10px transparent;
  border-left:solid 10px #fff;
  border-top:solid 10px #fff;
  bottom:-19px;
  content:"";
  height:0;
  left:15px;
  position:absolute;
  transform:skew(-15deg);
  width:0;
}

.panel:nth-child(1) {
  flex-basis: 400px;
}
.panel:nth-child(2) {
  flex-basis: 200px;
}
.panel:nth-child(3) {
  flex-basis: 200px;
}

/* background colours */

.panel:nth-child(4n+1) {
  background-image:radial-gradient(circle, yellow, orange);
}

.panel:nth-child(4n+2) {
  background-image:radial-gradient(circle, lightblue, deepskyblue);
}

.panel:nth-child(4n+3) {
  background-image: url("/img/v4p0r--corner.png"), radial-gradient(circle, palegreen, yellowgreen);
  background-size: contain, cover;
  background-repeat: no-repeat, no-repeat;
}

.panel:nth-child(4n+4) {
  background-image:radial-gradient(circle, lightcoral, tomato);
}