html {
  box-sizing: border-box;
  background: cadetblue;
}

body {
  margin: 0;
}

.markup {
  font-size: 20px;
  font-weight: 200;
}


.panels {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-content: flex-end;
  align-content: flex-end;
}

.panel {
  max-width: 300px;
  min-width: 200px;
  min-height: 500px;
  background:#6B0F9C;
  box-shadow:inset 0 0 0 5px rgba(255,255,255,0.1);
  color:white;
  text-align: center;
  align-items:center;
  background-size:cover;
  background-position:center;
  justify-content: center;
  display: flex;
  flex-direction: column;
}

/*
https://source.unsplash.com/random/1500x1500
*/
.panel1 {
   background-image:url(https://source.unsplash.com/gYl-UtwNg_I/1500x1500);
   opacity: 0.5;
 }
.panel2 { background-image:url(https://source.unsplash.com/1CD3fd8kHnE/1500x1500); opacity: 0.5;}

.panel3 { background-image:url(https://images.unsplash.com/photo-1481126952208-cc3a6eaf68b5?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1500&h=1500&fit=crop&s=f12a57dc1196eca3fe2f4badb2f59598);
  opacity: 0.5;
}

.panel4 { background-image:url(https://images.unsplash.com/photo-1473436410403-80c143b30868?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1500&h=1500&fit=crop&s=f2b0d0be549612faf719a7badc31770e); opacity: 0.5;}

.panel5 { background-image:url(https://source.unsplash.com/3MNzGlQM7qs/1500x1500); opacity: 0.5;}

.panel6 { background-image:url(https://images.unsplash.com/photo-1469041635451-4512b21a9326?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1500&h=1500&fit=crop&s=72acb52cc82570da5ed684f68e560f94); opacity: 0.5;}
.panel7 { background-image:url(https://images.unsplash.com/photo-1466969399269-075c521856a1?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1500&h=1500&fit=crop&s=e0723eee11d3981ed58cba665236fad1); opacity: 0.5;}
.panel8 { background-image:url(https://images.unsplash.com/photo-1433550249216-2661838e60d8?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=1500&h=1500&fit=crop&s=3db8fdded397d0cbdbecdfcca85d54bf); opacity: 0.5;}

p {
  padding: 1em;
  font-size: 1.25em;
  text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000;
  opacity: 1;
}