/* primary: #687351
secondary: #9BA17F
#E8E4DB
#C9C1AE


*/

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Manufacturing+Consent&family=Quintessential&display=swap');

.manufacturing-consent-regular {/*heading font*/
  font-family: "Manufacturing Consent", system-ui;
  font-weight: 400;
  font-style: normal;
}
.quintessential-regular {/*subheading font*/
  font-family: "Quintessential", serif;
  font-weight: 400;
  font-style: normal;
}
.eb-garamond {/*paragraph font*/
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
#welcome {
    font-size: 18px;
    padding: 15px;
}
#welcome h3 {
    text-align: center;
    font-size: 23px;
}

body{
    background-color: #687351;
}










a{
    text-decoration: underline;
    color: black;
    
}





#artsnip{
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 1.3fr 3fr;
    grid-template-rows: 1fr 0.5fr;
    background-color: #9BA17F;
    gap: 10px;
    padding: 1fr;
    margin: 15px;
    max-height: 170px;

}
#artimg{
    max-width: 150px;
    grid-column: 2/3;
    grid-row: 1/3;
}
#dessnip{
    font-family: 'Quintessential';
    /*max-width: 100px;*/
    grid-column: 3/4;
    grid-row: 1/2;
}
#datesnip{
    text-align: center;
    align-items: center;
    padding: 15px;
    grid-column: 1/2;
    grid-row: 1/3;
}
#authsnip{
    font-family: 'Quintessential';
    grid-column: 3/4;
    grid-row: 2/3;
    text-align: center;
}
#Snippetbox{
    text-align: center;
    font-family: 'Manufacturing Consent';
    padding: 15px;
    background-color: #687351;

}
#sniphead{
    background-color: #687351;
    font-size: 25px;
}
footer { 
    border-top: 3px solid #687351;
    background-color: #9BA17F;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 15px;    
    text-align: center;
    align-items: center;

    position: fixed;
    bottom: 0;
    height: 50px;
    width: 100%;
    text-align: center;
}
footer h2 {
    font-family: 'Manufacturing Consent';
    grid-column: 1/2;
}
#footernav {
    grid-column: 2/3;
}
#toplink{
    height: 110px;
    text-align: center;
}
main {
    background-image: url('images/crumpled_paper.jpg');
    /*font-family: 'Quintessential';*/
}
nav {

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    padding: 15px;    
    text-align: center;
    align-items: center;
    font-family: 'Manufacturing Consent';
    background-color: #9BA17F;
}
nav h1 {
    grid-column: 1/3;
}
nav button{
    padding: 16px;
    position: absolute;
    left: 90%;
    top: 50px;
}
.menu{
    display: none;
    position: absolute;
    top: 96px;
    right: 5%;
    background-color: bisque;
    min-width: 100px;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.856);
    z-index: 1;
    font-family: 'Manufacturing Consent';
}
.menu a{
    float: none;
    padding: 10px;
    display: block;
    text-align: center;
    font-family: 'Quintessential';

}
.menu a:hover {background-color: #687351;}



.buttondiv:hover .menu {display: block;}