.title { grid-area: title; }

.art { grid-area: art; }
.art img { 
height:65vh;
border-radius:2.3em; 
border:2px solid #A5D6E9; 
margin:0 0 1vw 0; 
}
.art img:hover { 
cursor: zoom-in;
}

.description { grid-area: description; }

.highlight {
  height: auto;
  width: 97vw;
  left: 0px;
  display: grid;
  grid-template-areas:
    'title'
    'art'
    'description';
  overflow-y: auto;
  overflow-x: hidden;
  top: 7em;
  z-index:1;
  padding:0 10vw 0 0;
}

.highlight > div {
  text-align: center;
  font-family: Quicksand;
  color: white;
}

p { color: white; }
p a, p a visited { color: #A5D6E9; }
p a:hover, p a visited:hover { color: lightcoral; }

h2 { font-weight:strong; margin:0px; padding:0px;}

.nextcard {
  position:fixed;
  font-size: 2em;
  background-color: #F1D4BB;
  border-radius: 50px;
  padding:15px;
  border: 3px solid #A5D6E9;
  z-index:9;
  right:5vw;
  bottom:5vh;
}

.nextcard a { text-decoration: none; color:midnightblue; }
.nextcard a:hover { color:lightcoral; }
.nextcard a:visited { color:midnightblue; }
.nextcard a:hover:visited { color:lightcoral; }

.lastcard {
  position:fixed;
  font-size: 2em;
  background-color: #F1D4BB;
  border-radius: 50px;
  padding:15px;
  border: 3px solid #A5D6E9;
  z-index:9;
  left:5vw;
  bottom:5vh;
}

.lastcard a { text-decoration: none; color:midnightblue; }
.lastcard a:hover { color:lightcoral; }
.lastcard a:visited { color:midnightblue; }
.lastcard a:hover:visited { color:lightcoral; }


@media (max-width: 900px) {
.lastcard {font-size: 1.2em;}
.nextcard {font-size: 1.2em;}
}