a:link {
    color: Navy;
    text-decoration: none;}
            
a:visited {color: Navy;}
a:hover {color: deeppink;}
a:active {color: Navy;}

.item-c img {max-width: 100%; align-self: center;}

.item-d a {width: 40vw;}

h1, h2, h3 {font-family: "Courier New"; text-align: center;}

p {font-size: 16px;}

figcaption {
    font-family: arial;
    text-align: center;
    padding-top: 5px;
    color: DimGrey;
    font-size: 12px;
}

body {
  display: grid;
  justify-items: center;
  align-items: normal;
  background-image: url("Images/starsbg.gif") !important;
}

.cardboard-box {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr auto;
    border: dashed Gold 2px;
    max-width: 60vw;
    overflow: auto;
}

.item-a, .item-b, .item-c{
  border: solid Coral 3px;
  padding: 5px;
  background-color: AntiqueWhite;
  margin: 5px;
}

.item-a {
  grid-column: auto / span 12;
  padding: 5px;
}

.item-b {
  grid-column: auto / span 3;
  padding: 0px 1vw 20px 1vw;
}

.item-c {
  grid-column: auto / span 9;
  display: flex;
  flex-direction: column;
  padding: 0px 5vw 0px 5vw;
}

.item-c img {
  width: 100%;
}

@media only screen and (max-width: 750px) {
  .item-a {grid-column: auto / span 12;}
  .item-b {grid-column: auto / span 12;}
  .item-c {grid-column: auto / span 12;}
  .item-d {grid-column: auto / span 12;}
  .cardboard-box {max-width: 95vw;}
}