import { css } from "lit";

export const shared = css`
  @import url("https://fonts.googleapis.com/css2?family=Acme&family=Oswald&display=swap");

  h1 {
    margin: -11px 6px;
    font-family: "Acme", sans-serif !important;
  }
  h1 {
    order: 2;
    color: #fde9ff;
    text-shadow: 3px 1px 1px #4af7ff, 2px 2px 1px #165bfb, 4px 2px 1px #4af7ff, 3px 3px 1px #165bfb, 5px 3px 1px #4af7ff, 4px 4px 1px #165bfb,
      6px 4px 1px #4af7ff, 5px 5px 1px #165bfb, 7px 5px 1px #4af7ff, 6px 6px 1px #165bfb, 8px 6px 1px #4af7ff, 7px 7px 1px #165bfb, 9px 7px 1px #4af7ff;
  }
  h1 {
    display: block;
    position: relative;
  }
  h1:before {
    content: attr(data-text);
    position: absolute;
    text-shadow: 2px 2px 1px #e94aa1, -1px -1px 1px #c736f9, -2px 2px 1px #e94aa1, 1px -1px 1px #f736f9;
    z-index: 1;
  }
  h1:nth-child(1) {
    padding-right: 2.25rem;
  }
  h1:nth-child(2) {
    padding-left: 2.25rem;
  }
`;