div.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

div.gallery-item {
  margin: 5px;
  border: 5px solid; /* thicker so gradient shows well */
  border-image: linear-gradient(to bottom right, aqua, purple) 1;
  width: 180px;
  border-radius: 10px; /* optional, for smoother look */
  overflow: hidden;
}

div.gallery-item:hover {
  border: 1px solid #777;
}

div.gallery-item img {
  width: 100%;
  height: auto;
}

div.gallery-item div.desc {
  padding: 15px;
  text-align: center;
}
     h1  {
            color:purple;
            font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
            font-size: 6;
        }
        h2, h3, h4, h5, h6 {
            color: purple;
            font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
            font-size: 24px;
        }
        body {
            background-color: grey;
            margin: 20px;
            
        }
        p {
            color: aquamarine;
        }
        li {
            color: aquamarine;
        }
        dd {
            color: aquamarine
        }
        dt {
            color: aquamarine
        }
        hr {
            border: none;            
            height: 3px;             
            background-color: purple; 
            width: 500;
}