style.css

body{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

li {
    text-decoration: none;
    display: inline;
    padding: 5px;
    
}

li:hover{
    cursor: pointer;
}



ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

article{
    width: 40%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.card {
    /* Add shadows to create the "card" effect */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    transition: 0.3s;
    height: 60vh;
    padding: 20px;
    position: relative;
    clear: both;
    
}

/* On mouse-over, add a deeper shadow */

.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

sub{
    position: absolute;
    bottom: 5%;
    right: 30%;
    left: 30%;
}

img{
    width: 50%;
}

p{
    margin-top: 10%;
}