.faux-table {
  display: grid;
  grid-template-columns: 100px auto;
  width: 400px;
  border: 2px grey outset;
  grid-auto-flow: dense;
  grid-gap: 10px;
}
.faux-table > h1 {
  grid-column-start: 2;
  margin: 0;
  text-align: center;
}
.id-img-container {
 grid-column-start: 1;
 grid-row: 1 / span 3;
}
.faux-table > dl {
 width: 200px; 
  
}

.faux-table > p {
  
}

.faux-table4 {
  display: grid;
  grid-template-columns: 100px auto auto;
  width: 350px;
  border: 2px grey outset;
  grid-auto-flow: dense;
  grid-gap: 10px;
}

.faux-table4 > h1 {
  grid-column: 2 / span 2;
  margin: 0;
  text-align: center;
}
.faux-table4 > p {
 line-height: 0; 
}

.faux-table4 > key {
 width: 100px; 
  
}
.faux-table4 > .answer {
  grid-column: span 2;
}
.faux-table4 > .answer2 {
  grid-column: span 1;
}
.faux-table4 > .answer-featured {
  grid-column: span 1;
}
.faux-table4 > .paw {
 grid-row: 4 / span 4;
 grid-column: 3;
}


.cat-id2 {
  display: grid;
  grid-template-columns: repeat(3, minmax(auto, 1fr));
  width: 350px;
  border: 1px #fff solid;
  border-width: 1px 0 0 1px;
  grid-auto-flow: dense;
  grid-gap: 10px;
  border-radius: 9px;
  box-shadow: 5px 5px 10px #ddd;
}
.cat-id2 > .id-img-container {
 grid-column-start: 1;
 grid-row: 1 / span 3;
 border-radius: 9px 0 0 0;
 background-image: url('../images/blayne.jpg');
 background-repeat: no-repeat;
 height: 100px;
 width: 100px;
}
.cat-id2 > h1 {
  grid-column: 2 / span 2;
  margin: 0;
  text-align: center;
}
.cat-id2 > p {
  margin: 0;
}

.cat-id2 > key {
 width: 100px; 
  
}
.cat-id2 > .answer {
  grid-column: span 1;
}

.cat-id2 > .paw {
 grid-row: 4 / span 4;
 grid-column: 3;
}

.id-card {
 width: 300px; 
 position: relative;
 margin: 10px;
 background-color: rgb(255,255,255);
 border-radius: 12px;
}
.id-img-container2 {
  width: 100px;
  /*height: 100px;*/
  /*position: absolute;*/
  /*top: 0;*/
  /*left: 0;*/
  border-radius: 12px 0 0 0 ;
}
.id-card-header {
  float: right;
  margin:0;
}



.parent {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(5, 1fr);
    gap: 8px;
    width: 300px;
    border: 1px solid grey;
}
    
.div1 {
  grid-column: 2 / span 2;
  margin: 0;
  text-align: center;
   grid-row-start: 1;
}

.div2 {
  grid-row: span 3 / span 3;
    
}

.div3 {
    grid-column: span 2 / span 2;
    grid-column-start: 2;
    grid-row-start: 4;
}

.div4 {
    grid-column: span 2 / span 2;
    grid-column-start: 2;
    grid-row-start: 5;
}