text: import { css } from '@emotion/react'
  export const globalStyles = css`
    /* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
  */
    html,
    body,
    div,
    span,
    applet,
    object,
    iframe,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    blockquote,
    pre,
    a,
    abbr,
    acronym,
    address,
    big,
    cite,
    code,
    del,
    dfn,
    em,
    img,
    ins,
    kbd,
    q,
    s,
    samp,
    small,
    strike,
    strong,
    sub,
    sup,
    tt,
    var,
    b,
    u,
    i,
    center,
    dl,
    dt,
    dd,
    ol,
    ul,
    li,
    fieldset,
    form,
    label,
    legend,
    table,
    caption,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td,
    article,
    aside,
    canvas,
    details,
    embed,
    figure,
    figcaption,
    footer,
    header,
    hgroup,
    menu,
    nav,
    output,
    ruby,
    section,
    summary,
    time,
    mark,
    audio,
    video {
      margin: 0;
      padding: 0;
      border: 0;
      font-size: 100%;
      /* stylelint-disable-next-line */
      font: inherit;
      vertical-align: baseline;
    }
  
    /* Added to Fix Footer to bottom of viewport */
    html,
    body {
      background: white;
      height: 100%;
      width: 100%;
    }
    .siteRoot {
      height: 100vh;
      display: flex;
      flex-direction: column;
    }
    .siteContent {
      display: flex;
      flex-direction: column;
      flex: 1 0 auto;
    }
    footer {
      width: 100%;
    }
  
    /* End Fix to Place Footer on Bottom of Viewport */
  
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    menu,
    nav,
    section {
      display: block;
    }
  
    @media screen and (min-width: 35em) {
      html {
        margin-right: calc(-100vw + 100%);
        overflow-x: hidden;
      }
    }
  
    ol,
    ul,
    li {
      list-style: none;
    }
  
    blockquote,
    q {
      quotes: none;
    }
  
    blockquote::before,
    blockquote::after,
    q::before,
    q::after {
      content: '';
      content: none;
    }
  
    table {
      margin: 0 0 24px;
      border: 1px solid black;
      border-collapse: collapse;
      border-spacing: 0;
      width: 100%;
      th {
        background: #ddd;
        font-weight: 400;
      }
      th, td {
        border: 1px solid #bbb;
        padding: 10px 15px;
        line-height: 2.2;
      }
    }
  
    iframe h1 {
      padding-top: 30px;
    }
  
    * {
      box-sizing: border-box;
    }
  
    body {
      line-height: 1;
      font-size: 100%;
      font-variant-ligatures: none;
      text-rendering: optimizeLegibility;
      text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
      font-weight: 400;
    }
  
    img {
      display: block;
      width: 100%;
      height: auto;
    }
  
    button,
    input,
    textarea,
    select {
      font-family: inherit;
      font-size: inherit;
      background: none;
      border: none;
      appearance: none;
      border-radius: 0;
      resize: none;
      &:invalid {
        box-shadow: none;
      }
      &:focus {
        outline: 5px auto #5e9ed6;
        outline: 5px auto -webkit-focus-ring-color;
      }
    }
  
    body:not(.user-is-tabbing) button:focus,
    body:not(.user-is-tabbing) input:focus,
    body:not(.user-is-tabbing) select:focus,
    body:not(.user-is-tabbing) textarea:focus,
    body:not(.user-is-tabbing) a:focus {
      outline: none;
    }
  
    a {
      text-decoration:none;
    }
  
    .btn-flat-dashed-filled {
      display: inline-block;
      padding: 0.5em 1em;
      text-decoration: none;
      color: #67c5ff;
      border: dashed 1px #67c5ff;
      background: #f2fcff;
      border-radius: 3px;
      transition: .4s;
      width: 100%;
      text-align: center;
    }
    
    .btn-flat-dashed-filled:hover {
      background: #cbedff;
      color: #FFF;
    }
    
    .btn-flat-dashed-filled[target="_blank"] {
      position:relative;
      padding-right: 5px;
    }
  
    .btn-flat-dashed-filled[target="_blank"]:after {
      content: '';
      display: inline-block;
      height: 6px;
      width: 10px;
      margin-bottom: 2px;
      margin-left: 3px;
      border-top: 0px #E56B21 solid;
      border-right: 0px #E56B21 solid;
      border-bottom: 1px #FDF0E9 solid;
      border-left: 1px #FDF0E9 solid;
      background-color: #E56B21;
      box-shadow: -2px 2px 0 -1px #E56B21;
    }
  `
  