reshuffle some naming to work in artists part of sitemap

assets/styles/artist-resident.css

@@ -0,0 +1,55 @@
+.resident {
+  margin: 2rem auto;
+  display: grid;
+  grid-template: 
+    'img h1'
+    'img desc'
+    'img .';
+  grid-template-columns: 1fr 1fr;
+}
+
+@media (max-width: 1050px) {
+  .resident {
+    grid-template: 
+      'img'
+      'h1'
+      'desc';
+  } 
+}
+
+.resident h1 {
+  grid-area: h1;
+  font-size: 2rem;
+  margin: 0;
+  border-bottom: solid var(--color-accent);
+}
+
+.resident img {
+  grid-area: img;
+  border-radius: 1rem;
+}
+
+.resident .bio {
+  grid-area: desc;
+  margin-left: 1.75rem;
+}
+
+@media (max-width: 1050px) {
+  .resident img {
+    border-radius: 1rem 1rem 0 0;
+    border-bottom: solid var(--color-accent);
+  }
+
+  .resident .bio {
+    margin: 0;
+  }
+}
+
+.contact {
+  margin-top: 4rem;
+  text-align: center;
+}
+
+.contact li {
+  list-style: none;
+}

assets/styles/directory.css

@@ -1,4 +1,4 @@
-#events {
+#directory {
   display: grid;
   flex-flow: row wrap;
   grid-template-columns: repeat(2, 1fr);
@@ -6,12 +6,12 @@
 }
 
 @media (max-width: 850px) {
-  #events {
+  #directory {
     grid-template-columns: 1fr;
   }
 }
 
-#events li {
+#directory li {
   list-style: none;
   border: solid thin var(--color-accent);
   border-radius: .5rem;
@@ -19,35 +19,35 @@
 }
 
 @media (any-hover: hover) {
-  #events li:hover {
+  #directory li:hover {
     background-color: var(--color-text);
     border-color: var(--color-text);
   }
 
-  #events li:hover h2 {
+  #directory li:hover h2 {
     color: var(--color-bg);
   }
 }
 
-#events li:focus-within {
+#directory li:focus-within {
   outline: solid .25rem var(--color-accent);
 }
 
-#events a {
+#directory a {
   text-decoration: none;
   margin: 0;
 }
 
-#events a:focus-visible {
+#directory a:focus-visible {
   outline: none; /* outline handled by li:focus-within */
 }
 
-#events h2 {
+#directory h2 {
   text-align: center;
   margin-top: 1rem;
 }
 
-#events img {
+#directory img {
   margin: 0;
   border-radius: 0 0 .5rem .5rem;
 }

assets/styles/main.css

@@ -140,3 +140,7 @@ main > ul {
     margin-left: 1.25rem;
   }
 }
+
+.ml-embedded {
+  margin: 2rem auto;
+}