/* Reset and basic styling */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
    color: #333;
}

header, footer {
    background-color: #222;
    color: #fff;
    /* keep full-width background but content will be limited by .container */
}

/* container to constrain content width on all sections */
.container {
    width: 90%;          /* shrink on narrow viewports */
    max-width: 900px;
    margin: 0 auto;
    padding: 1rem 2rem;
}

/* adjust main to use container spacing as well */
main {
    padding: 2rem;
    width: 90%;
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

nav a {
    margin-right: 1rem;
    color: #00aced;
    text-decoration: none;
}

nav a:hover {
    text-decoration: underline;
}

h1, h2, h3 {
    margin-top: 0;
}

section {
    margin-bottom: 2rem;
}

/* Indent first paragraph of intro section */
#intro p {
    text-indent: 2em;
}

.profile-img {
    float: right;
    margin: 0 0 1rem 1rem;
    max-width: 150px;
    border-radius: 50%;
}

footer p {
    text-align: center;
    font-size: 0.9rem;
}