How can i add more space between links so that the whole button is showing?

I have a CSS problem, my buttons is hiding the button below.

This is what a single button should look like

Currently i have them wrapped in a paragraph

<p><a href="#" class="link">1. Aaahh!!! Real Monsters</a></p>
<p><a href="#" class="link">2. ActRaiser</a></p>
<p><a href="#" class="link">3. Addams Family Values</a></p>

The CSS for the buttons:

.link {
    background-color: red;
    box-shadow: 0 5px 0 darkred;
    color: white;
    padding: 0.5em 1.5em;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
  }

  .link:hover {
    background-color: #ce0606;
    cursor: pointer;
  }

  .link:active {
    box-shadow: none;
    top: 5px;
  }

How can I show the whole button?