* {
    box-sizing: border-box;
}

body {
    padding : 30px;
}

.brand {
    font-family: 'lobster';
    font-size: 60px;
    font-weight: normal;
    text-align: center;
}

.brand-header {
    grid-area: header;
}
  
.nav-links {
    grid-area: nav;
}

.story-1 {
    grid-area: story-1;
}

.story-2 {
    grid-area: story-2;
}

.story-3 {
    grid-area: story-3;
}

.story-4 {
    grid-area: story-4;
}

.story-5 {
    grid-area: story-5;
}
  
  
.page {
    display: grid;
    grid-template-areas:
        "header header header"
        "nav nav nav"  
        "story-1 story-2 story-3"
        "story-4 story-5 story-5";
}

.story-title {
    font-size: 30px;
    text-align: center;
    font-weight: normal;
    font-style: italic;
}

.headline-img {
    display: block;
    margin: 0 auto;
    max-height: 250px;
}

.story {
    padding: 10px;
    border-left: 3px solid black;
    border-bottom: 3px solid black;
}

.story-3, .story-5 {
    border-right: 3px solid black;
  }

.nav-links {
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: #f4f4f4;
    padding: 30px;
    list-style: none;
    border: 3px solid black;
    margin: 0;
}

.section-link {
    color: black;
    text-decoration: none;
    font-size: 30px;
    font-weight: bold;
    font-family: "Futura";
    color: #666;
}

.section-link:hover {
    text-decoration: underline;
  }