@import "inter/inter.css";

@font-face {
  font-family: "Pinyon Script";
  src: url("PinyonScript-Regular.ttf") format("truetype");
}

/* lavenderblush
 * pink
 * plum
 * rebeccapurple
 * midnightblue
 *
 * */
html {
  font-family: "Inter", sans-serif;
  background: lavenderblush;
  color: midnightblue;
}
::selection {
color: lavenderblush;
background: midnightblue;
}
header {
  display: flex;
justify-content: space-evenly;
align-items: center;
}
@media screen and (max-width: 360px) {
header {flex-wrap: wrap;}
}
h1, h2, h3 {font-family: "Pinyon Script", cursive; 
  letter-spacing: -0.02em;
margin: auto 0.3em;
}
svg + h1 { display: inline-block;}
h1 {font-size: 3.5rem;
filter: drop-shadow(0.03em 0.03em 0 plum) drop-shadow(-0.03em -0.03em 0 white) drop-shadow(0.03em -0.03em 0 pink) drop-shadow(-0.03em 0.03em 0 pink);
}

h1 a {text-decoration: none;}
h2 {font-size: 2.75rem;
}
h3 {font-size: 2rem;}

h2, h3, h4, h5, h6 {
margin-bottom: 0;
margin-block-start: 0.9em;
margin-block-end: 0;
}
a {color: rebeccapurple;}
#trashcat {height: auto; max-width: 100vw; min-width: 150px;}
#trashcatline {fill: midnightblue;}
#trashcatmid {fill: plum;}
main {max-width: 60ch; margin-left: auto; margin-right: auto;}
main p {
letter-spacing: -0.0109598em; line-height: 1.375em;
}