#container {
    max-width: 1220px;
    min-width: 720px;
    border: 10px double #000;
    margin: 50px auto 50px auto;
    padding: 20px;
}

h1,h2,h3 {
    font-family: Dm Serif Display, serif;
    
}

body {
    font-family: Red Hat Display, sans-serif;
    font-optical-sizing: auto;
    font-weight: 300px;
}
ul {
    width: 570px;
    padding: 15px;
    margin: 0px auto 0px auto;
    border-bottom: 2px solid #000;
    text-align: center;
}
li {
    display:inline;
    margin: 0px 3px;
}
a {
    color: #31231e;
    text-transform: uppercase;
    text-decoration: none;
    padding: 6px 18px 5px 18px;
}
a:hover {
    color: #97746a;
    background-color:rgb(241, 238, 233);
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
/*photo links*/
#photo-link {
    background-color: white;
}
.title {
    text-align: center;
    margin: 10px auto 10px auto;
    padding: 5px;
    font-size: 65px;
    color: #31231e;
}
/*For project buttons */
.display {
    text-transform:capitalize;
    font-size: 20px;
}
.display:hover {
    color: #af21a8;
    background-color: rgba(152, 230, 152, 50%);
    border-radius: 10px;
}
/*For project buttons above */
.subhead {
    text-align: center;
    margin: 10px auto 10px auto;
    padding: 3px;
    font-weight: 150;
    font-size: 30px;
    font-style: italic;
    color: #84714f;
}
#logo {
    width: 210px;
    margin: 5px auto 5px auto;
    
}
#image {
    text-align: center;
    width: 300px;
    margin: 5px auto 5px auto;
}
.block {
    display:block;
    margin: 20px auto 20px auto;
    padding: 5px;
    text-transform: capitalize;

}
p {
    text-align: center;
    max-width: auto;
    min-width: auto;
    font-size: 17px;
}