/* CSS Reset */
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI';
}

/* Navigation Styling */
nav {
    background: darkblue;
    width: 100%;
}

nav ul {
    display: flex;
    list-style: none;
    align-items: center;
}

/* Text Styling */
p {
    color: #000000;
    font-size: 1em; 
    margin-bottom: 2em;
    margin-left: 5em;
    margin-right: 5em;
    text-align: center;
}

h1 {
    font-size: 2em; 
    margin-bottom: 0.5em;
    margin-left: 5em;
    margin-right: 5em;
    text-align: center;
}

h2 {
    margin-bottom: 0.5em;
    margin-left: 5em;
    margin-right: 5em;
    font-size: 1em;
    text-align: center; 
}

pre {
    text-align: center;
}

/* Body Styling */
main {
    padding-bottom: 1em;
    font-size: 1em;
    background-color: lavender;
}

footer {
    padding: 1em;
    font-size: 0.8em;
    margin-top: 10em;
    background-color: lavender;
}


section {
    display: flex;
    flex-direction: column;
}

section img {
    display: flex;
    align-self: center;
    width: 35em;
    margin-bottom: 1.5em;
    border-radius: 1em;
}

img {
    width: 100%;
}

/* Button Styling */
a {
    color: #f2f2f2;
    text-align: center;
    padding: 1em;
    text-decoration: none;
    font-size: 1.8em;
    transition: all 350ms ease;
  }

a:hover {
    background: lightcyan;
    color: darkblue;
    padding: 1.5em;
  }